Video only has an accessible alternative


Description

This rule checks that video elements without audio have an alternative available.

Applicability

The rule applies to any non-streaming video element visible, where the video doesn't contain audio.

Expectation

For each test target, the outcome of at least one of the following rules is passed:

Assumptions

This rule assumes that a mechanism is available to start the video and that the video element is not simply used to display the poster.

Accessibility Support

See Video Only Element Has Description Track: accessibility support.

Background

Test Cases

Passed

Passed Example 1

A video element without audio. The text on the page labels the video as an alternative.

<p>
	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
	data-rule-target
	src="../test-assets/perspective-video/perspective-video-with-captions-silent.mp4"
	controls
></video>

Passed Example 2

A video only element with a track element that contains descriptions.

<video controls>
	<source src="../test-assets/rabbit-video/silent.mp4" type="video/mp4" />
	<source src="../test-assets/rabbit-video/silent.webm" type="video/webm" />
	<track kind="descriptions" src="rabbit-video-descriptions.vtt" />
</video>

Passed Example 3

A silent video element with a text transcript on the same page.

<video controls data-rule-target>
  <source src="../test-assets/rabbit-video/silent.mp4" type="video/mp4"></source>
  <source src="../test-assets/rabbit-video/silent.webm" type="video/webm"></source>
</video>
<p>The above video shows a giant fat rabbit climbing out of a hole in the ground.
He stretches, yaws, and then starts walking.
Then he stops to scratch his bottom.</p>

Passed Example 4

A video element without audio has a separate audio track that describes the visual information.

<video controls>
	<source src="../test-assets/rabbit-video/silent.mp4" type="video/mp4" />
	<source src="../test-assets/rabbit-video/silent.webm" type="video/webm" />
</video>

<audio controls>
	<source src="../test-assets/rabbit-video/audio-description.mp3" type="audio/mpeg" />
</audio>

Failed

Failed Example 1

A video element that describes some of the text on the same page. The text on the page does not label the video as an alternative.

<p>
	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.
</p>
<video
	data-rule-target
	src="../test-assets/perspective-video/perspective-video-with-captions-silent.mp4"
	controls
></video>

Failed Example 2

A video only element with a track element that contains incorrect descriptions.

<video controls>
	<source src="../test-assets/rabbit-video/silent.mp4" type="video/mp4" />
	<source src="../test-assets/rabbit-video/silent.webm" type="video/webm" />
	<track kind="descriptions" src="rabbit-video-incorrect-descriptions.vtt" />
</video>

Failed Example 3

A silent video element with a link to an incorrect text transcript on a different page.

<video controls data-rule-target>
  <source src="../test-assets/rabbit-video/silent.mp4" type="video/mp4"></source>
  <source src="../test-assets/rabbit-video/silent.webm" type="video/webm"></source>
</video>
<a href="/test-assets/rabbit-video-incorrect-transcript.html">Transcript</p>

Failed Example 4

A video element without audio has a separate audio track that incorrectly describes the visual information.

<video controls>
	<source src="../test-assets/rabbit-video/silent.mp4" type="video/mp4" />
	<source src="../test-assets/rabbit-video/silent.webm" type="video/webm" />
</video>

<audio controls>
	<source src="../test-assets/rabbit-video/incorrect-audio-description.mp3" type="audio/mpeg" />
</audio>

Inapplicable

Inapplicable Example 1

A video element with audio.

<p>
	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 data-rule-target src="../test-assets/perspective-video/perspective-video.mp4" controls></video>

Inapplicable Example 2

A video only element that is not visible on the page.

<video controls style="display: none;">
	<source src="../test-assets/rabbit-video/silent.mp4" type="video/mp4" />
	<source src="../test-assets/rabbit-video/silent.webm" type="video/webm" />
	<track kind="descriptions" src="rabbit-video-descriptions.vtt" />
</video>

Glossary

Outcome

key: outcome

A conclusion that comes from evaluating an ACT Rule on a test subject or one of its constituent test target. An outcome can be one of the three following types:

  • Inapplicable: No part of the test subject matches the applicability
  • Passed: A test target meets all expectations
  • Failed: A test target does not meet all expectations

Note: A rule has one passed or failed outcome for every test target. When there are no test targets the rule has one inapplicable outcome. This means that each test subject will have one or more outcomes.

Note: Implementers using the EARL10-Schema can express the outcome with the outcome property. In addition to passed, failed and inapplicable, EARL 1.0 also defined an incomplete outcome. While this cannot be the outcome of an ACT Rule when applied in its entirety, it often happens that rules are only partially evaluated. For example, when applicability was automated, but the expectations have to be evaluated manually. Such "interim" results can be expressed with the incomplete outcome.

Visible

key: visible

Content perceivable through sight.

Content is considered visible if making it fully transparent would result in a difference in the pixels rendered for any part of the document that is currently within the viewport or can be brought into the viewport via scrolling.

Content is defined in WCAG.


Changelog

Aug 21, 2019run prettier formmating (#811)
Aug 21, 2019fix: update links to WCAG21 resources (#776)
Aug 21, 2019Editorial changes (#725)
Aug 13, 2019fix: update test assets being referred for media rules (f51b46,… (#731)
Aug 1, 2019fix input_rules so that only atomic rules are referred by composite rule (#721)
Jul 26, 2019Editorial changes (#702)
Jul 19, 2019chore: run prettier (#688)
Jul 17, 2019fix: test if definition for all referenced glossary terms exist (#634)
Jul 2, 2019Composite rules: Fix broken links in expectations (#627)
Jul 2, 2019chore: Correct various typos (#640)
May 9, 2019Chore: Adapt site to ACT Rules CR format (#547)
May 7, 2019Template update - video only has an accesible alternative (#537)
Apr 29, 2019chore: rename files and update associations (#489)
Apr 16, 2019chore: add unique id to all rules (#478)
Apr 15, 2019chore: WCAG ACT RULES CG Website Update (#437)
Jan 9, 20191.2.1 audio only and video only (#276)

Useful Links


Implementations

Tool NameCreated ByReport

Acknowledgements