Jpeg-kuvien talletus eri tavoin web-optimoiduissa muodoissa

(6.03.03/ks)

 

Esimerkissä on sama kuva talletettu ei tavoin optimoituna. Kuvan yhteydessä on kuvatiedoston koko. Kukin voi omilla silmillään katsellen arvioida mikä optimoitu talletusmuoto on käyttökelpoinen ja mikä ei. Web-sivujen käytettävyyttä ajatellen on perusteltua, että sivujen latautuminen pyritään tekemään mahdollisimman nopeaksi sivujen laadun kärsimättä. Näyttää siltä, että Save for Web -talletus antaa yhtä hyvän tuloksen kuin alkuperäinen Jpeg-kuva, kun talletuksen laaduksi valitaan Maximun. Kuvan koko kuitenkin tipahtaa lähes kolmasosaan tässä vaihtoehdossa. Oikeassa sarakkeessa alin kuva on isompi kuin web-optimoiduista kuvista kaksi sitä edeltävää. Yksi selitys tälle on se, että silloin kun web-optimointia ei tehdä, talletetaan tiedoston ikoniin kuvan painonappikuva, mikä vie oman tilansa.. Web-talletuksissa näin ei tehdä.

Näiden sivujen tekijä ei saanut näkyviin mitään silmälle havaittavaa eroa ylimmälle kuvaparille edes kuvia Photoshopilla zoomaamalla kokoon 500%. Sen mukaan kuvien talletuksessa kannattaa käyttää web-muotoista tallentamista. Alimmassa oikeanpuoleisessa kuvassa näkee selvän eron mm. kyltin teksteissä. Kuvien laatuerot luonnollisesti tulevat sitä paremmin näkyviin mitä korkealaatuisempi näyttö on kyseessä. Tässä yhteydessä on käytetty Photoshopin versiota 5.5 ja sen mukaisia englanninkielisiä termejä. Kannattaa noteerata, että kuvien koossa on suhteellisesti isot erot. Lähtökoko on yli kymmenkertainen (144 Kt) verrattuna pienimpään (12 Kt).

Jpeg-kuva talletettu maksimikoossa, koko 144 Kt.

Save for Web Jpeg maximun, koko 56 Kt.

Jpeg-kuva talletettu maksimikoossa, koko 144 Kt.

Save for Web high, koko 36 Kt

Jpeg-kuva talletettu maksimikoossa, koko 144 Kt.

Save for Web medium, koko 20 Kt.

Jpeg-kuva talletettu maksimikoossa, koko 144 Kt.

Save for Web low, koko 12 Kt.. Kooltaan pienin kuva.

Jpeg-kuva talletettu maksimikoossa, koko 144 Kt.

 

Talletus alimmalla pakkauksella (=0) ilman Web-optiota, koko 28 Kt. Tässä kuvassa mm. kyltin teksti menee suttuiseksi. Tekstin pitäisi oikeanpuoleisessa sarakkeessa vähä vähältä tulla huonolaatuisemmaksi, kun siirrytään ylemmästä kuvasta alemmaksi.