Titta på stort sett alla webbplatser på internet idag och du kommer att se att en av de saker som de har gemensamt är bilder. Bilder kan användas på webbplatser för att lägga till visuell känsla, hjälp illustrera idéer och lägga till det övergripande innehållet på sidan. Förutom att välja rätt bilder och korrekt förbereda dem för webbleverans, se till att alla bilder på din webbplats korrekt använder Alt-text är en väldigt viktig del av korrekt användning av dessa bilder på webben.
Vad är Alt Text
Alt text är den alternativa texten som används av textbläddrare och andra webbanvändare som inte kan visa bilder. Det är också en av de enda attribut som krävs av bildtaggen. Genom att skriva effektiv alt-text, säkerställer du att dina webbsidor är tillgängliga för personer som kan använda en skärmläsare eller annan assisterad enhet för att komma åt din webbplats. Du ser också till att något visas i stället för en bild om den inte laddas av någon anledning (fel väg, överföringsfel etc.). Det här är den verkliga ändamålet med Alt-text, men det här innehållet kan också ge dig fler ställen att lägga till SEO-vänlig text som sökmotorer inte kommer att straffa dig för (mer om det snart).
All text ska repetera text i bilden
Varje bild som har text i den ska ha den texten som alternativ text. Du kan placera andra ord i alternativtexten, men det borde på ett minimum säga samma sak som bilden. Om du till exempel har en logotyp för dina bilder, ska Alt-texten upprepa företagsnamnet skrivet ut med din grafiska logotyp.
Kom ihåg också att bilder som logotyper också kan innebära text - till exempel när du ser den röda bollikonen på Dotdash-webbplatsen betyder det "Dotdash.com". Så den alternativa texten för den ikonen skulle kunna säga "Dotdash.com" och inte bara "företagslogotyp".
Håll Text Short
Ju längre din alternativa text desto svårare blir det att läsa av textbläddrare. Det kan vara frestande att skriva långa meningar av alternativ text (normalt görs det för att någon försöker fylla taggen med nyckelord), men om du håller dina Alt-taggar korta håller dina sidor mindre och mindre sidor hämtas snabbare.
En bra tumregel för alternativ text är att hålla den mellan 5 och 15 ord totalt.
Använda ditt SEO-nyckelord i Alt-taggar
Människor tror ofta felaktigt att alternativ text har till syfte att sätta sökmotorns nyckelord. Ja, det är en fördel du kan använda, men bara om texten du lägger till är meningsfull för det verkliga syftet med alt-taggen - för att visa intelligent text som förklarar vad bilden är ska någon inte kunna se den!
Nu sagt att Alt Text inte menas som ett SEO-verktyg betyder inte att du inte kan använda dina nyckelord i den här texten. Eftersom alternativ text är viktig och krävs på bilder, är det osannolikt att sökmotorer straffar dig för att lägga till sökord där om innehållet du lägger till är vettigt. Kom bara ihåg att din första prioritet är dina läsare. Sökordsspammning i alternativ text kan detekteras och sökmotorer ändrar sina regler hela tiden för att förhindra spammare.
En bra tumregel är att använda sökorden i sökmotorn där de passar till beskrivningen av bilden och inte använda mer än ett nyckelord i din alternativa text.
Håll din text meningsfull
Kom ihåg att punkten för alt text är att definiera bilderna för dina läsare. Många webbutvecklare använder alternativtexten för sig själva, inklusive saker som bildstorlek, bildfilnamn och så vidare. Även om det här kan vara användbart för dig, gör det ingenting för dina läsare och bör därför utelämnas från dessa taggar.
Använd endast blank Alt Text för ikoner och kulor
Med jämna mellanrum använder du bilder som inte har någon användbar beskrivande text, till exempel kulor eller enkla ikoner. Det bästa sättet att använda dessa bilder finns i CSS där du inte behöver alternativ text. Men om du absolut måste ha dem i din HTML, använd ett tomt alt attribut snarare än att lämna det helt och hållet.
Det kan vara frestande att sätta en karaktär som en asterisk (*) för att representera en kula, men detta kan vara mer förvirrande än att helt enkelt lämna det tomt. Och att lägga texten "bullet" kommer att göra ännu mer konstigt i en textbläsare.
Redigerad av Jeremy Girard den 3/3/17