Ärsyttääkö Google PageSpeed Insightsin valittaminen kuvien optimoinnista? Ei valita enää! Olemme juuri päivittäneet Innotan ja olemme optimoineet kuvien optimointiprosessiamme entistä paremmaksi.
Innotan yksi tärkeimmistä ominaisuuksista on ollut nopeus, ja kuvien skaalaaminen ja optimointi on aina ollut hyvin helppoa. Olemme optimoineet kaikki Innotaan ladatut kuvat aivan alusta alkaen, mutta tähän asti kuvien optimointiprosessi ei ole ollut aivan sillä tasolla mitä olisimme halunneet.
Olemme juuri päivittäneet Innotan ja nyt kuvien optimointia on tehostettu huomattavasti sekä JPEG- että PNG-muotoisille kuville.
Tulokset ovat todella vakuuttavia!
Käytännön esimerkki
Tässä on jäinen JPEG-kuva, joka on otettu ensimmäisen sukupolven Moto G -puhelimella. Kuva on muokattu hieman Snapseed-ohjelmassa. Pikkukuvia klikkaamalla näet kuvan täydessä koossa.
Vasen kuva on alkuperäinen, ja oikealla on Innotassa optimoitu versio. Jos katsot kuvia tarkkaan, huomaat joitain pieniä eroja kuvassa.
Suurin ero kuvissa on niiden koko. Alkuperäinen kuva on 1025kB ja optimoitu versio vain 345kB. Se on vain n. kolmannes alkuperäisestä ilman että kuvassa huomaa käytännössä mitään eroa!
Miten tämä on mahdollista? JPEG-kuvat sisältävät paljon ylimääräistä tietoa, joka ei näy käyttäjälle. Kuvaan tallentuu esimerkiksi tiedot kamerasta, jolla kuva on otettu, kameran asetukset ja mahdollisesti myös GPS-koordinaatit paikasta, jossa kuva on otettu. Innota poistaa nämä kaikki tiedot, jotta tiedoston koko saadaan pienemmäksi.
Innota käyttää myös työkalua nimeltään jpegoptim, jolla kuvan kokoa voidaan vielä pienentää ilman että kuvan laatu huononee.
Kuvien optimointi Innotassa
Kuvien optimointi Innotassa on naurettavan helppoa. Halutessasi voit myös jättää kuvat optimoimatta, mutta suosittelemme optimointia lämpimästi. Kuvien optimointi vähentää siirrettävän tiedon määrää ja näin sivusi latautuvat nopeammin.
Kun lataat kuvan Innotaan, voit valita haluatko optimoida kuvan ennen talennusta. Vaihtoehdoisesti voit myös skaalata kuvan jo tässä vaiheessa, jos käyttäjiesi ei tarvitse nähdä alkuperäisen kokoista kuvaa. Tämä kätevää esimerkiksi silloin, jos lataat kuvia suoraan puhelimestasi ja haluat käyttäjiesi näkevän kuitenkin vain pienemmät, skaalatut versiot.
Jos käytät image()-funktiota skaalatun version osoitteen hakemiseen, optimoidaan kuva automaattisesti sen jälkeen kun se on skaalattu haluamaasi kokoon.
Lisätietoja kuvista ja niiden skaalamisestä löydät Innotan ohjeista.
