WCAG-Erfolgskriterien · Level AA

WCAG 1.2.4: Untertitel (Live)

WCAG 1.2.4 verlangt, dass alle Live-Audioinhalte in synchronisierten Medien – wie Webinare, Livestreams und Übertragungen – von Echtzeit-Untertiteln begleitet werden. Dies stellt sicher, dass gehörlose und schwerhörige Nutzerinnen und Nutzer auf gesprochene Inhalte zugreifen können, während sie stattfinden, in Echtzeit.

  • Level AA

Was diese Regel bedeutet

\n

WCAG 1.2.4 (Untertitel – Live) verlangt, dass für alle Live-Audioinhalte in synchronisierten Medien Untertitel bereitgestellt werden. Synchronisierte Medien sind definiert als Audio- oder Videoinhalte, die mit einem anderen Format zur Informationsvermittlung oder mit zeitbasierten interaktiven Komponenten synchronisiert sind, wie etwa ein Webcast, ein Livestream oder eine Echtzeitübertragung im Web.

\n

Praktisch bedeutet das: Jedes Live-Ereignis, das auf einer Website oder in einer Webanwendung veröffentlicht wird und Audio enthält – eine auf einer Nachrichtenseite gestreamte Pressekonferenz, eine unternehmensweite Live-Übertragung, eine Regierungsanhörung, ein Live-Onlinekurs oder ein Sportkommentar-Stream – muss Echtzeituntertitel anzeigen, die das Gesprochene während des Sprechens korrekt wiedergeben.

\n

Was als bestanden gilt: Ein Livestream erfüllt dieses Kriterium, wenn synchronisierte, genaue Echtzeituntertitel während der Wiedergabe für die Nutzer sichtbar sind. Die Untertitel müssen den gesamten Dialog und relevante nichtsprachliche Audioinformationen wiedergeben (wie „[Applaus]“ oder „[Alarm ertönt]“). Übliche Ansätze sind CART (Communication Access Realtime Translation), bereitgestellt von einer professionellen Untertitlerin oder einem professionellen Untertitler, automatische Spracherkennung (ASR) von einem qualifizierten Live-Untertitelungsdienst oder Drittanbieter-Integrationen, wie sie von Streaming-Plattformen angeboten werden.

\n

Was als nicht bestanden gilt: Ein Livestream erfüllt dieses Kriterium nicht, wenn keine Untertitel verfügbar sind, wenn Untertitel nicht mit dem gesprochenen Audio synchronisiert sind, wenn Untertitel wesentliche Teile des Dialogs auslassen oder wenn die Untertitelqualität so schlecht ist, dass das Verständnis stark beeinträchtigt ist. Die Bereitstellung eines Transkripts im Nachhinein erfüllt diese Anforderung nicht – Untertitel müssen live, in Echtzeit verfügbar sein.

\n

Offizielle Ausnahmen: WCAG definiert eine Ausnahme von dieser Regel: Medien, die selbst eine Medienalternative zu Text sind und eindeutig als solche gekennzeichnet sind, sind ausgenommen. Wenn Sie beispielsweise ein detailliertes Texttranskript eines Interviews veröffentlichen und zusätzlich eine Live-Audioversion desselben Inhalts bereitstellen, die ausdrücklich als Audioalternative zum Text gekennzeichnet ist, sind Untertitel möglicherweise nicht zwingend erforderlich. Diese Ausnahme ist jedoch eng gefasst und in der Praxis selten anwendbar.

\n

Das Kriterium gilt für alle synchronisierten Medien, die im Web veröffentlicht werden – unabhängig davon, ob das Video vorproduziert ist oder wirklich live. Eine vorab aufgezeichnete Webinar-Wiederholung, die so gestreamt wird, als wäre sie live, fällt weiterhin unter 1.2.3 oder 1.2.5, aber eine echte Echtzeitübertragung fällt eindeutig unter 1.2.4.

\n\n

Warum es wichtig ist

\n

Weltweit haben laut der Weltgesundheitsorganisation etwa 430 Millionen Menschen eine beeinträchtigende Hörminderung, und diese Zahl wird voraussichtlich bis 2050 auf über 700 Millionen steigen. Für gehörlose und schwerhörige Nutzerinnen und Nutzer sind Echtzeituntertitel kein Komfort – sie sind das primäre oder einzige Mittel, um in einem Live-Kontext auf Audioinhalte zuzugreifen. Ohne Untertitel sind diese Personen vollständig davon ausgeschlossen, an Live-Medienereignissen teilzunehmen oder sie zu verstehen.

\n

