Terug naar Artikelen

Tutorial online video

Online video toegankelijk maken

Introductie

Video op het web is steeds populairder. Informatie die wordt aangeboden in deze vorm is echter vaak enkel toegankelijk voor mensen die goed kunnen zien en horen. Een oplossing voor dit probleem wordt door zowel de Webrichtlijnen, WCAG als drempelvrij.nl op dezelfde manier voorgeschreven:

  • lever captions mee die het relevante geluid en dialoog van de video in tekst beschrijft;
  • lever audiodescriptie mee die het relevante beeld van de video door middel van spraak beschrijft zonder het originele geluid van de video te hinderen.

Het lijkt misschien moeilijk, duur, tijdrovend of zelfs onmogelijk om hieraan te voldoen, maar met een paar slimme tips en gratis softwareprogramma's is toegankelijke video op het web eenvoudig, goedkoop en snel te realiseren. Deze tutorial toont in 4 eenvoudige stappen hoe een video toegankelijk online geplaatst kan worden.

Stap 1 - Flashvideo

Het liefste zouden we natuurlijk een open formaat player ondersteunen die op iedere computer staat maar helaas is die er nog niet. Op dit moment wordt de beste ondersteuning aangeboden door de Flash player. Die wordt ondersteund door een grote verscheidenheid aan webbrowsers en besturingssystemen. De JW FLV Player van Jeroen Wijering is een bekende speler voor Flashvideo op het web, onder meer de speler van YouTube is op deze speler gebaseeerd. Deze speciale player is gratis beschikbaar op de website van Jeroen Wijering en ondersteunt voor toegankelijkheid zowel captions als audiodescriptie. Er wordt door diverse partijen gewerkt aan een versie die ook een overlay met gebarentaal ondersteunt.

Het installeren van de Flash speler op uw webpagina is eenvoudig met de bijgeleverde HTML-code en instructies. Om uw eigen video af te spelen in deze speler, moet deze worden omgezet naar Flash Er bestaat hiervoor diverse (gratis) software, zoals Riva FLV Encoder (voor Windows) of ffmpegX (voor Macintosh). Let wel op dat u straks ook de aparte bestanden ter download aanbiedt voor mensen die geen Flash ondersteunen. Zij kunnen de bestanden dan in een eigen speler afspelen.
De Rijksoverheid heeft als extra alternatief ook nog een embedded Quicktime playerversie opgenomen. Die wordt in deze tutorial niet besproken.

Stap 2 - Captions maken en invoegen

Captions zijn gesynchroniseerde tekst equivalenten van audio informatie. Ze zijn meestal in dezelfde taal als de audio en brengen niet alleen spraak over maar ook niet spraak informatie zoals geluidseffecten, muziek, lachen, en identificatie van de spreker en de locatie. Captions moeten niet verwarrend of belemmerend zijn voor de visuele informatie. Captions worden op dvd's ook weleens ondertitels voor doven en slechthorenden genoemd. Echter voor veel doven zijn ze niet een goede oplossing. Tekst is voor hen als het ware een tweede taal zoals voor andere mensen Duits of Frans.

Captions zijn ondertitels die alle relevante geluiden en dialogen omschrijven in tekst. In de JW FLV player dienen deze te worden aangeboden als SRT (platte tekst) of W3C TimedText (is nog wat buggy in de player). Captions kunnen met een enkele regel in de code worden toegevoegd aan het videospoor.

Er bestaan talloze programma's waarmee captions in de goede formaten gemaakt of omgezet kunnen worden. Een gratis voorbeeld hiervan is MagPie (zie de MagPie tutorial op deze website). Een ander programma is Subtitle Workshop (lees de Subtitle Workshop tutorial). Er zijn ook online programma's. Voorbeeld is Subtitle Creator waarmee eenvoudig captions aan flv video bestanden kunnen worden toegevoegd. Met het online Subtitle Format Translator kunnen caption bestanden in verschillende formaten worden omgezet. Onze persoonlijke voorkeur gaat uit naar versie 1 van Magpie (Versie 2 krijgt vrijwel niemand aan de praat).

Stap 3 - Audiodescriptie maken en invoegen

Audiodescriptie is een omschrijving van al het relevante beeld van een video in spraak. Audiodescriptie geeft onder meer informatie over acties, karakters, lichaamstaal, achtergronden, decors en on-screen tekst en grafische informatie, op plaatsen waar het originele geluid van de video niet omschrijvend genoeg is om de inhoud van de video te kunnen volgen. Auiodescriptie mag het originele geluid van de video niet storen.

