Toegankelijke video op je site

Een online video moet volgens WCAG toegankelijk zijn. Dat wil zeggen: bruikbaar voor mensen met een functionele beperking, zoals doven en blinden. Dat klinkt moeilijk, maar in dit artikel laat ik zien dat dat echt wel meevalt.

De makkelijkste manier

  • Maak 2 video's in mp4-formaat.
  • Video 1:
    • Voeg ondertiteling toe in de vorm van closed captions.
    • Bied de video en de ondertiteling aan in een toegankelijke player (bijvoorbeeld YouTube of Vimeo).
    • Plaats onder de video een volledig transcript als los tekstbestand.
  • Video 2:
    • Neem ondertiteling en eventueel de audiodescriptie op in de video ('inbakken').
    • Plaats deze als downloadbare mp4 op je site.

Als je op deze manier je video's plaatst voldoe je aan de eisen van WCAG en Webrichtlijnen (uitgezonderd de open-standaardeis).

Voorbeeld plaatsen toegankelijke video

Ondertiteling

Een video waarin wordt gesproken moet je voorzien van ondertiteling. Dit is in ieder geval nodig voor dove mensen. Dat doe je met closed captions: ondertitels die los aan de video worden toegevoegd, want die kan de gebruiker aanzetten en uitzetten. In YouTube kun je deze ondertiteling toevoegen als een los srt-bestand. Ondertiteling kun je maken met YouTube, Vimeo, dotsub of met SubRip (Windows).

Hoe je dat precies doet, leer je in onze training Online video toegankelijk maken.

De ondertiteling is gelijkwaardig aan de gesproken tekst in de video. Ze hoeft dus niet exact gelijk te zijn. Soms is het handig om de ondertiteling wat korter te maken. Is er nog andere belangrijke informatie die alleen hoorbaar is (zoals een storm, langskomende trein), dan moet je die ook aan de ondertiteling toevoegen.

Audiodescriptie

Is er informatie die alleen visueel wordt overgebracht, dan moet je voor blinde gebruikers die informatie aan de video toevoegen via een extra audiospoor. Dit heet audiodescriptie. Lukt dit niet, dan mag je deze extra audio ook vast in een (extra) video opnemen (ingebakken).

Tip: als je hier in de productie al rekening mee houdt, heb je meestal geen audiodescriptie nodig. Zie ook ons artikel Toegankelijk produceren van online video.

Volledig transcript

Niet verplicht, maar wel handig is een volledig transcript van de video. Vaak heb je dit al als je de ondertiteling hebt gemaakt. Dit transcript is de enige manier voor doof-blinden om de video te begrijpen en – niet te vergeten – het is heel belangrijk voor je indexatie door Google.

Voorbeeld volledig transcript

Downloadbare video

Bied de video ook aan als los mp4-bestand met daarin gebakken de ondertiteling en – indien nodig – de audiodescriptie. Als je dit zo aanbiedt dan hoef je de audiodescriptie niet als los spoor aan de 1e video toe te voegen. Dat maakt het plaatsen van de video makkelijker. Wij gebruiken voor de hosting de cloud van Amazon.

Voorbeeld html-code

Hieronder een codevoorbeeld. Let hierbij nog op het volgende:

  • Bij het iframe is een title-attribuut verplicht. Kies als tekst de naam van de video.
  • Standaard plaatst YouTube een frameborder-attribuut erbij. De frameborder moet je regelen in de css en kan hier weg.
  • Gebruik allowfullscreen="allowfullscreen", zodat de video ook schermvullend bekeken kan worden.
  • Gebruik een skiplink, zodat gebruikers de embedded video kunnen overslaan.
<p><a href="artikelen/toegankelijke-video-op-je-site#na-de-video" class="skip-link">Embedded video overslaan</a></p>
<div class="videoWrapper"> 
 <iframe title="Video Gareth Ford Williams on NCDT 2014" width="560" height="315" src="https://www.youtube.com/embed/o3WbWZrBN-A" allowfullscreen="allowfullscreen"></iframe> 
</div> 
<a id="na-de-video" href="https://s3.eu-central-1.amazonaws.com/video-ncdt/gareth.mp4">Downloadversie video (met ondertiteling en audiodescriptie) (256 MB, let op: groot bestand)</a>
<p><a href="https://www.ncdt.nl/uploads/ncdt-gareth-tekst.txt">Volledige tekstversie (txt-formaat)</a></p>

Dat ziet er dan zo uit als je de video vanaf YouTube embedt:

screenshot video met ondertiteling, downloadversie en transcript

Overzicht artikelen