Über Gehörlosigkeit und Hörverlust hinaus kommen Live-Untertitel einem deutlich breiteren Publikum zugute. Nutzer in lauten Umgebungen – Flughäfen, Großraumbüros, öffentlicher Nahverkehr – können Audio möglicherweise nicht verwenden. Nutzer, die sich in ruhigen Umgebungen ohne Kopfhörer befinden oder ihre Geräte stummgeschaltet haben, sind auf Untertitel angewiesen, um folgen zu können. Nichtmuttersprachlerinnen und Nichtmuttersprachler empfinden Untertitel oft als unverzichtbar für das Verständnis, insbesondere wenn Sprecher komplexe Vokabeln, Akzente oder Fachjargon verwenden. Kognitive und sprachverarbeitende Unterschiede können Untertitel ebenfalls zu einem wesentlichen Faktor für ein korrektes Verständnis machen.

\n

Betrachten wir ein konkretes Szenario: Eine Gemeinde in der Türkei überträgt eine Live-Stadtratssitzung auf ihrer offiziellen Website. Eine Bewohnerin oder ein Bewohner, die oder der gehörlos ist, möchte die Debatte über Änderungen der Bebauungspläne in ihrer oder seiner Nachbarschaft verfolgen. Ohne Echtzeituntertitel ist diese Person vollständig von der bürgerschaftlichen Teilhabe ausgeschlossen. Dasselbe gilt für eine gehörlose Schülerin oder einen gehörlosen Schüler, die oder der an einem Live-Onlinekurs im Lernmanagementsystem einer Privatschule teilnimmt, oder für eine Kundin oder einen Kunden, die oder der versucht, der Live-Produktankündigungspräsentation einer Bank zu folgen.

\n

Aus praktischer Sicht erzeugt die Infrastruktur für Live-Untertitelung außerdem ein Transkript, das von Suchmaschinen indexiert werden kann und so die Auffindbarkeit von Videoinhalten verbessert. Organisationen, die in Live-Untertitelung investieren, stellen häufig fest, dass das Transkript-Artefakt zu einer wertvollen Ressource für die Dokumentation nach der Veranstaltung, Zusammenfassungen und die Archivsuche wird.

\n\n

Verwandte Axe-core-Regeln

\n

WCAG 1.2.4 erfordert manuelle Tests. Keine automatisierte axe-core-Regel kann das Vorhandensein oder die Qualität von Live-Untertiteln zuverlässig erkennen, und dies ist ein wichtiger Unterschied, den Sie bei der Planung Ihrer Strategie für Barrierefreiheitsprüfungen verstehen sollten.

\n
    \n
  • Manuelle Tests erforderlich – Vorhandensein von Live-Untertiteln: Automatisierte Tools wie axe-core können den DOM nach dem Vorhandensein eines <track>-Elements mit kind='captions' auf einem <video>-Element durchsuchen, aber Livestreams werden fast nie über ein einfaches HTML-<video>-Element mit einem <track> ausgeliefert. Sie verwenden typischerweise adaptive Bitratenformate (HLS, DASH), die über JavaScript-basierte Player wie Video.js, JW Player oder native Plattform-Player bereitgestellt werden. Diese Player rendern Untertitel dynamisch auf eine Weise, die axe-core nicht einsehen kann. Ein Tool kann keinen Livestream in Echtzeit ansehen, die Untertitelgenauigkeit bewerten, die Synchronisationsverzögerung messen oder feststellen, ob eine Untertitel-Einblendung tatsächlich den gesprochenen Inhalt widerspiegelt oder nur ein statischer Platzhalter ist.
  • \n
  • Manuelle Tests erforderlich – Qualität und Genauigkeit der Untertitel: Selbst wenn ein automatisiertes Tool erkennen könnte, dass ein Untertitel-Feed existiert, hat es keine Möglichkeit zu beurteilen, ob die Untertitel genau, vollständig oder in akzeptablem Maß synchronisiert sind. CART-erstellte Untertitel und qualitativ schlechte automatisch generierte Untertitel können für ein Tool gleichermaßen als „Untertitel vorhanden“ erscheinen, aber nur eine dieser Varianten erfüllt WCAG 1.2.4. Eine menschliche Überprüfung während eines Live-Ereignisses ist die einzige zuverlässige Methode zur Überprüfung der Konformität.
  • \n
  • Manuelle Tests erforderlich – Zugänglichkeit der Untertitel im Player: Automatisierte Tools können in der Regel nicht feststellen, ob Untertitel-Steuerelemente in einem benutzerdefinierten Mediaplayer per Tastatur zugänglich sind, ob die Untertitelanzeige von den Nutzern in der Größe verändert oder angepasst werden kann oder ob die Untertitelgestaltung den Bedürfnissen der Nutzer entspricht. Diese Aspekte erfordern praktische Tests mit tatsächlicher Tastaturnavigation und Screenreader-Nutzung.
  • \n
