Für Webentwickler: Einbindung in die Internetseite

Im Internet werden Videos mithilfe eines Players, dem sogenannten Mediaelement, wiedergegeben. Mediaelemente, die möglichst viele Barrierefreiheits-Anforderungen erfüllen, setzen in der Regel auf das HTML 5 <video> Element auf. Da die Einbindung über natives HTML 5 derzeit noch nicht browserübergreifend barrierefrei umgesetzt ist, kommen zusätzliche Erweiterungen zum Einsatz.

Welche Barrierefreiheits-Anforderungen gelten für das Mediaelement?

Die Entwicklungen im Multimediabereich schreiten schnell voran, daher nennen wir keine Produkte, sondern die wichtigsten Anforderungen an Barrierefreiheit, die bei der Auswahl des Mediaelements bzw. bei Anpassungen des genutzten Mediaelements eine Rolle spielen sollten:

Anforderung gemäß WCAG

  • Tastaturbedienbarkeit: Der Player muss tastaturbedienbar sein. Das bedeutet, er ist per Tastatur erreichbar, seine Bedienelemente sind nutzbar und er kann auch über die Tastatur wieder verlassen werden (vgl. Prüfschritte 9.2.1.1 Ohne Maus nutzbar, 9.2.1.2 Keine Tastaturfalle).
  • Sichtbarer Fokus: Motorisch eingeschränkte Nutzer und sehbehinderte Nutzer, die mit der Tastatur navigieren, müssen wissen wo im Webangebot oder im Player sie sich gerade befinden. Daher soll der Tastaturfokus deutlich hervorgehoben werden (vgl. Prüfschritt 9.2.4.7 Aktuelle Position des Fokus deutlich).
  • Objekt identifizierbar und Bedienelemente beschriftet: Screenreader-Nutzer sollten das Video grundsätzlich erkennen können: Für sie sollte das eingebundene Objekt entweder über die Bezeichnung, eine vorangehende Überschrift oder eine Textalternative als Video identifizierbar sein. Beim HTML 5 <video> Element ist das gegeben. Zusätzlich muss darauf geachtet werden, dass die Bedienelemente beschriftet sind. Empfohlen wird die Bezeichnung in der Hauptsprache der Webseite, hierzulande also in Deutsch (vgl. Prüfschritte u. a. 9.1.1.1a Alternativtexte für Bedienelemente, 9.4.1.2 Name, Rolle, Wert verfügbar)
  • Kontrast: Menschen mit Sehbehinderungen brauchen, insbesondere bei Schaltflächen und Bedienelementen, gute Kontraste, um diese wahrnehmen zu können. (vgl. Prüfschritte 9.1.4.3 Kontraste von Texten ausreichend, 9.1.4.11 Kontraste von Grafiken und grafischen Bedienelementen ausreichend).
  • Untertitelung (Captions) einbindbar: Untertitel können auf unterschiedliche Arten eingebunden werden: Manche Player unterstützen nur die dauerhaft sichtbaren „open captions“, die meisten jedoch sogenannte „closed captions“, die über ein Bedienelement am Player flexibel zuschaltbar sind. Die BITV schreibt nicht vor, wie die Untertitel technisch eingebunden werden, die dynamische, einblendbare Variante hat sich jedoch weitgehend etabliert.
    Dynamische Text-Untertitelung wird über das HTML 5 <track> Element definiert. Als technischer Standard gilt WebVTT (Web Video Text Tracks) (vgl. Prüfschritt 9.1.2.2 Aufgezeichnete Videos mit Untertiteln).
  • Audiodeskription einbindbar: Videoplayer, die im Sinne des „Universal Design“ verschiedene Nutzeranforderungen berücksichtigen, bieten die Möglichkeit, die Audiodeskription über ein Bedienelement, den sogenannten Audiobutton (AD), zu aktivieren. Der Player spielt dann die Audiodeskriptions-Audiodatei parallel mit dem Video ab. Auch hier gilt: Die BITV schreibt nicht vor, wie eine Audiodeskription zur Verfügung gestellt wird. Da viele Mediaelemente die Einbindung einer Audiodeskription noch nicht bedienen, sieht man in der Praxis oft ein zweites Mediaelement mit dem Audiodeskriptions-Video (vgl. Prüfschritt 9.1.2.5 Audiodeskription für Videos).
  • Bitte beachten Sie aktuelle Standardentwicklungen (Nachtrag 03/2021): Durch die Weiterentwicklung der BITV 2.0 im Mai 2019 ist die EN 301 549 geltender Standard für Barrierefreiheit öffentlicher Stellen. EN 301 549 definiert Anforderungen an Web-Content, die über die Anforderungen der WCAG hinausgehen. Bitte informieren Sie sich auf bitvtest.de im Verzeichnis der Prüfschritte unter "Videofähigkeiten", was ein gemäß EN 301 549 barrierefreier Videoplayer erfüllen muss.

Welches Mediaelement soll ich nutzen?

Weitere Informationen