WordPress- nettisivujen kuvat: nopeasti latautuvat ja hakukoneoptimoidut kuvat

Oletko lisäämässä kuvia WordPress- sivustollesi?

Jos vastasit kyllä, niin ota ensin selvää miten tämä tulisi tehdä oikein, se kun ei ole aivan niin yksinkertaista, että lataisit valokuvaajasi lähettämät kuvat suoraan nettisivuillesi.

Kuvien optimointiin kuuluu kaksi vaihetta, joista ensimmäinen on kuvien koon optimointi ja toinen kuvien hakukoneoptimointi.

Miksi kuvien koon optimointi ja hakukoneoptimointi kannattaa?

Syitä on monia, miksi kuvat kannattaa ennen lataamista optimoida.

Nettisivujen latausnopeus paranee

Suuret kuvatiedostot aukeavat hitaasti ja tekevät koko nettisivuista hitaat ja sitä mukaan käyttökelvottomat. Netissä surffaillaan pikaisella temperamentilla, eikä sivujen aukeamista jaksa odotella kovin kauaa.

Verkkosivuston latausnopeus onkin yksi Googlen hakutulosten järjestämiseen vaikuttava tekijä (Google ranking factor). Tämä siis osaltaan vaikuttaa hakukonenäkyvyyteen.

Lyhimmillään sivuston latausnopeus tarkoittaa sitä aikaa, minkä Google käyttää näyttääkseen nettisivut käyttäjälle.

Hidas latausnopeus vaikuttaa siis negatiivisesti sivuston näkyvyyteen asiakkaalle, koska suurien kuvatiedostojen lataaminen vie kauemmin aikaa.

Nettisivujen tulisi ladata muutamassa sekunnissa, koska kävijöillä ei yleensä ole kärsivällisyyttä odottaa paljon kauempaa.

Google ymmärtää, mitä kuva esittää

Kuvatiedoston uudelleennimeäminen avainsanoilla (keywords) auttaa Googlea ymmärtämään mitä kuvan on tarkoitus esittää.

Tämä auttaa kotisivuasi asettumaan ylemmäs Googlen hakutuloksissa sekä näkymään myös Googlen kuvahaussa.

Tämä tarkoittaa sitä, että WordPress- nettisivujen kuvat tulisi ainakin nimetä uudelleen niitä ladatessa.

Kuvien tiedostotyypit ja suositeltavat koot

Kuvatiedostot

Nettisivujen kuvat tulisi olla muotoa PNG tai JPG.

PNG- kuvat ovat yleensä kuvia, joissa on läpinäkyvä tausta ja JPG- kuvat niitä, joilla on valkoinen tausta.

Yleisesti ottaen PNG- kuvatiedostot ovat suurempia kooltaan kuin JPG- tiedostot.

Monet kuvapankkien kuvat ja valokuvaajien ottamat kuvat ovat JPG-muotoa ja graafiset kuvat ja ikonit (favicon ja nettisivujen logot) PNG- muotoa.

Kuvatyypit ja kuvakokojen suositukset

Useimmat korkealaatuiset kuvat ovat 5MB ja 15MB välillä. Tähän kuuluu myös valokuvaajien ottamat kuvat.

Netisivuille lataamasi kuvat tulisi kuitenkin olla pienemmät, ei siis 500KB suurempia.

Etusivun alussa oleva ‘bannerikuva’ voi olla 400KB-500KB välillä, mutta kaikki muut kuvat tulisi olla sitä pienempiä.

Kuvien tarkan koon voit tarkistaa avaamalla WordPress-nettisivusi Google Chrome selaimessa ja näpäyttämällä hiiren oikeaa painiketta ja valitsemalla ‘inspect’.

Pidä hiirtä sinisen tekstiosion päällä niin, että kuva muuttuu siniseksi. Tällöin ruutuun ilmestyy kuvan koko, joka on kuvan tarkka mitoitus.

Näin osaat valita juuri oikean koon WordPress nettisivuille tulevalle kuvalle.

Pienennä kuvatiedostot kuvankäsittelyohjelmalla

Tässä vaiheessa voit pienentää kuvat kuvankäsittelyohjelmalla oikean kokoisiksi.

Tavoitteena on pienentää kuvatiedoston kokoa sen verran ettei se vaikuta kuvan laatuun. Tämän voi tehdä muokkaamalla kuvan leveyttä ja korkeutta.

