Moderni web preglednici i sustavi za upravljanje sadržajem optimiziraju slike za prikaz u svim postavkama. Međutim, najbolje je pripremiti slike koje su optimizirane za svaki mogući faktor oblika i mjesto na kojem se slika može pojaviti. Usredotočite se na tri stvari: razlučivost slike, veličinu i prostor boja.
Prostor boja u slikama
Grafički dizajneri oslanjaju se na dva osnovna prostora boja. Prostor boja je metoda kojom se primarne boje kombiniraju u složene dugine boje.
Koristite RGB način kada pripremate slike za mobilne uređaje. Zasloni na računalnim monitorima i pametnim telefonima oslanjaju se na kombinaciju crvenih, plavih i zelenih piksela. Ova RGB slika je optimizirana za točnu reprodukciju željenih boja na ekranu.
Za ispis, dizajneri koriste postupak s četiri boje, gdje se svaka boja pretvara u kombinaciju cijan, magenta, žute i crne. Ponekad se zbog toga slike u četiri boje nazivaju CMYK slike.
Rezolucija slike
Slike, posebno na mobilnim platformama, trebaju biti što manje veličine kako bi se uravnotežila kvaliteta i brzina preuzimanja na mobilnim mrežama i veličina datoteke u odnosu na ograničenja mobilnih podataka.
Većina programa, uključujući Adobe Creative Cloud aplikacije, podržava alat Export for Web koji prikazuje sliku u različitim kombinacijama rezolucije i kompresije. Odaberite sliku najbolje kvalitete uz najmanju ukupnu veličinu.
Veličina slike u pikselima
Svaka slika treba biti veličine prema svojoj namjeni. Evo nekoliko primjera veličina slika za popularne web upotrebe:
- Internet banner oglasi često su veličine 468 x 60 piksela.
- Facebook naslovne slike trebaju biti 851 piksela x 315 piksela.
- Fotografije profila na Twitteru trebaju biti veličine 400 x 400 piksela.
- Slike za dijeljene veze trebaju biti veličine 1200 x 630 piksela.
Kada radite s fotografijama za određene svrhe, provjerite mjesto na kojem će se ta fotografija pojaviti (kao što je stranica društvenih medija ili blog) kako biste provjerili optimalne dimenzije slike, a zatim odredite odgovarajuću veličinu kako biste izbjegli rastezanje ili skraćivanje slike.
Kako biste izbjegli pikselizaciju, ciljajte na stvarnu veličinu zaslona. Čak i ako je slika pravilno dimenzionirana, ako nije odgovarajuće veličine, rezultirajući proizvod može izgledati pikselizirano ako se slika mora povećati kako bi zadovoljila raspoloživi prostor.
O vektorskim slikama
Vektorske slike-slike koje izračunava i crta uređaj-obično su učinkovitije i kvalitetnije od rasterskih slika (slike koje se crtaju piksel po piksel) jer se mogu povećavati i smanjivati bez utjecaja na kvalitetu slike. Za jednostavne logotipe, crteže i grafikone idealna je vektorska verzija. Vektorski formati se ne koriste za fotografije.