WCAG 1.4.2: Audio-Steuerelement

Wenn Ton auf einer Seite automatisch länger als drei Sekunden spielt, muss es einen Mechanismus geben, ihn zu pausieren oder zu stoppen – oder seine Lautstärke unabhängig von der Systemlautstärke zu regeln. (Englisch: Audio Control.)

Was verlangt das Kriterium?

Der Hintergrund ist konkreter, als man denkt: Screenreader-Nutzer hören ihre Seite. Automatisch startende Musik oder Videos mit Ton übertönen die Sprachausgabe – und weil die Sprachausgabe übertönt ist, findet man auch den Stopp-Button nicht mehr. Ein akustischer Teufelskreis. Deshalb: Autoplay-Ton entweder gar nicht, oder unter drei Sekunden, oder mit sofort erreichbarer Kontrolle (idealerweise ganz am Seitenanfang).

Wen betrifft es besonders?

Screenreader-Nutzer (siehe oben), Menschen mit Hörgeräten und Cochlea-Implantaten (plötzlicher Ton ist unangenehm bis schmerzhaft), Menschen mit Konzentrations- und Reizverarbeitungs-Themen – und ehrlicherweise jeden Menschen im Büro.

Richtig & falsch im Code

<!-- Falsch: Video mit Ton startet automatisch -->
<video autoplay src="/video/imagefilm.mp4"></video>

<!-- Vertretbar: Autoplay nur stummgeschaltet, Controls vorhanden -->
<video autoplay muted playsinline controls src="/video/teaser.mp4"></video>

<!-- Am besten: Nutzer startet selbst -->
<video controls preload="metadata" src="/video/imagefilm.mp4"></video>

Stummes Autoplay erfüllt 1.4.2 – bewegtes Bild bleibt aber ein Fall für 2.2.2 „Pausieren, beenden, ausblenden“ und sollte prefers-reduced-motion respektieren. Moderne Browser blockieren tönendes Autoplay ohnehin oft – verlassen sollte man sich darauf nicht.

So testest du es

1. Seite laden (auch Unterseiten mit eingebetteten Playern, Video-Headern, Sound-Effekten): Startet irgendwo Ton von selbst?
2. Wenn ja: Gibt es in unmittelbarer Nähe des Seitenanfangs einen Pause-/Stopp- oder Lautstärke-Mechanismus, der per Tastatur erreichbar ist?
3. Screenreader-Probe: Mit NVDA laden – bleibt die Sprachausgabe verständlich?

Verwandte Themen

• 2.2.2 Pausieren, beenden, ausblenden – das Pendant für Bewegung
• Barrierefreier Media-Player – Player-Muster ohne Autoplay-Fallen
• Semantische Medien