YouTube-filmpjes toegankelijk insluiten

Eerder schreef ik een artikel over toegankelijke filmpjes en geluidsfragmenten. In dit artikel leg ik uit hoe je de YouTube-mediaspeler toegankelijker kunt instellen.

Insluitcode

Met een insluitcode (ook wel embed-code) kun je filmpjes van YouTube op een webpagina plaatsen. Deze code ziet er ongeveer zo uit:

<iframe width="560" height="315" src="https://www.youtube.com/embed/[VIDEO_ID]" title="YouTube video player" ... ></iframe>

In het src-attribuut van het <iframe>-element staat de URL van het filmpje. Je kunt parameters toevoegen aan deze URL om de toegankelijkheid van de mediaspeler te verbeteren. Deze parameters kun je in- of uitschakelen met de waarde 1 of 0.

  • autoplay: Hiermee bepaal je of een filmpje automatisch start. Standaard staat dit uit (autoplay=0). Het advies is om deze instelling uit te laten staan.
  • controls: Hiermee kun je de bedieningselementen van de mediaspeler tonen of verbergen. Standaard zijn deze zichtbaar (controls=1). Verberg de bedieningselementen nooit.
  • disablekb: Hiermee bepaal je of sneltoetsen kunnen worden gebruikt. Standaard staan sneltoetsen aan (disablekb=0). Het advies is om sneltoetsen uit te schakelen. Voeg disablekb=1 toe aan de URL.
  • fs: Hiermee bepaal je of een filmpje in volledig scherm kan worden afgespeeld. Standaard staat dit aan (fs=1). Het advies is om deze instelling aan te laten staan.

Lees meer over YouTube parameters

Na het aanpassen van de insluitcode ziet deze er zo uit:

<iframe width="560" height="315" src="https://www.youtube.com/embed/[VIDEO_ID]?disablekb=1" title="YouTube video player" ... ></iframe>

Toegankelijke naam

Geef het <iframe>-element een duidelijke toegankelijke naam. Schermlezers kunnen (onder andere) <iframe>-elementen presenteren in een handig overzicht. Hierdoor kunnen mensen die een schermlezer gebruiken sneller door de content navigeren.

Gebruik hiervoor het title-attribuut van het <iframe>-element. Standaard staat hier “YouTube video player”. Vervang dit door een beschrijving van wat er in het filmpje te zien is.

Na het aanpassen van de insluitcode ziet deze er (bijvoorbeeld) zo uit:

<iframe width="560" height="315" src="https://www.youtube.com/embed/[VIDEO_ID]?disablekb=1" title="Teckel en Border Collie spelend in een open weide" ... ></iframe>

Ondertitels

YouTube kan automatisch ondertitels genereren bij je filmpje. Deze ondertitels zijn vaak niet volledig correct. Ze kunnen wel veel werk besparen. Controleer daarom de gegenereerde ondertitels en verbeter ze waar nodig. Beschrijf in de ondertitels ook belangrijke geluiden die te horen zijn, zoals een deurbel, een explosie of belangrijke muziek.

YouTube gebruikt deze ondertitels ook om een transcript van het filmpje te maken.

Tips voor een toegankelijke mediaspeler

Tot slot nog een paar tips voor een toegankelijke mediaspeler:

  • Vermijd geluid dat automatisch speelt. Als je dit toch gebruikt, zorg dan dat gebruikers het eenvoudig kunnen pauzeren, stoppen of zachter kunnen zetten.
  • Gebruik geen sneltoetsen. Als je ze toch wil gebruiken, zorg dan dat gebruikers ze kunnen uitschakelen of aanpassen.
  • Vermijd automatisch bewegende content. Als je dit toch gebruikt, zorg dan dat gebruikers het eenvoudig kunnen pauzeren, stoppen of uitzetten.
  • Gebruik geen content dat meer dan 3 keer per seconde flitst.