Videos
Reines HTML5 <video>
→ Beispiel: index.html
Source Code:
<video id='video1' width="420" height="315" poster='media/wwa.jpg' controls>
<source src='media/wwa.mp4' type="video/mp4">
<source src='media/wwa.ogv' type="video/ogg">
<source src='media/wwa.m4v' type="video/webm">
</video>
Zu beachten:
Der Videofilm muss per Tastatur bedienbar sein.
Falls es das Video-Material hergibt, müsste ein barrierefreier Player weitere Features unterstützen:
- Untertitel:
- Audiodeskription:
- Gebärdensprache:
- Transkiption:
- Kapitelauswahl:
- Gesprochener Text als Untertitel im Film, wie im Kinoein Sprecher beschreibt im normalen Tonkanal, was im Bild zu sehen istGebärdensprache-Übersetzer in separatem FensterText in sep. Fenster, der synchron das gesamte Video beschreibt, d.h. Bild und Tonfalls Video-Metadaten vorhanden
Able Player
Barrierefreier Player:
→ Demo: ableplayer.html
Source Code:
Head:
<script src="js/modernizr.custom.js" type="text/javascript"></script>
<script src="js/jquery.cookie.js" type="text/javascript"></script>
<script src="js/ableplayer/ableplayer.min.js" type="text/javascript"></script>
<link href="js/ableplayer/styles/ableplayer.min.css" type="text/css" rel="stylesheet">
Body:
<video id="video1" data-able-player data-translation-path="ableplayer/translations/ preload="auto" width="420" height="315" poster="media/wwa.jpg">
<source data-desc-src="media/wwa_described.mp4" data-sign-src="media/wwa_sign.mp4" src='media/wwa.mp4' type='video/mp4'>
<source data-desc-src="media/wwa_described.webm" data-sign-src="media/wwa_sign.webm" src='media/wwa.m4v' type='video/webm'>
<track kind='captions' src='media/wwa_captions_de.vtt' srclang='de' label='Deutsch'>
<track kind='captions' src='media/wwa_captions_en.vtt' srclang='en' label='English'>
<track kind='captions' src='media/wwa_captions_es.vtt' srclang='es' label='Espanol'>
<track kind='chapters' src='media/wwa_chapters_de.vtt' srclang='de' label='Deutsch'>
<track kind='chapters' src='media/wwa_chapters_en.vtt' srclang='en' label='English'>
<track kind='chapters' src='media/wwa_chapters_es.vtt' srclang='es' label='Espanol'>
<track kind='descriptions' src='media/wwa_description_de.vtt' srclang='de' label='Deutsch'>
<track kind='descriptions' src='media/wwa_description_en.vtt' srclang='en' label='English'>
<track kind='descriptions' src='media/wwa_description_es.vtt' srclang='es' label='Espanol'>
</video>