What does this accessibility issue mean?
Accessibility issue summary: video element missing captions
Every video on a web page should include a <track> element with an HTML kind attribute of either “captions” or “subtitles”.
This attribute provides captions or subtitles for users who are deaf or hard of hearing and can help ensure your site meets WCAG standards for website accessibility.
Solution:
Ensure video elements have captions associated with them.
Example HTML violation: Video missing captions (WCAG Level A Issue)
<div>
<video src="product_video.mp4" controls="controls" width="300" height="150"></video>
</div>Explanation: This HTML code violates the accessibility rule 'video-caption' because it includes a video element that does not contain a track element with kind='captions'.
This is critical for deaf users or users with hearing impairments as they may not be able to understand the auditory information in the video.
Corrected HTML Markup:
How to fix "Video missing captions (WCAG Level A Issue)" issue
<div>
<video src="product_video.mp4" controls="controls" width="300" height="150">
<track src="captions_en.vtt" kind="captions" srclang="en" label="English" />
</video>
</div>The corrected HTML code includes a track element with the kind attribute set to 'captions'. This track links to a captions file (captions_en.vtt) which provides deaf users and those with hearing impairments the necessary information to understand the video content.
