Skip to content

Update ee13b5 and 1a02b0 rules to clarify that transcript for video content does not need to be visible #2187

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 15 commits into
base: develop
Choose a base branch
from
Open

Update ee13b5 and 1a02b0 rules to clarify that transcript for video content does not need to be visible #2187

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
0d83c20
Address clarification about non-visible transcription for video-only …
giacomo-petri May 3, 2024
0cbfe66
Update video-transcript-1a02b0.md
giacomo-petri May 3, 2024
86a5ee6
Update video-transcript-1a02b0.md
giacomo-petri May 3, 2024
551e806
Update video-only-transcript-ee13b5.md
giacomo-petri May 23, 2024
609219d
Update _rules/video-transcript-1a02b0.md
giacomo-petri Aug 4, 2025
b3a092e
Update _rules/video-only-transcript-ee13b5.md
giacomo-petri Aug 4, 2025
922d9bf
Update _rules/video-transcript-1a02b0.md
giacomo-petri Aug 4, 2025
f2b99f7
Update video-only-transcript-ee13b5.md
giacomo-petri Aug 4, 2025
4c44dad
Update video-transcript-1a02b0.md
giacomo-petri Aug 4, 2025
7f864e7
Apply suggestions from code review
giacomo-petri Aug 7, 2025
a70a1ba
Update _rules/video-transcript-1a02b0.md
kengdoj Aug 8, 2025
739ec88
Update _rules/video-transcript-1a02b0.md
kengdoj Aug 8, 2025
ea3f6e4
fixed headings per new format
giacomo-petri Aug 11, 2025
dd37459
fix headings per new format
giacomo-petri Aug 11, 2025
c4c48c6
Merge branch 'develop' into giacomo-petri-video-only-transcript-patch
giacomo-petri Aug 11, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 27 additions & 5 deletions _rules/video-only-transcript-ee13b5.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,11 @@ accessibility_requirements:
failed: not satisfied
passed: further testing needed
inapplicable: further testing needed
wcag20:1.3.1: # Info and Relationships (A)
secondary: This success criterion is **related** to this rule. This is because this criterion applies to a visible transcript.
wcag20:1.2.1: # Audio-only and Video-only (Prerecorded) (A)
secondary: This success criterion is **less strict** than this rule. This is because this criterion does not require a transcript when the audio-only or video-only is a media alternative for text and is clearly labeled as such. Some of the failed examples may satisfy this success criterion.

