Kuvien optimointi nopeuttaa sivujen lataamista

Jatketaan optimointiteemalla (edellinen juttu käsitteli spritejä).

Nettisivuilla käytettäviä kuvia pystyy usein pakkaamaan häviöttömästi vielä vähäsen, ilman että kuvien laatu heikkenee. Pienentämällä kuvia säästää useita kilotavuja ja varsinkin runsaskuvaisella sivustolla säästöt tiedostojen koossa ja siten sivulatausten nopeudessa voivat olla tuntuvia. Jos käyttäjiä on runsaasti, myös kaistanleveydessä saadaan hyödyllisiä säästöjä.

Kuvien optimoimiseen on muutamia näppäriä työkaluja. Erilaisissa selainten optimointipalikoissa on jotain; en ole itse käyttänyt niitä. Yahoon Smush.it toimii netissä. Se on muuten kätevä, mutta suuren kuvamäärän käsittely ei suju sillä erityisen kätevästi.

Oma suosikkini on OS X:llä toimiva ImageOptim. Sille voi heittää kerralla niin paljon kuvia kuin haluaa, se jauhaa ne läpi useammalla työkalulla ja tallentaa parhaat säästöt antavan version alkuperäisen tilalle. Siispä WordPressin koko uploads-kansio omalle koneelle, prosessointi ImageOptimilla ja tiedostot takaisin paikoilleen. Näin saa käsiteltyä helposti satoja kuvia, eikä homma vaadi kuin kolme vaihetta ja vähän odottelua.

Kuvien jauhaminen pienemmäksi ImageOptimin avulla kannattaa ehdottomasti ottaa osaksi julkaisuprosessia.

ImageOptim-ohjelman ikkuna

Lautapelioppaan kuvien suurimmat säästöt. Tämänkin kuvan koosta ImageOptim muuten haukkasi kolmasosan pois.

Kysy tai kommentoi

  • (ei näy muille)

XHTML: Voit käyttää näitä tägejä: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre lang="" line="" escaped="" cssfile="">