Alt-teksti: Mitä se on ja miten se kirjoitetaan

Intro

Tässä oppaassa kerrotaan vaihtoehtoisesta tekstistä (eli alt-tekstistä): mitä se on, miksi se on tärkeä sivun SEO:n kannalta, miten sitä käytetään oikein ja paljon muuta.

Alt-teksti jää usein huomiotta, mutta jokaisessa verkkosivuston kuvassa pitäisi olla Alt-teksti. Enemmän tietoa on parempi, ja visuaalisen tiedon kääntäminen tekstiksi on ratkaisevan tärkeää hakukoneiden bottien ja ruudunlukijoiden kannalta. Alt-teksti on tietolähde, joka liittää ideat ja sisällön yhteen verkkosivustollasi.

Tämä käytännönläheinen opas sisältää vinkkejä ja neuvoja, joita voit heti käyttää verkkosivustosi kuvien hakukoneoptimoinnin ja saavutettavuuden parantamiseen.

Mikä on Alt-teksti?

Vaihtoehtoinen teksti (tai alt-teksti) - joka tunnetaan myös nimellä alt-attribuutti tai alt-tagi (joka ei ole teknisesti oikein, koska se ei ole tagi) - on teksti, joka kuvaa kuvaa HTML-koodissa.

Mitkä ovat Alt-tekstin käyttötarkoitukset?

Alt-tekstin alkuperäinen tehtävä oli kuvata kuvaa, jota ei voitu ladata. Vuosia sitten, kun internet oli hitaampi, alt-teksti auttoi käyttäjiä ymmärtämään liian raskaan kuvan sisällön.

Nykyään alt-teksti auttaa hakukoneiden botteja ymmärtämään kuvan sisällön ja asiayhteyden. Vielä tärkeämpää on, että alt-teksti on kriittinen esteettömyyden ja ruudunlukuohjelmia käyttävien ihmisten kannalta:

• Saavutettavuutta varten: Alt-teksti auttaa vammaisia (esimerkiksi ruudunlukijoita käyttäviä) ymmärtämään kuvan sisällön.

• SEO:lle: Alt-teksti tarjoaa hakukoneille lisää kontekstia, joka auttaa niitä ymmärtämään sivun sisältöä paremmin.

Miksi Alt-teksti on tärkeää

Verkko on visuaalinen kokemus, joten alt-teksti on ratkaisevan tärkeä. Se kääntää kuvan sisällön sanoiksi ja tekee siitä helpommin lähestyttävän laajemmalle yleisölle, kuten vammaisille ja hakukoneiden boteille, jotka eivät vielä ole tarpeeksi älykkäitä ymmärtääkseen täysin jokaista kuvaa, sen asiayhteyttä ja merkitystä.

Miksi Alt-teksti on tärkeää SEO:n kannalta

Alt-teksti on olennainen osa sivun sisäistä SEO-optimointia. Oikeanlainen alt-tekstin optimointi parantaa verkkosivustosi mahdollisuuksia sijoittua Googlen kuvahauissa, mikä voi olla merkittävä liikenteen lähde erityisesti verkkokauppasivustoille, joilla käyttäjät aloittavat usein tuotehakunsa Google-kuvahaulla.

Miksi Alt-teksti on tärkeää saavutettavuuden kannalta

SEO:n lisäksi alt-teksti on elintärkeä myös saavutettavuuden kannalta, jotta verkko olisi avoin kaikille, myös ruudunlukuohjelmia käyttäville vammaisille. Kuvan sisällön kuvaaminen alt-tekstissä auttaa näitä käyttäjiä ymmärtämään kuvan ja sivun sisällön.

Alt-tekstin esimerkkejä

Hyviä Alt-tekstin esimerkkejä

Harkitse SEO-auditointiopasta, joka sisältää kuvakaappauksia Google Search Consolen ja Screaming Frogin kaltaisista työkaluista. Hyviä esimerkkejä alt-tekstistä ovat mm:

