Audit video-caption
Ensure <video> elements have captions
Impact:
WCAG-Konformität:
- AWCAG 1.2.2
Issue type:
needs reviewVideo element auditory content has accessible alternative
This rule checks that `video` elements have an alternative for information conveyed through audio.
Applicability
This rule applies to every non-streaming video
element that is visible, where the video contains audio.
Expectation
For each test target, the outcome of at least one of the following rules is passed:
Background
Assumptions
- This rule assumes that the video element is used to play synchronized media (video with audio), and that there is a mechanism to start the media.
- This rule assumes that the language of each test target can be correctly determined (either programmatically or by analyzing the content), and sufficiently understood.
Accessibility Support
There are no accessibility support issues known.
Bibliography
- Understanding Success Criterion 1.2.2: Captions (Prerecorded)
- G93: Providing open (always visible) captions
- G87: Providing closed captions
- H95: Using the track element to provide captions
Test Cases
Passed
Passed Example 1
A video element with an associated track element that contains captions for all the audio.
<html lang="en">
<video src="/test-assets/perspective-video/perspective-video.mp4" controls>
<track src="/test-assets/perspective-video/perspective-caption.vtt" kind="captions" />
</video>
</html>
Passed Example 2
A video element that describes some of the text on the same page. The text on the page labels the video as an alternative.
<html lang="en">
<p>
Web Accessibility Perspectives: Keyboard Accessibility. Not being able to use your computer because your mouse
doesn't work, is frustrating. Many people use only the keyboard to navigate websites. Either through preference or
circumstance. This is solved by keyboard compatibility. Keyboard compatibility is described in WCAG. See the video
below to watch the same information again in video form.
</p>
<video src="/test-assets/perspective-video/perspective-video.mp4" controls></video>
</html>
Failed
Failed Example 1
A video element without any form of captions.
<html lang="en">
<video src="/test-assets/perspective-video/perspective-video.mp4" controls></video>
</html>
Failed Example 2
A video element that describes some of the text on the same page. The video contains more information than the text does.
<html lang="en">
<p>
Not being able to use your computer because your mouse doesn't work, is frustrating. Either through preference or
circumstance. This is solved by keyboard compatibility. Keyboard compatibility is described in WCAG. See the video
below to watch the same information again in video form.
</p>
<video src="/test-assets/perspective-video/perspective-video.mp4" controls></video>
</html>
Inapplicable
Inapplicable Example 1
A video element that is not visible.
<html lang="en">
<video src="/test-assets/perspective-video/perspective-video.mp4" controls style="display: none;"></video>
</html>
Inapplicable Example 2
A video element without audio.
<html lang="en">
<video src="/test-assets/perspective-video/perspective-video-silent.mp4" controls></video>
</html>
Autoren: Brian Bors, Wilco Fiers
Finanzierung: WAI-Tools
Assets:
- Web Accessibility Perspective videos by W3C WAI.