WCAG 1.2.1

Samenvatting

WCAG 1.2.1 vereist dat vooraf opgenomen media die alleen audio of alleen video bevatten een gelijkwaardig tekstueel alternatief hebben. Dit maakt de inhoud toegankelijk voor gebruikers die audio- of videomateriaal niet kunnen waarnemen.

Niveau: A
Categorie: Perceivable (Waarneembaar)

Wat is WCAG 1.2.1 – Audio-only en Video-only?

Audio-only media bevat alleen geluid (zoals een podcast of audioboek), terwijl video-only media alleen beeld bevat zonder geluid (zoals een stille instructievideo of animatie zonder audio). Voor beide typen media geldt dat er een alternatief in tekst moet zijn om te zorgen dat alle gebruikers volledige toegang hebben tot dezelfde informatie.

Wie heeft hier baat bij?

Mensen die doof of slechthorend zijn (voor audio-only media).
Mensen die blind of slechtziend zijn (voor video-only media).
Gebruikers die moeite hebben met het verwerken van auditieve of visuele informatie.

Hoe voldoe je aan WCAG 1.2.1?

Zorg altijd voor een tekstueel alternatief bij vooraf opgenomen audio-only of video-only media.

Teksttranscript bij audio-only content:

<audio controls src="interview.mp3"></audio>
<a href="transcript-interview.html">Bekijk hier het volledige transcript van het interview.</a>

Het transcript biedt een tekstueel alternatief voor gebruikers die geen audio kunnen horen.

Tekstuele beschrijving bij video-only content:

<video src="handleiding.mp4"></video>
<p><a href="beschrijving-handleiding.html">Lees hier de tekstuele beschrijving van deze instructievideo.</a></p>

De tekstuele beschrijving biedt slechtziende of blinde gebruikers toegang tot de inhoud van de video.

Goede en slechte voorbeelden

✅ Goed voorbeeld (audio-only):

<audio controls src="podcast.mp3"></audio>
<a href="podcast-transcript.html">Lees het transcript van deze podcast.</a>

Duidelijk tekstalternatief beschikbaar, waardoor dove en slechthorende gebruikers niets missen.

❌ Slecht voorbeeld (audio-only):

<audio controls src="podcast.mp3"></audio>

Geen transcript aangeboden; ontoegankelijk voor dove of slechthorende gebruikers.

✅ Goed voorbeeld (video-only):

<video src="montage-instructie.mp4"></video>
<a href="tekstuele-instructie.html">Lees de instructies uit deze video.</a>

Tekstuele beschrijving aanwezig; toegankelijk voor blinde of slechtziende gebruikers.

❌ Slecht voorbeeld (video-only):

<video src="montage-instructie.mp4"></video>

Geen tekstalternatief aangeboden; ontoegankelijk voor slechtziende of blinde gebruikers.

Hoe test je WCAG 1.2.1?

Handmatige controle:

Controleer of audio-only media voorzien is van een volledig transcript.
Controleer of video-only media voorzien is van een tekstuele beschrijving die alle relevante visuele details bevat.

Automatische hulpmiddelen:

Hoewel dit criterium vooral handmatig gecontroleerd moet worden, kun je met onderstaande tools controleren of er alternatieven aanwezig zijn:

Axe DevTools
Lighthouse (Chrome DevTools)

Gebruik een screenreader:

NVDA (Windows)
VoiceOver (Mac)