<img src="google-search-console-coverage-report.jpg" alt="Google Search Console -palvelun kattavuusraportti, josta näkyy indeksoitujen ja pois suljettujen sivujen määrä"> <img src="google-search-console.jpg" alt="Google Search Console -työkalu Googlelta"> <img src="screaming-frog-html-pages.jpg" alt="Luettelo HTML-sivuista Screaming Frogissa"> <img src="screaming-frog.jpg" alt="Screaming Frog -verkkokierros käynnissä">

Esimerkkejä huonosta ja/tai roskapostittavasta Alt-tekstistä

Esimerkkejä huonosta alt-tekstistä ovat avainsanojen täyttäminen tai roskapostitus:

<img src="google-search-console-coverage-report.jpg" alt="seo tarkastus ilmainen, seo tarkastus halpa, seo tarkastus asiantuntija, seo tarkastus, seo tarkastukset"> <img src="google-search-console.jpg" alt="google seo, seo google, google, seo, google search console seo"> <img src="screaming-frog-html-pages.jpg" alt="seo audit, seo audit, seo auditoinnit"> <img src="screaming-frog.jpg" alt="seo audit">

Yleiset Alt-tekstin virheet

• Alt-tekstin käyttämättä jättäminen tai tyhjän alt-tekstin käyttäminen.

• Saman alt-tekstin käyttäminen eri kuvissa.

• Käytetään hyvin yleistä alt-tekstiä, joka ei kuvaa kuvaa.

• Käytetään automaattisesti tiedoston nimeä alt-tekstinä.

Alt-tekstin kirjoitusvinkkejä

• Älä laita avainsanoja alt-tekstiin.

• Kuvaile kuvaa yksityiskohtaisesti, mutta pidä se suhteellisen lyhyenä.

• Käytä kohdeavainsanoja luonnollisesti osana kuvan kuvausta.

• Älä käytä tekstiä kuvissa. Lisää kaikki teksti HTML-koodiin.

• Älä kirjoita "tämä on kuva". Kuvaile vain kuvan sisältöä.

• Varmista, että voit hahmottaa kuvan sisällön pelkästään sen alt-tekstin avulla.

Kuvan Alt-tekstin vianmääritys

Elementtien tarkastaminen

Tarkista elementti (napsauta hiiren oikealla painikkeella ja valitse Tarkista, kun viet hiiren kursorin kuvan päälle) tarkistaaksesi, onko tietyllä kuvalla alt-teksti.

Bulk-analyysi

Jos haluat tehdä analyysin massoittain, käytä työkaluja, kuten Screaming Frog tai Sitebulb, indeksoimaan sivustoa ja tarkistamaan kaikkien verkkosivujen kuvien alt-tekstit.

Alt-teksti ei ehkä tunnu ensisijaiselta, mutta se on tärkeää

Jokaisella sisältöäsi koskevalla tietolähteellä on arvoa. Olipa kyse näkövammaisista käyttäjistä tai boteista, alt-teksti auttaa kontekstualisoimaan sivustosi kuvat. Esteettömyyteen sitoutumisen osoittaminen on myös tärkeä osa nykyaikaista digitaalista markkinointia.

FAQ

Mikä on alt-tekstin tarkoitus HTML:ssä?

Alt-teksti tarjoaa tekstimuotoisen kuvauksen kuvasta, jos sitä ei voida näyttää, mikä auttaa käyttäjiä ymmärtämään kuvan sisällön ja auttaa hakukoneiden botteja ymmärtämään kuvan aiheen.

Voiko alt-teksti parantaa verkkosivuston saavutettavuutta?

Kyllä, alt-teksti on elintärkeää verkkosivuston saavutettavuuden kannalta. Se muuntaa visuaalisen tiedon kuvaavaksi tekstiksi, jota näkövammaisten käyttäjien käyttämät ruudunlukijat voivat lukea, ja tekee verkosta osallistavamman.

Näitä vinkkejä noudattamalla voit varmistaa, että verkkosivustosi kuvat ovat saatavilla ja optimoitu hakukoneoptimointia varten, mikä parantaa sekä käyttäjäkokemusta että hakukoneiden suorituskykyä.