Provide Captions for Live Video and Live Streaming

WCAG 1.2.4
Captions (Live)

Content available in English only.

Accessibility isn’t just about avoiding violations — it’s about ensuring that everyone can use your product with confidence. This guide explains each rule’s intent, highlights common issues, and shows how to fix them according to WCAG and the European Accessibility Act (EAA).

These guidelines do not replace the official WCAG standards. They’re concise, developer-focused notes to help you identify and fix issues effectively.

All live video with speech must include real-time captions.

Why this matters and how to fix it

Why this matters

Live video events—such as webinars, announcements, interviews, and streaming sessions—often contain spoken information that deaf or hard-of-hearing users cannot access without captions. WCAG 2.2 and EN 301 549 explicitly require real-time captions for live media. Without captions, users may miss critical information, instructions, or interactions with presenters.

How to fix this issue

Use live captioning solutions such as human real-time captioners (CART), integrated platform caption features, or high-quality automatic captions that are monitored and corrected during the event. Ensure the captions include dialogue, speaker changes, and meaningful non-speech sounds (e.g., laughter, music, alerts). Captions must be visible, synchronized, and readable.

Automated detection · Manual review recommended

Developer guidance

Ensure your streaming platform supports live captions (YouTube Live, Zoom, Teams, Vimeo, Twitch, etc.). If automatic captions are used, assign a moderator to correct errors in real time. Provide clear UI controls to enable captions. Store the caption file when possible so it can be reused as the basis for prerecording captions under WCAG 1.2.2.

Code examples

Incorrect Implementation

<video src="live-event-stream.m3u8" autoplay></video>
<!-- No live captions provided -->

Correct Implementation

<video src="live-event-stream.m3u8" autoplay controls>
  <track src="live-captions.vtt" kind="captions" srclang="en" label="English (Live)" />
</video>

Real-World Examples

Before

<iframe src="https://example.com/live-webinar"></iframe>
<!-- Presenter speaks continuously but the platform captions are disabled -->

After

<iframe src="https://example.com/live-webinar"></iframe>
<p class="live-caption-status">Live captions are available. Click CC to enable.</p>

CSS Example (Guidance)

/* Style caption toggle buttons for visibility */
.cc-button {
  border: 1px solid #1e40b0;
  padding: 4px 8px;
  border-radius: 4px;
  background: white;
  color: #1e40b0;
  font-weight: 500;
}
.cc-button:hover {
  background: #1e40b0;
  color: white;
}

Manual testing

  1. 1. Identify all live video or audio/video events on the site.
  2. 2. Check for a CC (closed captions) or subtitles button in the media player.
  3. 3. Enable the captions and confirm they are synchronized with speech.
  4. 4. Verify that speaker changes, dialogue, and key non-speech sounds are included.
  5. 5. If captions are auto-generated, confirm that someone is monitoring accuracy during the event.
  6. 6. Ensure captions remain visible throughout the event and do not overlap important content.
eu icon getwcag

Trusted by organizations across Europe working toward WCAG and EAA conformance