Muokkaa kuvan kokoa ilmaisella kuvanmuokkausohjelmalla

Jos saatavilla ei ole maksullisia ammattilaisten työkaluja (esim. Photoshop) on olemassa myös muutamia ilmaisia ohjelmia.

Canva on helppokäyttöinen työkalu aloittelijoille. Sillä onnistuu myös kuvakokojen muokkaus.

Luo ‘custom design’ haluamallasi leveydellä ja korkeudella. Lataa haluamasi kuva Canvan kansioon. Vie kuva JPG tiedostona tietokoneellesi.

Pakkaa kuvat pienempään tilaan netissä

Kuvan mittojen pienentämisen jälkeen voit pienentää itse kuvatiedoston kokoa eli pakata kuvat. Apuna kannattaa suosia työkalua, joka säilyttää kuvan laadun. Seuraavassa yksi ohjelma, jota hyödynnän itse paljon.

Optimizilla

Optimizilla on ilmainen nettisivu, joka pakkaa kuvat helposti ja nopeasti pienempään tilaan säilyttämällä alkuperäisen kuvan laadun.

Vie kuva Optimizillan sivun keskellä olevaan laatikkoon ja odota, että se optimoi kuvan automaattisesti.

Kun kuva on optimoitu voit ladata sen koneellesi klikkaamalla ‘Download’ painiketta.

Kuvien pakkaamisen jälkeen tarkista kuvien koot kertaalleen ja huomioi, että ne ovat ainakin alle 500KB. Tarkista myös kuvan laatu. Jos kuvan laatu on jostain syystä kärsinyt, niin älä pakkaa sitä aivan niin paljoa ensi yrittämällä.

Nimeä kuvatiedostot uudelleen (hakukoneoptimointi)

Kun kuvat on pienennetty ja pakattu on aika nimetä kuvatiedostot uudelleen ennen niiden lataamista WordPress- nettisivuillesi.

Useimmat kuvat latautuvat koneellesi muodossa ‘IMG_123’, mutta tällaisenaan Google ei pysty niitä lukemaan. Näin ollen, kuvat tulisi nimetä nettisivujesi avainsanoilla (keywords), jotta hakukone ymmärtää mistä kuvassa on kyse. Älä kuitenkaan käytä kuin yhtä avainsanaa, koska muuten ylioptimoit kuvan.

Esimerkkinä seuraava kuva meidän adoptoidusta englanninbulldogista Hertasta.

Tämä kuva voidaan nimetä monella tavalla. Älä kuitenkaan käytä erikoismerkkejä tai ääkkösiä. Esimerkiksi, ‘koira.jpg’, ‘englanninbulldoggi.jpg’, ‘ruskea-englanninbulldoggi.jpg’ jne.

Lisää vaihtoehtoinen teksti eli alt-teksti

Alt-teksti auttaa hakukonetta ymmärtämään kuvan sisällön. Jos selain ei jostain syystä lataa kuvaa, niin vaihtoehtoinen teksti tulee näkyviin kuvan sijaan. 

Alt-tekstiksi voit lisätä lauseen mitä kuvassa on, mutta älä vain kirjoita eri hakusanoja pötköön, koska se voi vaikuttaa negatiivisesti hakukoneoptimointiin. Esimerkiksi, ‘ruskea englanninbulldoggi nukkuu sikeästi sohvalla kieli ulkona.’ Päätä vaihtoehtoisen tekstin lause aina pisteeseen ja muista, että kuvituskuvat ja muut taustakuvat eivät tarvitse alt-tekstiä.

WordPress-mediakirjaston yksittäisen kuvan kentissä kannattaa hyödyntää niitä lauseita, millä toivoisit yksittäisen sivun löytyvän. Jos kirjoittaisin blogia englanninbulldogistani, niin lisäisin tämän sanan jokaiseen kenttään. 

Lisää vaihtoehtoisista teksteistä löytyy täältä.

Toivottavasti nämä neuvot auttavat sinua eteenpäin WordPress- nettisivujen kuvien koon optimoinnissa sekä hakukoneoptimoinnissa.

Kirjoita alle mahdollisia kysymyksiä tai lisäyksiä, joita kirjoitukseen voisi lisätä! 🙂

Jos haluat apua kuvien optimoinnissa, niin ota yhteyttä!