Ga naar hoofdinhoud

WCAG-succescriterium 1.1.1 Niet-tekstuele content

Niveau A

W3C referenties

Uitleg

Alle niet-tekstuele content die aan de gebruiker wordt gepresenteerd, heeft een tekstalternatief dat een gelijkwaardig doel dient.

Uitzonderingen zijn bedieningselementen en invoer met een toegankelijke naam, op tijd gebaseerde media, een test of oefening, content bedoeld om een specifieke zintuiglijke ervaring te creëren, CAPTCHA's en niet-tekstuele content bedoeld voor decoratie.

Gerelateerde NL Design System-richtlijnen

Bronnen

  • De alt-beslisboom van 200 OK: wanneer en hoe kun je een alternatieve tekst toevoegen aan een afbeelding.

Gebruikersonderzoek

Heb je gebruikersonderzoek gedaan dat betrekking heeft op dit succescriterium en wil je dit delen? Kijk eens bij Gebruikersonderzoeken delen op gebruikersonderzoeken.nl.

Hoe te testen

Alternatieve teksten op afbeeldingen

Inspecteer in de gegenereerde HTML-code van de webpagina de <img>-elementen, bijvoorbeeld met een browser inspector.

Check voor afbeeldingen:

  • het alt-attribuut moet altijd aanwezig zijn, het kan zonder waarde (leeg) zijn:
    <img src="img-url" alt="" />
    
    of met een alt-tekst
    <img src="img-url" alt="wit konijn" />
    
  • als een afbeelding betekenisvol is, moet de alt-tekst het doel ervan beschrijven.
  • als een afbeelding decoratief is, moet het alt-attribuut leeg zijn: alt="".
  • de alt-tekst kan worden leeg gelaten als de betekenis van de afbeelding vlak bij de afbeelding staat.
  • bevat een afbeelding tekst, die informatie toevoegt aan de content, dan moet deze tekst opgenomen zijn in de alt-tekst.

Controleer voor afbeeldingen in links en buttons:

  • de alt-tekst van een afbeelding in een link moet het doel van de link beschrijven.
  • de alt-tekst van een afbeelding in een button moet de actie beschrijven.
  • als zowel de inhoud van de afbeelding als het doel of de actie even belangrijk zijn, moet de alternatieve tekst beide beschrijven.

Alternatieve teksten voor video en audio

  • Video: is er gesproken tekst dan moet deze beschikbaar zijn via ondertiteling.
  • Video: is er essentiële informatie in beeld die niet wordt uitgesproken dan moet deze via audiodescriptie beschikbaar zijn.
  • Audio: is er gesproken tekst in de audio dan moet deze beschikbaar zijn via uitgeschreven tekst (transcriptie).

Aanvullingen of opmerkingen?

Deze pagina's over WCAG worden onderhouden door het NL Design System. Heb je aanvullingen of opmerkingen? Deel je mening op GitHub.