Accessible Videos

Video is one of the most information-dense media types, and one of the most frequently inaccessible. Captions, audio descriptions, and transcripts are not optional extras — they are legally required for government and nonprofit websites under DOJ Title II.

Note: Future updates to this page will add interactive working components — live examples, editors, and tools — directly in the browser.

Why this matters for neurodivergent users

Captions benefit all neurodivergent viewers, not only those who are deaf or hard of hearing. For ADHD users, captions provide a second channel of information that helps maintain focus when attention drifts from the audio. For dyslexic users, hearingand seeing the words simultaneously reinforces comprehension. For autistic users, captions reduce the cognitive effort of parsing tone of voice and facial expressions.

Transcripts let users search, skim, and jump to the sections they need — critical for users who cannot process audio at full speed or who need to return to a specific moment.

WCAG requirements for video

WCAG video requirements by level. AA is the DOJ Title II baseline; AAA is recommended for public services.
RequirementLevelApplies toSC
Captions (prerecorded)AASynchronized text equivalent of all spoken dialogue and sounds1.2.2
Audio description (prerecorded)AANarration of visual information not conveyed in the main audio1.2.5
Sign language (prerecorded)AAASign language interpretation of all audio content1.2.6
Extended audio description (prerecorded)AAAPauses video to allow full description of visual content1.2.7
Media alternative (prerecorded)AAAFull text transcript including visual and audio information1.2.8
Captions (live)AAReal-time captions for live video1.2.4
Pause, stop, hideAUser control over auto-playing video2.2.2
No flashingA / AAANo content flashes more than 3/sec (2.3.1 AA); no flashing (2.3.2 AAA)2.3.1, 2.3.2

Embedding YouTube videos accessibly

YouTube embeds include captions when the video has them. Always enable captions by default using the cc_load_policy=1 parameter. The iframe must have a descriptive title attribute:

<div
  style={{
    position: "relative",
    paddingBottom: "56.25%", /* 16:9 */
    height: 0,
    overflow: "hidden",
  }}
>
  <iframe
    src="https://www.youtube.com/embed/VIDEO_ID?cc_load_policy=1&rel=0"
    title="How to perform a manual WCAG accessibility audit (14 minutes)"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
    allowFullScreen
    style={{
      position: "absolute",
      top: 0,
      left: 0,
      width: "100%",
      height: "100%",
      border: 0,
    }}
  />
</div>

Caption quality standards

Auto-generated captions (YouTube, Whisper) are a starting point only. Review and correct them before publishing. Common auto-caption failures:

  • Proper nouns spelled phonetically (“WCAG” → “we cag”)
  • Missing punctuation and sentence boundaries
  • Speaker identification absent in multi-speaker videos
  • Sound effects not captioned ([applause], [music])
  • Timing misaligned by more than 2 seconds

For government content, caption accuracy below 99% is a liability. Use a human-reviewed caption service or correct auto-captions before publishing.

Writing audio descriptions

Audio descriptions narrate visual information that is not spoken aloud. Include:

  • On-screen text (slide titles, form fields, URLs shown)
  • Speaker identification when not stated in dialogue: “The presenter advances to a slide titled WCAG 2.1 Overview”
  • Meaningful visual actions: “The inspector selects the heading element and the Accessibility pane shows role: heading, level: 2”

Providing a text transcript

A full text transcript (SC 1.2.8, AAA) is the most versatile alternative. It allows:

  • Search engines to index the video content
  • Users to read at their own pace
  • Translation into other languages
  • Keyboard navigation to specific sections

Place the transcript on the same page, below the video, in an accessible <details> element or a dedicated section with a heading. Do not link to an external PDF.

Accessible player controls

Custom video players must meet SC 4.1.2 (Name, Role, Value) for all controls. Every button needs:

  • A visible label or aria-label
  • Keyboard operability (Enter/Space to activate, Tab to focus)
  • Visible focus indicator meeting SC 2.4.11 (AAA)
  • 4.5:1 contrast on the control against its background

Native <video> elements with browser-default controls satisfy these requirements in all modern browsers. Only build a custom player if the default controls genuinely do not meet your design requirements.

Testing checklist

  • Enable captions — confirm they are accurate, timed, and identify speakers.
  • Watch with audio off — all visual information should be described.
  • Navigate all player controls by keyboard only.
  • Run axe-core — rules video-caption, video-description.
  • Verify the transcript is present and covers all audio and visual information.