Alt-teksti eli kuvan vaihtoehtoinen teksti
Olet varmasti törmännyt verkkosivualustallasi kohtaan, jossa kuvaan voi lisätä alt-tekstin eli vaihtoehtoisen kuvauksen. Monia tämä hämmentää: miksi tällainen on olemassa, ja mitä siihen pitäisi kirjoittaa? Tässä postauksessa kerron, mitä alt-teksti oikeastaan tarkoittaa ja miksi se on tärkeä niin saavutettavuuden kuin hakukoneoptimoinninkin kannalta.
Useat verkkosivualustat kuten Squarespace mahdollistaa kuvien alt-tekstien tuottamisen tekoälyn avulla. Tämä on ihan oivallinen tapa huolehtia, että kaikille kuvilla tuo vaihtoehtoinen kuvaus on. Tässä on kuitenkin hyvä muistaa, että itse tulee nämä tekoälyn luomat kuvaukset tarkistaa, etenkin jos niistä haluaa oikeasti hyötyä.
Näkövammaliitto kertoo aiheesta kattavasti myös sosiaalisen median tilien näkökulmasta>>
Mikä alt-teksti on ja miksi se on olemassa?
Alt-teksti on kuvan yhteyteen liitettävä sanallinen kuvaus, joka kertoo, mitä kuvassa näkyy. Sen ensisijainen tarkoitus on parantaa saavutettavuutta eli nettisivujen estettömyyttä.
Kesällä 2025 saavutettavuusvaatimukset laajenivat, ja nykyisin yhä useampaa toimijaa velvoitetaan huomioimaan digipalveluissaan esteettömyys. Vaikka tämä vastikään uudistunut ja laajentunut digipalvelulaki ei varsinaisesti meitä pienyrittäjiä koske, uskon että nämä vaatimukset ovat tulevaisuudessa jo meidänkin arkipäivää. Ja tässä hetkessä saavutettavuusvaatimukset täyttämällä saamme kilpailuetua kilpailijoihimme nähden.
Käytännössä tämä tarkoittaa, että verkkosivujen tulisi olla rakennettu siten, että niitä voivat käyttää myös henkilöt, jotka tukeutuvat apuvälineisiin, kuten ruudunlukijoihin. Kuvien kohdalla tämä toteutuu juuri alt-tekstien avulla: ruudunlukija lukee tekstin ääneen ja välittää siten kuvan merkityksen käyttäjälle, joka ei itse näe kuvaa.
Kuvittele hetki, että selaat verkkosivuja ilman, että yksikään kuva avautuisi. Tiedät kyllä, että kuvia on olemassa, mutta niiden sisältö jää sinulta täysin piiloon. Turhauttavaa, eikö? Juuri tätä varten alt-tekstit on kehitetty.
Alt-tekstin kolme tärkeintä hyötyä
Saavutettavuus (ensisijainen tarkoitus): Ruudunlukijat välittävät kuvan merkityksen näkörajoitteisille käyttäjille.
Hakukoneoptimointi (toissijainen hyöty): Hakukoneet hyödyntävät alt-tekstejä ymmärtääkseen, mitä kuvassa on. Tämä voi parantaa sijoittumista myös Googlen kuvahaussa.
Varmuus kaikille käyttäjille: Jos kuva ei syystä tai toisesta lataudu, alt-teksti näkyy tilalla ja kertoo silti sisällön.
Jos olet joskus miettinyt, voiko alt-teksteistä luistaa, kysyn sinulta tämän: haluaisitko sinä olla se käyttäjä, jolle ei anneta tasavertaista mahdollisuutta käyttää verkkosivuja? Mikäli et hyödynnä alt-tekstejä sivustollasi, jää sivustolla iso osa potentiaalista hyödyntämättä, sillä erilaisia apulaitteita käyttäviltä henkilöiltä jää paljon kuvien kautta välittyvää tärkeää informaatiota saamatta.
Hyvän alt-tekstin tunnusmerkit
🚫 Huono: "laukku" (liian yleinen, ei kerro mitään oleellista)
✅ Hyvä: "Punainen nahkainen laukku, jossa on kultaiset soljet ja säädettävä olkahihna."
Hyvä alt-teksti on…
lyhyt ja selkeä (noin 125 merkkiä riittää)
kuvaileva, mutta ei toista turhaan muuta sivulla olevaa tietoa
aina päätetty pisteeseen
ilman turhia sanoja, kuten “Kuva, jossa on…”
ei pelkkä avainsanojen luettelo
👉 Koristekuville voi jättää alt-tekstin tyhjäksi (alt=""), sillä niiden ei ole tarkoitus välittää sisältöä.
Oman työni kautta olen huomannut, että hyvin laaditulla alt-tekstillä varustetut kuvat näyttävät nousevan muita paremmin hakukoneiden tuloksissa. En voi sanoa varmasti, onko kyse sattumasta vai ei, mutta ilmiöön olen kiinnittänyt huomiota. Google ei kuitenkaan tällaisia tietoja jaa (kuten ei muutoinkaan paljasta tarkkoja hakukoneoptimoinnin toimintaperiaatteita), vaan havainnot tehdään käytännön työn ja saavutettujen tulosten kautta.
Miten alt-tekstiä voi hyödyntää myös hakukoneoptimoinnissa?
On tärkeää painottaa: alt-tekstit kirjoitetaan ensisijaisesti saavutettavuutta varten. Hakukoneoptimoinnin hyödyt tulevat ikään kuin “kaupan päälle”, kun kuvaukset ovat hyvin tehtyjä ja palvelevat käyttäjää.
Katsotaan muutama käytännön esimerkki eri kuvatyypeistä:
Henkilökuvat
Kerro kuka on kuvassa ja mikä hänen roolinsa on, jos sillä on merkitystä sisällön kannalta.
Kaava: [Ulkonäön tai eleen lyhyt kuvaus], [nimi/rooli/ammatti].
Esimerkkejä:
"Pitkähiuksinen nainen hymyilee kameralle; hakukoneoptimoinnin ammattilainen."
"Verkkosivusuunnittelija esittelee uutta projektia, taustalla kannettava tietokone."
"Yrityksen perustaja seisoo toimiston edessä ja katsoo kameraan."
Tuotekuvat
Kerro tuotteen keskeiset ominaisuudet: väri, muoto, materiaali ja erottuvat yksityiskohdat.
Kaava: [Väri ja materiaali], [tuotteen tyyppi], [erityispiirre/ominaisuus].
Esimerkkejä:
"Punainen nahkainen laukku, jossa on kultaiset soljet ja säädettävä olkahihna."
"Musta langaton hiiri, ergonominen muotoilu ja rulla."
"Valkoinen keraaminen kahvimuki, jossa on painettu yrityksen logo."
Kuvitus- ja fiiliskuvat
Jos kuva tukee tunnelmaa, kerro se lyhyesti. Jos kuva ei lisää sisältöön tietoa, käytä tyhjää alt-tekstiä (alt="").
Kaava: [Kuvan sisältö tai tunnelma], [toiminta tai ympäristö].
Esimerkkejä:
"Aurinkoinen kesäpäivä järven rannalla, vihreä metsä taustalla."
"Ihmiset keskustelevat kahvilassa, rento tunnelma."