WCAG 1.1.1 Innehåll som inte är text

Allt som visas som bild, ikon eller annat innehåll som inte är text ska ha ett textalternativ som fyller samma syfte. I en webbutik gäller det främst produktbilder, ikonknappar och bilder som är länkar. Bilder som bara är dekoration ska i stället ha tom alternativtext så att skärmläsare hoppar över dem.

• Produktbilder utan alt-attribut, så att skärmläsaren läser upp filnamnet, till exempel IMG_4521.jpg.
• Alternativtexter som bara säger ”bild” eller upprepar produktnamnet, när kunden behöver veta färg, mönster eller modell.
• Ikonknappar för sök, varukorg och favoriter där ikonen är en bild eller svg utan textalternativ.
• Logotypen i sidhuvudet länkar till startsidan men saknar alt-text, så länken får inget namn.
• Kampanjbilder med texten inbakad i bilden, utan att samma text finns i alt eller på sidan.

Ge varje bild som bär information ett alt-attribut med det kunden behöver veta. Är bilden en länk ska texten säga vart länken leder. Dekorativa bilder får alt="".

<img src="kofta-gra.jpg" alt="Ullkofta i grått med träknappar, framsida">

<a href="/">
  <img src="logga.svg" alt="Butiksnamn, startsidan">
</a>

<img src="bakgrundsmonster.svg" alt="">

Gratistestet

Gratistestet letar efter det här i källkoden:

• Bild saknar alt-attribut. Skärmläsare läser då ofta upp filnamnet eller hoppar över bilden utan förklaring.
• Bildens alt-text säger inget om innehållet (filnamn eller ord som ”bild”).
• Knapp saknar tillgängligt namn (ingen text, aria-label eller alt på ikonen).
• Länk saknar tillgängligt namn. Ofta en ikon eller bild utan alt-text inuti länken.

Om alternativtexten beskriver bilden rätt, och om en bild är dekoration eller bär information, går inte att avgöra automatiskt. Det behöver en människa bedöma.

• Understanding 1.1.1 hos W3C (på engelska)
• Kravet i W3C:s svenska översättning

Den auktoriserade svenska översättningen gäller WCAG 2.0. Kravet 1.1.1 har samma lydelse i WCAG 2.1.