\n\n

Wie man testet

\n
    \n
  1. Alle Live-Medien auf der Seite identifizieren: Untersuchen Sie die Seite auf Live-Video- oder Audiostreams. Prüfen Sie eingebettete Player, iframes oder dynamisch geladene Medienkomponenten. Notieren Sie, ob der Inhalt wirklich live (Echtzeitübertragung) oder vorab aufgezeichnet ist. Nur wirklich live gesendete Audioinhalte in synchronisierten Medien fallen unter 1.2.4.
  2. \n
  3. Einen automatisierten Scan mit axe DevTools oder Lighthouse ausführen: Öffnen Sie axe DevTools in den Chrome DevTools und führen Sie einen Scan der gesamten Seite aus. Zwar kann axe Live-Untertitel nicht validieren, aber es kann verwandte Probleme kennzeichnen, wie fehlende aria-label-Attribute an Mediaplayer-Steuerelementen, nicht zugängliche Play/Pause-Schaltflächen oder fehlendes Fokusmanagement. Notieren Sie alle markierten Probleme als unterstützende Hinweise, aber bedenken Sie, dass ein sauberer axe-Bericht keine Konformität mit 1.2.4 bestätigt.
  4. \n
  5. Untertitelverfügbarkeit während eines Live-Ereignisses manuell überprüfen: Greifen Sie während einer aktiven Übertragung auf den Livestream zu. Prüfen Sie, ob Untertitel angezeigt werden. Wenn der Player eine Untertitel-Umschaltfunktion (CC-Schaltfläche) hat, aktivieren Sie sie und bestätigen Sie, dass Untertitel erscheinen und sich nahezu in Echtzeit aktualisieren, während die Sprecherin oder der Sprecher spricht. Bestätigen Sie, dass die Untertitelverzögerung akzeptabel ist – typischerweise nicht mehr als ein paar Sekunden bei CART oder etwas mehr bei ASR.
  6. \n
  7. Untertitelgenauigkeit beurteilen: Hören Sie das Audio, während Sie die Untertitel lesen. Achten Sie auf fehlende Wörter, systematische Fehler oder wesentliche Auslassungen. Untertitel müssen nicht wortwörtlich sein, aber sie müssen die vollständige Bedeutung des gesprochenen Inhalts vermitteln. Notieren Sie die Sprecherkennzeichnung, wenn mehrere Personen sprechen – Untertitel sollten angeben, wer spricht, wenn dies nicht offensichtlich ist.
  8. \n
  9. Test mit NVDA + Firefox: Navigieren Sie mit der Tabulatortaste zum Mediaplayer. Überprüfen Sie, ob alle Player-Steuerelemente einschließlich der Untertitel-Umschaltfunktion per Tastatur erreichbar und bedienbar sind. Bestätigen Sie, dass NVDA den Status der Untertitel-Schaltfläche (ein/aus) ansagt. Aktivieren Sie Untertitel und überprüfen Sie, dass der Untertiteltext in einem DOM-Element erscheint, das NVDA lesen kann, wenn die Nutzerin oder der Nutzer zum Player hin oder um ihn herum tabbt.
  10. \n
  11. Test mit VoiceOver + Safari (macOS oder iOS): Verwenden Sie VoiceOver-Gesten oder Tastaturbefehle, um im Player zu navigieren. Überprüfen Sie, dass die Untertitel-Umschaltfunktion angesagt und bedienbar ist. Bestätigen Sie, dass Änderungen des Untertiteltexts innerhalb des zugänglichen Bereichs des Players angemessen wiedergegeben werden.
  12. \n
  13. Test mit JAWS + Chrome: Navigieren Sie mit der Tabulatortaste zu den Player-Steuerelementen. Überprüfen Sie, dass JAWS alle Steuerelementbeschriftungen vorliest. Bestätigen Sie, dass die Untertitel-Umschaltfunktion als Schaltfläche mit einer geeigneten Beschriftung und einem geeigneten Status identifiziert wird. Aktivieren Sie Untertitel und überprüfen Sie, dass die Untertitelanzeige wie erwartet aktualisiert wird.
  14. \n
  15. Anpassung der Untertitelanzeige prüfen: Überprüfen Sie, ob der Player es den Nutzern ermöglicht, die Untertitelgröße zu ändern, Farben anzupassen oder den Kontrast zu verändern. Auch wenn dies nicht ausdrücklich von 1.2.4 verlangt wird, ist es ein Best-Practice-Bewertungspunkt und relevant für WCAG-1.4-Kriterien.
  16. \n
