Photoshop tutoriali, html i css savjeti

Sljedeci tutorial je vrlo jednostavan, no koristi se dosta cesto, tako da, ukoliko ste pocetnik, zasigurno ce vam dobro doci.

Postoji vise nacina za izradu ovakvih slika, a mi cemo vam pokazati najjednostavniji.

Kada smo izabrali sliku, sljedeci je korak taj da je pretvorimo u crno-bijelu. (Image >> Adjustments >> Desaturate)

Alat koji koristimo za vracanje pojedinih djelova u orginal je History Brush Tool.

Sljedece sto je potrebno da odredimo velicinu brusha koja nam odgovara i da “obojamo” detalje koje zelimo vratiti na orginalno stanje.

I to je to, samo je jedna patka u boji!

Ovo je vrlo jednostavan tutorial, no vjerojatno ce te ga sustretati dosta cesto.

Jedino na sto morate paziti prilikom izrade ovakvih slika je to da ne smijete resize-ati sliku prije history brusha. Ukoliko joj mijenjate velicinu, onda je sacuvajte, te opet otvorite u toj velicini.

Ukoliko ste pocetnik u Photoshopu, kao i u designiranju stranica, sljedeci tutorial ce vam sigurno dobro doci.

Koliko vam se puta desilo da vas internet browser neku naizgled jednostavnu stranicu ocitava do nekoliko sekunda više nego ostale, usprkos brzini interneta i sl.?

Dosta designera ne ide za tim kolika je zapravo velicina slika na njihovim stranicama, pogotovo pocetnici. Mnogi previse paznje pridaju kodovima, tako da zaborave na slike!

Ukoliko radite na nacin da nacrtate veci dio povrsine, ili cak cijelu stranicu, slike izrezite na Slice-ove.

Slice-ovima odredite podjelu slika, vjerojatno ste podjelili site na header, menu, sadrzaj itd.. Na tim djelovima nece vam biti potreban isti udio boje, kao ni velicina te kvaliteta slike. Pri raspodjeli slika na sliceove, slika ce vam izgledati otprilike ovako:

Slice-ove vrlo lako mozete podesiti kako vam odgovaraju po velicini.

Sljedeci korak je i najbitniji kod optimizacije slika:

Slike nikada nemojte spremati naredbom Save as, vec sa Save for web naredbom!!! (File >> Save for web)

Izbornik prikazan na sljedecoj slici je najvazniji pri ovakvom spremanju.

Opcija Preset vam nudi brz atomatski izbor kvalitete slike.

Ispod nje, u padajucem izborniku možete izabrati u kojem formatu cete spremiti sliku. Najviše se koriste JPEG i GIF format (donekle i PNG). JPEG format je format visoke kvalitete, i njega uvijek koristite za fotografije te slike sa vecim brojem boja. Možete mu namjestiti i Quality i to je ono sto najvise utjece na velicinu slike. 60 je automatska velicina, koju možete smanjiti, ovisno o slici. Isprobajte velicinu, pa vidite koja vam najvise odgovara. Logicno, sto je manja kvaliteta, slika zauzima manje mjesta.

Kod GIF slika, mozete izabrati broj boja. Takoder, manji broj boja vodi do manje velicine slike. GIF-ove koristite za tipke i manje “umjetne” slike koje nemaju toliko boja te in JPEG format nije potreban.

Slike cije su povrsine u jednoj boji ili u jednosmjernom gradientu, možete smanjiti na velicinu jednog pixela, te u css-u namjestiti ponavljanje slike. Vise procitajte u HTML i CSS Tutorialima.