Web Dnevnik

Web dizajn, izrada web stranica


20.11.2017

Zadnja promjena 09:01:52 AM GMT

Grafika, gif animacije, optimizacija, izrada internetskih stranica

Kada smo u Fireworksu ili Photoshopu nacrtali grafički objekt ili obradili fotografiju potrebno je izvesti export u odgovarajućem formatu. Fireworks i Photoshop imaju svoje matične formate koji služe kako bi mogli elemente obrađivati direktno u njima i sami po sebi su dosta „teški“ za web stranice. Format za Fireworks je PNG, a za Photoshop PSD.Formati koji se koriste za prikaz grafike na webu su:

 


GIF


(Graphic interchange format) je 8 bitni grafički format koji u paleti boja koristi 256 boja. S obzirom da koristi format gdje se kvaliteta slike ne gubi i može dosta velike slike sažeti u malu datoteku, odnosno dosta tešku sliku komprimira, što znatno olakšalo sam download pogotovo za stara računala čije performanse su dosta slabe. Rezolucija mu je dosta mala. GIF nije baš prikladan za reprodukciju fotografija, ali je dobar za animacije, logotipe i bannere.


JPG ili JPEG


(Joint Photographic Experts Group) format koji sažimanjem same slike gubi kvalitetu, ali je u mogućnosti prikazati sliku u milijun boja, a da zauzima malo prostora. Odličan je za prikaz fotografija.

Prije nego što nacrtanu grafiku ili samu fotografiju exportiramo moramo je optimizirati, znači cilj je smanjiti joj „težinu“ a a da se pri tom ne gubi kvaliteta. Što bolju kvalitetu slike stavimo to je sama slika veća i „teža“ za učitavanje i zato moramo slike dobro promatrati o odabrati pravi omjer. Firework i Photoshop imaju odlične panele za optimizaciju i u njima se može raditi dobra usporedba. Moramo paziti kada obrađujemo slike, pogotovo ako ih povećavamo da na njima ne stvorimo gubitak, da slika ne postane zrnata. Najbolje je sliku u program uvesti u što većoj rezoluciji i tada je puno lakše s njom raditi, izrezivati dijelove s nje, smanjivati je i bez gubitka optimizirati. Većina web stranica ima posebnu galeriju slika i tu ja jako važna optimizacija, obično se velike fotografije stavljaju u headere i tu je vrlo bitna dobra optimizacija jer svi današnji monitori su dosta kvalitetni i na njima se vide svi detalji.