Audiodescriptie bestaat in de JW FLV Player simpelweg uit een MP3-bestand. Dit kan gemaakt worden met elk programma dat audio kan opnemen en opslaan als MP3, bijvoorbeeld Audacity (voor Windows, Macintosh en Linux). Zeker voor langere video's is het echter prettig als het geluid direct synchroon met het beeld en geluid van de video opgenomen kan worden. Hiervoor voldoet een eenvoudig programma als Windows Movie Maker (gebundeld met Windows XP of nieuwer) of iMovie (gebundeld met Mac OS X).

Nadat de audiodescriptie is opgenomen als MP3-bestand, kan het met een enkele regel worden toegevoegd aan de JW FLV Player. Hiermee is de video toegankelijk gemaakt voor blinden en slechtzienden.

Stap 4 - Online plaatsen

Wanneer de JW FLV Player is geinstalleerd, er een captionsbestand is geschreven een audiodescriptiebestand is opgenomen, kan het geheel op het web gepubliceerd worden. Dit gebeurt eenvoudig door alle bestanden op de webserver te zetten. Vervolgens worden in het (x)html-bestand waarin de video moet worden weergegeven de benodigde regels toegevoegd waarin wordt gerefeerd naar de video, de captions en de audiodescriptie.

  1. <p id="player1">
  2. <img src="/video/accessibility.jpg" alt="screenshot: man kijkt naar uitgesmeerde brandvlek op de muur" class="imgcenter" />
  3. </p>
  4. <script type="text/javascript">
  5. var s1 = new SWFObject("/video/flvplayer.swf","single","320","260","7");
  6. s1.addParam("allowfullscreen","true");
  7. s1.addVariable("file","/video/accessibility.flv");
  8. s1.addVariable("image","/video/accessibility.jpg");
  9. s1.addVariable("width","320");
  10. s1.addVariable("height","260");
  11. s1.addVariable("audio","/video/accessibility.mp3");
  12. s1.addVariable("captions","/video/accessibility.srt");
  13. s1.write("player1");
  14. </script>

Let wel op dat naast de Flashvideo er ook een alternatief voor Flash wordt geboden, bijvoorbeeld door de bestanden los ter download aan te bieden.

  1. <p>U kunt ook gebruik maken van onderstaande alternatieven: <br />
  2. <a href="/video/accessibility.mpg">Download hier het videobestand in MPEG-formaat</a><br />
  3. <a href="/video/accessibility.mp3">Download hier de audiobeschrijving in MP3-formaat</a>
  4. <a href="/video/accessibility.srt">Download hier de captions als srt bestand</a>
  5. </p>

Zie hoe het echt werkt op deze pagina.

Het resultaat is een webpagina met daarop video met optionele ondertitels en audiodescriptie, die onafhankelijk van elkaar kunnen worden aan- en uitgeschakeld. Op dezelfde pagina of een duidelijk gelinkte pagina staan tevens de bestanden los ter download beschikbaar. Een website die op deze manier video aanbiedt, wordt goedgekeurd volgens de normen van de Webrichtlijnen, WCAG en drempelvrij.nl en is toegankelijker voor iedereen.

Reacties op onze presentatie tijdens Edu Exchange:

Op een weblog staat over onze presentatie en tutorial: "Door een vraag van één van de deelnemers aan de Edu Exchange werd (verrassend!) duidelijk dat het toevoegen van audiodescription en captions niet alleen een effect heeft op mensen met een beperking, maar dat de kwaliteit van het (video)-product voor iedereen beter wordt. Mijn ervaring was dat de getoonde beelden van de film Zwartboek dieper doordringen, waardoor er in een onderwijskundige setting verplaatst, meer leer-rendement, bij leerlingen kan optreden. Het zou zinvol zijn dit in de praktijk te testen".
Dank voor de lovende woorden. Er lopen op dit moment diverse onderzoeken naar (educatieve) toepassing van online video en de toegankelijkheid daarvan. We zoeken nog vrijwilligers om ons te helpen bij het maken van implementatie voorbeelden en nog veel meer trouwens want er zijn nog altijd meer vragen dan antwoorden.

Deze tutorial is mede mogelijk gemaakt door Kennisnet, Revalidatiefonds, Vereniging Bartimeus, Visio, Sensis, Koninklijke Effatha Guyot Groep, Bartimeus Onderwijs.

Tags:
Categorie:
Kennisbank
  • Delen op Facebook
  • Delen op Twitter
  • Delen op LinkedIn