R I S K M O N I T O R

Loading

Intelligent Cybersecurity Check for vulnerabilities now

Accessible Video Captions: Ensuring Equal Access

Rule ID: video-caption
Ruleset: axe-core 4.10
User Impact: Critical
Guidelines: WCAG 2.1 (A), WCAG 2.0 (A), WCAG 2.2 (A), Section 508, Trusted Tester, EN 301 549


How to Fix the Problem

To ensure accessibility for deaf and hard-of-hearing users, every <video> element on a webpage must include at least one <track> element with the kind="captions" attribute. This track must provide complete and accurate text representations of:

  • Spoken dialogue

  • Identification of speakers

  • Relevant non-speech audio (e.g., laughter, applause, music, sound effects)

Example Code Implementation:

html
<video width="300" height="200">
<source src="myVideo.mp4" type="video/mp4">
<track src="captions_en.vtt" kind="captions" srclang="en" label="english_captions">
<track src="captions_es.vtt" kind="captions" srclang="es" label="spanish_captions">
</video>

Important Notes:

  • Captions vs. Subtitles: Captions include non-verbal sound cues and speaker IDs; subtitles usually only translate dialogue.

  • Always use kind="captions" for accessibility purposes, not kind="subtitles".

  • While only the src attribute is required, including srclang and label enhances usability and clarity.

  • YouTube Tips: Though YouTube offers automatic captioning, it’s often inaccurate. However, uploading a transcript for auto-synchronization can produce accurate results with minimal editing.


Why it Matters

Captions are essential for ensuring deaf or hard-of-hearing users can understand video content. Without them, such users miss out entirely on any dialogue, narration, or contextual audio cues. This creates a significant accessibility barrier, especially in educational, informational, and instructional content.

Lack of captions can prevent:

  • Understanding key points made through speech

  • Interpreting mood or tone conveyed through music or sound

  • Following plotlines or action triggered by audio cues

By providing accurate captions, you’re making content inclusive and compliant with legal and ethical accessibility standards.


Rule Description

Each <video> element must have at least one <track> element with kind="captions" to describe the video’s audio content in a textual format. Captions should accurately represent all important sound-based information—not just spoken words.


The Algorithm (in simple terms)

  1. Search all <video> elements in the HTML.

  2. Check if any <track> child element has kind="captions".

  3. Confirm the src of the track file is provided and valid.

  4. Recommend adding srclang and label for better user experience.

Leave A Comment