R-pd.7.1

Het alt attribuut

Het alt (alternative) attribuut is een van de verplichte attributen op het img (image) element. Het is daarnaast ook toe te passen op het area element (voor image maps) en het input element (bij het gebruik van afbeeldingen voor formulierknoppen).

Uitleg van deze richtlijn

Wanneer een alt attribuut op een van bovengenoemde elementen is toegepast, wordt de waarde ervan (de alternatieve tekst – ook wel alt-tekst genoemd) weergegeven wanneer de afbeelding niet wordt getoond.

Het alt attribuut staat ook wel bekend als de alt tag. Technisch gezien is een attribuut uiteraard geen tag, maar de term geniet nu eenmaal wijde bekendheid.

Verplicht gebruik op afbeeldingen

Het alt attribuut dient volgens de W3C HTML4.01 specificatie verplicht te worden gebruikt op het img en area element, zelfs als er besloten wordt om een lege waarde aan het attribuut toe te kennen. Zie ook Het schrijven van effectieve alternatieve tekst.

Afbeelding met een alternatieve tekst (HTML)

Het alt attribuut en tooltips

Het alt attribuut is niet bedoeld om een zogenaamde tooltip op te roepen. Wanneer de webontwikkelaar of contentbeheerder voor de bezoeker een tooltip wil oproepen, moet hiervoor het title attribuut worden gebruikt. R-pd.7.2: Gebruik geen alt attribuut voor het oproepen van tooltips.

Voorbeelden

Een effectieve alternatieve tekst is een tekst die gelezen kan worden in plaats van de afbeelding zodat de informatie die met de afbeelding wordt overgebracht niet verloren gaat. Meer over het schrijven van een effectieve alternatieve tekst.

Links en referenties

• Aan de slag: Het schrijven van effectieve alternatieve tekst
• Aan de slag: Het longdescattribuut en d-links
• Aan de slag: Alternatieve tekst: decoratieve afbeeldingen
• Aan de slag: Alternatieve tekst: illustraties en onderschriften
• Aan de slag: Alternatieve tekst: afbeeldingen van tekst
• Aan de slag: Alternatieve tekst: logo's
• Aan de slag: Alternatieve tekst: animaties en interactieve afbeeldingen
• Aan de slag: Alternatieve tekst: miniatuurafbeeldingen
• Aan de slag: Alternatieve tekst: iconen en symbolen
• Aan de slag: Alternatieve tekst: grafieken en plattegronden
• Aan de slag: Alternatieve tekst: afbeeldingen voor formulierknoppen

Gerelateerde richtlijnen

• R-pd.1.2: Bouw websites volgens het principe van gelaagd bouwen.
• R-pd.2.9: Bouw een website volgens de Web Content Accessibility Guidelines (WCAG 1.0) van het W3C.
• R-pd.7.2: Gebruik geen alt attribuut voor het oproepen van tooltips.
• R-pd.7.3: Gebruik geen d-links op websites. Het gebruik van het longdesc (long description) attribuut verdient de voorkeur wanneer de alternatieve tekst op het alt attribuut ontoereikend is voor het begrip van de informatie in de afbeelding.
• R-pd.7.4: Afbeeldingen die staan geplaatst binnen een link dienen een niet-lege alternatieve tekst te hebben om bezoekers die de afbeelding niet zien in staat te stellen de link te volgen.
• R-pd.7.5: Geef bij het gebruik van image maps voor zowel het img element als ieder area element een effectieve alternatieve tekst aan via het alt attribuut.
• R-pd.7.6: Decoratieve afbeeldingen dienen zoveel mogelijk door CSS geplaatst te worden. Informatieve afbeeldingen dienen door HTML geplaatst te worden.
• R-pd.7.7: Het gebruik van CSS Image Replacement technieken die worden toegepast op essentiële informatie wordt afgeraden.

Bijbehorende ijkpunten normdocument

• IJkpunt 1.1: Lever een tekstequivalent voor elk niet-tekstueel element.