\n\n

Wie man es behebt

\n

Livestream ohne Untertitelspur – Falsch

\n
<!-- A live HLS stream embedded with no caption configuration -->\n<video id='live-player' controls autoplay>\n  <source src='https://stream.example.com/live/event.m3u8' type='application/x-mpegURL'>\n  <!-- No <track> element and no caption configuration in the player -->\n</video>
\n

Livestream mit integrierter CART-Untertitelspur – Richtig

\n
<!-- Live stream using Video.js with a live WebVTT caption track fed by a CART service.\n     The src for the track points to a live caption endpoint that updates in real time. -->\n<video\n  id='live-player'\n  class='video-js vjs-default-skin'\n  controls\n  autoplay\n  aria-label='Live conference stream with real-time captions'>\n  <source src='https://stream.example.com/live/event.m3u8' type='application/x-mpegURL'>\n  <track\n    kind='captions'\n    src='https://captions.example.com/live/event.vtt'\n    srclang='tr'\n    label='Turkish captions'\n    default>\n</video>\n<script>\n  var player = videojs('live-player');\n  // Enable captions by default for accessibility\n  player.ready(function() {\n    player.textTracks()[0].mode = 'showing';\n  });\n</script>
\n

Eingebetteter Livestream von einer Plattform mit in der Einbettung deaktivierten Untertiteln – Falsch

\n
<!-- YouTube live embed with closed captions explicitly disabled via cc_load_policy=0.\n     This removes the user's ability to enable captions, causing a 1.2.4 failure. -->\n<iframe\n  src='https://www.youtube.com/embed/live_stream?channel=CHANNEL_ID&cc_load_policy=0'\n  title='Company all-hands live stream'\n  allowfullscreen>\n</iframe>
\n

Eingebetteter Livestream von einer Plattform mit aktivierten Untertiteln – Richtig

\n
<!-- YouTube live embed with closed captions enabled by default (cc_load_policy=1).\n     The platform's native caption infrastructure is used, which supports live auto-captions\n     and human-reviewed CART when configured in the YouTube Studio settings.\n     The host page also provides a direct link to the captioned stream for users\n     who cannot interact with the iframe. -->\n<iframe\n  src='https://www.youtube.com/embed/live_stream?channel=CHANNEL_ID&cc_load_policy=1'\n  title='Company all-hands live stream with captions enabled'\n  allowfullscreen>\n</iframe>\n<p>\n  <a href='https://www.youtube.com/watch?v=LIVE_VIDEO_ID'>\n    Watch with captions directly on YouTube\n  </a>\n</p>
\n

Benutzerdefinierter Player mit einer Untertitel-Umschaltfunktion, die nicht per Tastatur zugänglich ist – Falsch

\n
<!-- Caption toggle implemented as a non-interactive <div>.\n     Keyboard users and screen reader users cannot activate this control. -->\n<div class='player-controls'>\n  <div class='cc-button' onclick='toggleCaptions()'>CC</div>\n</div>
\n

Benutzerdefinierter Player mit einer zugänglichen Untertitel-Umschaltfunktion – Richtig

\n
<!-- Caption toggle implemented as a <button> with an explicit label and\n     ARIA pressed state so keyboard and screen reader users can discover\n     and operate it. The state updates dynamically when captions are toggled. -->\n<div class='player-controls'>\n  <button\n    class='cc-button'\n    id='captions-toggle'\n    aria-pressed='false'\n    aria-label='Toggle captions'\n    onclick='toggleCaptions(this)'>\n    CC\n  </button>\n</div>\n<script>\n  function toggleCaptions(btn) {\n    var isActive = btn.getAttribute('aria-pressed') === 'true';\n    btn.setAttribute('aria-pressed', String(!isActive));\n    // logic to show/hide the caption track\n  }\n</script>
\n\n

Häufige Fehler

\n
    \n
  • Bereitstellung eines Transkripts nach der Veranstaltung statt Echtzeituntertiteln: Die Veröffentlichung eines Texttranskripts eines Live-Ereignisses, nachdem es beendet ist, erfüllt 1.2.4 nicht. Untertitel müssen gleichzeitig mit dem Live-Audio verfügbar sein, damit gehörlose Nutzerinnen und Nutzer den Inhalt in Echtzeit parallel zu sehenden hörenden Nutzerinnen und Nutzern verfolgen können.
  • \n\n

    (Content truncated due to token limit — please retry this article.)