Perceivable · 1.2 Time-based Media
Live video with sound, such as webcasts and streamed events, must show synchronized captions for all speech and meaningful sounds. It is aimed at broadcast content, not at two-way video calls between individuals.
Live demo
The same task, done two ways: switch between the version that passes and the one that fails, or put them side by side. Everything in the box is live, so try it with a keyboard, a pointer or a screen reader.
Press play; the broadcast runs as if live. In Passes captions follow each speaker a moment later; in Fails there are none.
Our team answers customers' questions on air.
Our team answers customers' questions on air.
The tools follow the version you last used.
What happened
Why it passes
Captions appear a moment after each line is spoken, with the speaker's name, so a deaf viewer follows the questions and answers live.
Why it fails
The stream has no captions. A deaf viewer sees two people talking and has to wait for a recording to learn what was said.
Examples
Four examples, each one running: the usual ways this criterion fails, and code that passes. Listen to them, measure them, or copy the code.
Fails
Live preview
<h3>Live now: question time on the new app</h3><video id="live-qa" controls></video><p>A captioned recording will be available next week.</p>Deaf viewers cannot follow the event while it happens. A captioned recording later does not meet this criterion.
Passes
Live preview
const video = document.querySelector("#live-qa");const feed = new WebSocket("wss://captions.example.com/live-qa");const track = video.addTextTrack("captions", "English (live)", "en");track.mode = "showing";feed.addEventListener("message", (event) => { const { speaker, text } = JSON.parse(event.data); const start = video.currentTime; track.addCue(new VTTCue(start, start + 4, `${speaker}: ${text}`));});Each line typed by a live captioner arrives over the socket and is shown on the stream within seconds, with the speaker's name.
Fails
Live preview
<div class="live-captions"> <p>JOE: open the ap go to cars and shoes we set pin</p> <p>JOE: we send a text with a code that last tin minutes</p></div>"Cards", "Reset PIN" and "ten" come out wrong, so viewers who rely on the captions get the steps wrong.
Passes
Live preview
<div class="live-captions"> <p>JOE: Open the app, go to Cards, and choose Reset PIN.</p> <p>JOE: We send a text with a code that lasts ten minutes.</p></div>A trained live captioner, or checked speech recognition, keeps names and key terms right and shows who is speaking.
Why it matters
People who are deaf or hard of hearing can follow a live event as it happens instead of waiting for a captioned recording.
W3C: Understanding 1.2.4Level AA
Level AA is the level most laws and policies require.
Where it is required
Required where the law names WCAG 2.0 or later at this level: the United States, Canada, the European Union, the United Kingdom, France, Germany, Italy, Spain, the Netherlands, Ireland, Switzerland, India, Japan, Australia, New Zealand and Israel.
How to test
A few concrete steps. Automated tools find some failures; most need a person.
Common failures