Näin hakukoneoptimoit kuvat sivustollasi

Nettisivuilla olevat kuvat voidaan hakukoneoptimoida kuvahakuun helposti, tidoston nimi ja kuvaus vaikuttaa siihen. Jos kuvassa on koiria ei kannata nimetä kuvaa koirat.jpg vaan voit kuvailla kuvaasi mahdollisimman tarkasti esimerkiksi tiedosto nimi: ruokailevat-koirat.jpg ja kuvan kuvaus on "Katso ruokailevia koiria" kuvauksella tarkoitetaan kuvan ALT tagia.

Miksi kannattaa optimoida kuvat?

Hakukoneet tarjoavat kuvahakua jota myös useampi ihminen kyttää etsiessään tietoa, kuvahakuun voit saada oman kuvasi nimeämällä kuvan tiedosto nimen oikein ja lisäämllä mahdollisimman tarkan kuvauksen (ALT tagi). Kuvien optimoimisella tarkoitetaan myös kuvan koon pienentämistä, voit käyttää WordPress sivustolla maksutonta resmushit lisäosaa ja HTML pohjaisissa sivustoissa optimizilla nimistä verkkosivua. Miksi sitten optimoida kuvan tiedosto kokoa? Kuvat ovat yksi suurimmista tiedostoista nykyisillä verkkosivuilla ja kuvan koon optimoiminen megatavuista -> kilotavuihin nopeuttaa sivuston latautumista ja me kaikki tiedämme että hidas verkkosivusto ei hakukoneoptimoidu mitenkään hakukoneissa vaan hitaat sivut putoavat hakutuloksissa. Voit kokeilla sivustosi latausnopeutta GTmetrix nimisellä työkalulla joka myös kertoo sinulle jos sivustollasi olevat kuvat ovat ongelma latausnopeudessa. Kirjoitan sivuston latausnopeudesta erillisen artikkelin tänne ja kerron siellä myös miten voit käyttää tehokkaasti GTmetriz työkalua hakukoneoptimoinnissa.

Miksi käyttää next gen images tiedostoja?

Next Gen images on seuraavan sukupolven kuvat eli kuvien pakkaaminen jopa 70-80% pienemmäksi kuin perinteiset png, jpg ja jpeg kuva formaatit. webP on kehitetty alunperin jo 2010 ja viimeisimpänä sen otti käyttön Apple vuonna 2020 Safari 14 versiossa. webP on yksi tehokkaimmista formaateista kuville ja saat sen käyttöön WordPress sivustolla maksuttomalla webP express lisäosalla joka muuntaa kaikki kuvasi suoraan webP muotoon ja näyttää kuvat joko webP muodossa tai sitten png/jpg muodossa mikäli selain ei tue webP kuvia. HTML pohjaisissa sivustoissa tulee käyttää picture tagia jotta voit vaihtaa .htaccess tiedostossa kuvan png/jpg muodosta webP muotoon. Kuvat joudut myös muuntamaan webP formaattiin, tämä onnistuu ilmaisella paint.net ohjelmistolla joka laajennettu versio perinteisestä paint ohjelmistosta. Tässä opas englanniksi miten saat muutettua webP kuvat verkkosivustolla jos sinulla on käytössä perinteinen HTML sivusto.

Nykyisin webP kuviin törmää niin Ylen kotisivuilla kuin myös Gigantissa, eli yhä useampi taho ottaa käyttöön webP kuvat ja suosittelen sinuakin ottamaan käyttöön webP kuvat tämän avulla nopeutat sivustoasi ja mikä parasta tehostat hakukoneoptimointia siinä samalla.

Seuraava osa hakukoneoptimointi oppaassamme on: linkit.

Usein kysyttyä kuvien optimoimisesta

Miten optimoida kuvat?

Verkkosivuston kuvat voidaan optimoida kahdella eri tavalla, toinen tapa on pienentää tiedosto kokoa joka vaikuttaa latausnopeuteen. Toinen osa optimointia on optimoida kuvien tiedostonimet ja ALT tagit eli kuvaukset.

Miten voin testata sivustoni latausnopeuden?

Itse olen jo yli 7 vuotta käyttänyt GTmetrix työkalua sivuston latausnopeuden mittaamiseen, GTmetrix kertoo sinulle mikä hidastaa sivustosi latautumista ja miten voit parantaa latausnopeutta. GTmetrix on myös täysin ilmainen palvelu verkossa.

Toimiiko webP kaikissa selaimissa?

Googlen Chrome ja Mozillan Firefox on tukenut jo vuosia webP kuvia, viimeisimpänä webP tuen otti käyttöön Apple Safari 14 versiossa 2020. webP formaatti on siis seuraavan sukupolven formaatti joka pienentää jopa 80% kuvan kokoa ja se toimii nykyään läheskaikissa selaimissa, tämän vuoksi käytetään picture tagia joka vaihtaa kuvan tarkistamalla tukee selain webP formaattia.

Mitä tarkoittaa ALT ja Title tagi?

ALT tagi on kuvalle annettu kuvaus, kuvausta käytetään varsinkin silloin jos sivustolla on kävijöitä joilla on näkövamma. Title tagi on taas kuvan otsikko joka näkyy silloin kun pidt hiirtä kuvan päällä, näitä molempia voidaan käyttää kuvissa.

Miten optimoida kuvat WordPress sivustolla?

Itse olen käyttänyt pitkän aikaa resmushit nimistä lisäosaa WordPressissä se on täysin maksuton kuvien optimoija, webP kuvia varten käytän ilmaista webP express lisäosaa joka muuntaa kaikki kuvat webP formaattiin ja käyttää picture tagia kuvien vaihtamiseen png/jpg muodosta webP muotoon.