Mensen met een visuele beperking kunnen afbeeldingen niet (goed) zien. Door een beschrijving van de afbeelding te geven, is de informatie uit de afbeelding voor hen toch beschikbaar. Het opgeven van tekstalternatieven is ook gunstig voor de vindbaarheid van je website in zoekmachines.

Hoe moet je dit toepassen?

In het content management systeem (CMS) is het meestal mogelijk om een alternatieve tekst voor een afbeelding op te geven (ook wel de alt-tekst genoemd).

Geval 1: Afbeelding die informatie overdraagt

Voorbeeld

Een foto van de ontmoeting tussen de minister van Buitenlandse Zaken en de Amerikaanse president.

Voeg een tekst toe die beschrijft wat je in de afbeelding ziet.

<img src=”ontmoeting_minister.jpg” alt=”Minister van buitenlandse zaken schudt de hand van nieuwe Amerikaanse president.”>

Geval 2: Decoratieve afbeelding

Decoratieve beelden mogen geen tekstueel equivalent hebben, omdat ze niet helpen om de tekst te begrijpen en dus niet van belang zijn voor de bezoeker.

Het alt-attribuut moet worden ingevoegd, maar mag geen tekst bevatten.

<img src=”golvende-lijnen.jpg” alt=”” />

Om een decoratieve afbeelding te plaatsen, kun je het bovenstaande voorbeeld gebruiken, maar het is beter om decoratieve afbeeldingen met een stylesheet (CSS) te plaatsen.

Geval 3: Afbeelding van een grafiek

Bij een afbeelding van een grafie moet de inhoud van de grafiek worden beschreven in de alt-tekst. De grafiek kan worden opgedeeld in meerdere kleine afbeeldingen met een alt-tekst, maar een samenvatting van de inhoud van de grafiek is ook goed:

<img src=”grafiek-gebruikIE6.png” alt=”Het gebruik van IE6 is gedurende de periode 2008-2012 afgenomen van 12% tot 1,6%” />

Geval 4: Afbeelding van een tekst

Soms wordt in plaats van ‘echte’ tekst een afbeelding met een tekst gebruikt. Bijvoorbeeld om een speciaal lettertype te kunnen gebruiken. In de alt-tekst moet in dit geval de tekst staan die in het plaatje te zien is. Probeer afbeeldingen van tekst enkel te gebruiken als het echt niet anders kan.

<img src=”feest.jpg” alt=”Het is feest!” />

Geval 5: Afbeelding gebruikt als een ondersteunend icoon

Wanneer een afbeelding wordt gebruikt als een icoon naast tekst (bijvoorbeeld een gloeilamp om de aandacht van de lezer te trekken), moet dit icoon niet vergezeld gaan van een verklarende tekst. De alt-tekst van het pictogram moet leeg worden gelaten om onnodige beschrijvingen te vermijden, die kunnen leiden tot vervelende herhalingen bij het lezen door een spraakbrowser.

<a href=”home.html”><img src=”home.jpg” alt=”” />Home</a>

Voor redacteurs

De redacteur is verantwoordelijk voor het schrijven en plaatsen van de alternatieve teksten voor afbeeldingen die hij via het CMS plaatst.

Voor ontwikkelaars

De bouwer moet ervoor zorgen dat afbeeldingen in het CMS een alternatieve tekst kunnen krijgen. Voor afbeeldingen die niet via het CMS te beheren zijn, moet de bouwer zelf zorgen dat er – als dat nodig is – een alternatieve tekst is geplaatst.