Weboldalak készítésekor gyakran felmerül a kérdés, a fotókat, képeket milyen formátumban és méretben töltsük fel. Egy optimalizált kép minimalizálja az oldal töltési idejét és a felhasználói élményt is javítja.
Egy kép tagadhatatlanul fontos része az oldal vizuális egyensúlyának, viszont rengeteg bosszúságot okozhat mind a felhasználóknak, mind pedig a webmestereknek. Ha megértjük a tömörítési eljárást, valamint képeink optimalizálásnak fontosságát, akkor a fájl méret jelentős csökkentése mellett jelentős minőség javulást is elérhetünk.
Miután elkészültünk egy adott képpel, fotóval, design elemmel, automatikusan a Mentés (Save) vagy a Mentés másként (Save as…) funkcióra ugrunk. A legtöbb esetben ez a megfelelő eljárás, de weboldal készítésekor egy kicsit körültekintőbbnek kell lennünk. Létezik ugyanis egy trükk, mellyel már alapból webre optimalizáltan menthetjük el alkotásainkat. Ez a lehetőség pedig a Save for Web & Devices … névre hallgat, és a File menüben lelhetünk rá.
Ha ezt az opciót választjuk ki, a kép elmentése előtt még számos optimalizációs beállítást elvégezhetünk, persze ez nem kötelező, sőt inkább csak gyakorlottabb felhasználóknak ajánljuk: könnyedén félre csúszhat az optimalizálás amivel szándékaink ellenére a kép nagyobbodást, minőségének romlását is elérhetjük.
Fontos néhány szót ejteni a fájlformátumokról is. Ebben a mentési lehetőségben a photoshop 3 formátumot kínál fel, s bár mindegyik kecsegtető, érdemes tisztában lenni vele, mit is jelentenek pontosan ezek a lehetőségek.
A legelterjedtebb formátum a .JPG. Ez egy ún. veszteségesen tömörített formátum, weben inkább nagy színtartományú képek és fotók megjelenítéséhez használják, ellenben a .GIF-el, valamint a .PNG-vel, melyeket ikonok készítésekor vesznek figyelembe. Ezt a tömörítési eljárást alkalmazzák a fotógráfiában is.
A második formátum immár a veszteségmentesen tömörített fájlformátumuk csoportjába tartozik, és a .PNG elnevezésre hallgat. Nagy hátránya, hogy csak korlátozott színtartományban érhető el.
És ezzel el is érkeztünk a harmadik formátumhoz, a .GIF-hez. Kicsi, gyors és veszteségmentesen tömörített, így ikonok, menük valamint kisebb design elemek megjelenítésére alkalmas.
A tévedések elkerülése végett érdemes megjegyeznünk, hogy léteznek olyan esetek, amikor érdemes a 24-bites .PNG formátumot használnunk , de jelen írásomban erre nem térek ki.
Általában nagyobb design elemek, képek és fotók megjelenítésére használjuk, hiszen bár mérete nagyobb társainál, remek minőséget érhetünk el vele, kicsinyítéskor is (legutolsó kép – Low Quality), és ezek a különbségek az átlag szem számára szinte észrevehetetlenek.
Mint már említetettem, bár veszteségmentesen tömörített képekről beszélünk, kevesebb szín áll rendelkezésünkre mint egy .JPG esetében, így általában menükhöz, ikonokhoz és logókhoz használjuk.