input_aspects:
- DOM Tree
- CSS Styling
Expand All @@ -37,15 +42,16 @@ This rule applies to any [non-streaming](#non-streaming-media-element) `video` e

## Expectation

The visual information of each test target is available through a text transcript that is [visible][], [included in the accessibility tree][], and is either on the page or linked.
The visual information of each test target is available through a text transcript that is [included in the accessibility tree][], and is either on the page or linked.

## Background

A "text transcript" in the context of this rule is defined in WCAG 2 as an [alternative for time based media](https://www.w3.org/TR/WCAG22/#dfn-alternative-for-time-based-media).

### Assumptions

A mechanism is available to start the video and that the video element is not simply used to display the [poster](https://www.w3.org/TR/html5/semantics-embedded-content.html#element-attrdef-video-poster).
- A mechanism is available to start the video and that the video element is not simply used to display the [poster](https://www.w3.org/TR/html5/semantics-embedded-content.html#element-attrdef-video-poster).
- Users who are not visually impaired can comprehend the contents of the video through visual cues and information presented visually.

### Accessibility Support

Expand All @@ -62,7 +68,7 @@ There are no accessibility support issues known.

#### Passed Example 1

This `video` element, which has no audio, has a text transcript available on the same page.
This `video` element, which has no audio, has a visible text transcript available on the same page.

```html
<html lang="en">
Expand Down Expand Up @@ -90,6 +96,22 @@ This `video` element, which has no audio, has a transcript which conveys informa
</html>
```

#### Passed Example 3

This `video` element, which has no audio, has a non-visible text transcript available on the same page.

```html
<html lang="en">
<video controls>
<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 style="position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;">This video shows a giant fat rabbit climbing out of a hole in the ground.
He stretches, yawns, and then starts walking.
Then he stops to scratch his bottom.</p>
</html>
```

### Failed

#### Failed Example 1
Expand Down Expand Up @@ -132,7 +154,7 @@ This `video` element, which has no audio, has a text transcript available on the
<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 style="text-indent: -9999px;">The above video shows a giant fat rabbit climbing out of a hole in the ground.
<p style="text-indent: -9999px;">This video shows a giant fat rabbit climbing out of a hole in the ground.
He stretches, yawns, and then starts walking.
Then he stops to scratch his bottom.</p>
</html>
Expand All @@ -148,7 +170,7 @@ This `video` element, which has no audio, has a text transcript available on the
<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 aria-hidden="true">The above video shows a giant fat rabbit climbing out of a hole in the ground.
<p aria-hidden="true">This video shows a giant fat rabbit climbing out of a hole in the ground.
He stretches, yawns, and then starts walking.
Then he stops to scratch his bottom.</p>
</html>
Expand Down
68 changes: 65 additions & 3 deletions _rules/video-transcript-1a02b0.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,10 @@ accessibility_requirements:
failed: not satisfied
passed: further testing needed
inapplicable: further testing needed
wcag20:1.3.1: # Info and Relationships (A)
secondary: This success criterion is **related** to this rule. This is because this criterion applies to a visible transcript.
wcag20:1.2.1: # Audio-only and Video-only (Prerecorded) (A)
secondary: This success criterion is **less strict** than this rule. This is because this criterion does not require a transcript when the audio-only or video-only is a media alternative for text and is clearly labeled as such. Some of the failed examples may satisfy this success criterion.
input_aspects:
- DOM Tree
- CSS Styling
Expand All @@ -42,15 +46,16 @@ This rule applies to every [non-streaming](#non-streaming-media-element) `video`

## Expectation

The visual information of each test target is available through a text transcript that is [visible][], [included in the accessibility tree][], and is either on the page or linked.
The visual information of each test target is available through a text transcript that is [included in the accessibility tree][], and is either on the page or linked.

**Note:** A "text transcript" in the context of this rule is defined in WCAG 2 as an [alternative for time based media](https://www.w3.org/TR/WCAG22/#dfn-alternative-for-time-based-media).

## Background

### 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](https://www.w3.org/TR/html5/semantics-embedded-content.html#element-attrdef-video-poster).
- 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](https://www.w3.org/TR/html5/semantics-embedded-content.html#element-attrdef-video-poster).
- Users who are not visually impaired can comprehend the contents of the video through visual cues and information presented visually.

### Accessibility Support

Expand All @@ -70,7 +75,7 @@ There are no accessibility support issues known.

#### Passed Example 1

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

```html
<html lang="en">`
Expand Down Expand Up @@ -98,6 +103,35 @@ A video element with a link to a text transcript on a different page.
</html>
```

#### Passed Example 3

This `video` element has a non-visible text transcript available on the same page.

```html
<html lang="en">
<video controls>
<source src="/test-assets/rabbit-video/video.mp4" type="video/mp4"></source>
<source src="/test-assets/rabbit-video/video.webm" type="video/webm"></source>
</video>
<p style="position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;">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>
</html>
```

#### Passed Example 4

A video element with an associated track element that contains captions for all the audio and a transcript on the page.

```html
<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>
<p> Web Accessibility Perspectives: Keyboard Accessibility. Not being able to use your computer because your mouse doesn't work, is frustrating. (A computer user's mouse breaks when it falls off the desk.) Many people use only the keyboard to navigate websites. Either through preference or circumstance. (A person wearing a sling on her arm typing with one hand.) </p>
</html>
```

### Failed

#### Failed Example 1
Expand Down Expand Up @@ -130,6 +164,34 @@ A video element with a link to an incorrect text transcript on a different page.
</html>
```

#### Failed Example 3

This `video` element has a text transcript available on the same page, but the transcript is not [included in the accessibility tree][].

```html
<html lang="en">
<video controls>
<source src="/test-assets/rabbit-video/video.mp4" type="video/mp4"></source>
<source src="/test-assets/rabbit-video/video.webm" type="video/webm"></source>
</video>
<p aria-hidden="true">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>
</html>
```

#### Failed Example 4

A video element with audio does not have a text transcript.

```html
<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>
```

### Inapplicable

#### Inapplicable Example 1
Expand Down