5.6.1 Beskriv samtliga meningsbärande bilder och grafiska objekt med alt-text

För att bilder och andra grafiska eller multimediala objekt ska kunna tolkas av alla användare behöver de kompletteras med alternativa texter. Många personer stänger till exempel av bildvisningen i sin webbläsare när de an-vänder modem, mobiltelefoner eller handdatorer. Ett annat skäl till att an-vända alternativa texter för bilder är att hjälpmedel som läser upp text, webbläsare utan stöd för bilder och grafiska webbläsare med bildvisningen avstängd behöver alternativ i form av text för att kunna tolka grafiska ob-jekt.

Meningsbärande grafiska objekt kan behöva beskrivas mer eller mindre ingående. I HTML finns tre olika attribut som kan användas för det:

• alt används för att ange information som är nödvändig och används när bilden inte kan visas
• title innehåller utökad, icke kritisk information som många webbläsare visar som en tooltip när man för muspekaren över bilden
• longdesc innehåller en länk till ett separat dokument och är lämpligt att använda när ett bildobjekt behöver en detaljerad beskrivning

Observera att alt-text inte är till för att skapa så kallade tooltips. Vissa grafiska webbläsare visar alt-texten i en liten ruta när man för muspekaren över ett bildobjekt som har en alt-text. Det är ett felaktigt beteende eftersom alt-text ska fungera som ett alternativ till bilden när den inte kan visas.

För att ange utökad, icke-kritisk information om ett bildobjekt bör man i stället använda title-attributet. Det finns inga regler för hur title-text ska visas, men de flesta grafiska webbläsare visar den som en tooltip.

Meningsbärande bilder

Vad som är ett meningsbärande bildobjekt kan ibland vara svårt att bedöma, men det finns ett par frågor man kan ställa sig:

• Försvinner väsentlig information från sidan om bilden inte visas?
• Om jag skulle läsa upp sidan för någon per telefon, skulle jag beskriva bilden när jag kommer till den?

Om svaret på någon av frågorna är ja är bilden förmodligen meningsbärande och bör ha en alt-text.

Några tips

• Skriv korta och koncisa alt-texter på maximalt 100 tecken som talar om vad bilden är eller vilken funktion den har. Undvik att skriva att det är en bild - det sköter webbläsaren.
• Om bilden innehåller text är den texten oftast lämplig som alt-text.
• Bilder som är länkade till ett annat dokument bör ha en alt-text som beskriver vart länken leder, vanligtvis den text man skulle använda som länktext om bilden inte fanns.
• Ett grafiskt objekt som innehåller viktig information kan behöva beskrivas mer ingående än vad som är lämpligt med alt- och title-attributen. Använd i så fall longdesc-attributet för att hänvisa användaren till ett separat dokument som beskriver objektet.
• Om det inte finns stöd för longdesc i det publiceringsverktyg ni använder kan ett alternativ vara att lägga en vanlig länk till en sida med en beskrivning i anslutning till bilden.
• Ta fram en egen policy som kort beskriver hur olika objekt ska beskrivas.

Använd tomma alt-texter för icke meningsbärande bilder

När man skriver alt-text behöver man göra skillnad på meningsbärande och icke meningsbärande grafiska objekt. Icke meningsbärande grafiska objekt ska ha en tom alt-text, alt="". Observera att det inte ska vara något mellan-slag mellan citationstecknen.

I de allra flesta fall ska man ange en tom alt-text för linjer, prickar och lik-nande som används för att visuellt förtydliga den grafiska formen. Samma sak gäller för bildobjekt som i huvudsak är dekorbilder och används för att lätta upp sidor som i övrigt innehåller mycket text. Om man inte anger tomma alt-texter för sådana bildobjekt kan det skapa en hel del "brus" som den som använder en skärmläsare måste lyssna sig igenom.

Exempel

Exempel på alt-text som inte ger mervärde

Föreställ dig en bild på två leksaksbilar som krockar. Bildens alternativtext är ”Leksaksbilar krockar”. Denna information följs av en rubrik som säger ”Riskbedömning är en allt viktigare del i tillsynen”. För en användare med skärmläsare blir informationen följande:

”Grafik Leksaksbilar krockar. Rubrik Riskbedömning en allt viktigare del i tillsynen”

Alternativtexten skapar i detta fall inte ett mervärde, utan en risk för förvirring.

Exempel, tom alt-text

<img src="/riktlinjer/webb/5/6/1/bullet.gif" alt="" />

Exempel, beskrivande alt-text

<img src="/riktlinjer/webb/5/6/1/like_grass.jpg" alt="Lars Gullin: Like Grass" />

Exempel, alt- och title-text

<img src="/riktlinjer/webb/5/6/1/like_grass.jpg" alt="Lars Gullin: Like Grass" title="Lars Gullin: Like Grass, utgivningsår 1973" />

Exempel, longdesc

<img src="/riktlinjer/webb/5/6/1/like_grass.jpg" alt="Lars Gullin: Like Grass" longdesc="like_grass.html" />

Mätbarhet

• Ett bra sätt att undersöka alt-texternas betydelse är att stänga av bildvisningen och testa webbplatsen. Tilläggsprogram till webbläsaren har också flera bra funktioner för att kontrollera alt-texter.
• Ytterligare ett sätt är att besöka webbplatsen med en textbaserad webbläsare som till exempel Lynx.

Senast uppdaterad 2009-01-06