Initial commit
This commit is contained in:
@@ -0,0 +1,87 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.1.1 Non-text Content
|
||||
|
||||
- Level: A
|
||||
- Guideline: 1.1 Text Alternatives
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for the situations listed below.
|
||||
|
||||
- **Controls, Input:** If non-text content is a control or accepts user input, then it has a name that describes its purpose. (Refer to Success Criterion 4.1.2 for additional requirements for controls and content that accepts user input.)
|
||||
- **Time-Based Media:** If non-text content is time-based media, then text alternatives at least provide descriptive identification of the non-text content. (Refer to Guideline 1.2 for additional requirements for media.)
|
||||
- **Test:** If non-text content is a test or exercise that would be invalid if presented in text, then text alternatives at least provide descriptive identification of the non-text content.
|
||||
- **Sensory:** If non-text content is primarily intended to create a specific sensory experience, then text alternatives at least provide descriptive identification of the non-text content.
|
||||
- **CAPTCHA:** If the purpose of non-text content is to confirm that content is being accessed by a person rather than a computer, then text alternatives that identify and describe the purpose of the non-text content are provided, and alternative forms of CAPTCHA using output modes for different types of sensory perception are provided to accommodate different disabilities.
|
||||
- **Decoration, Formatting, Invisible:** If non-text content is pure decoration, is used only for visual formatting, or is not presented to users, then it is implemented in a way that it can be ignored by assistive technology.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: If non-text content is a control or accepts user input, then it has a name that describes its purpose. (Refer to Success Criterion 4.1.2 for additional requirements for controls and content that accepts user input.)
|
||||
- Check: If non-text content is time-based media, then text alternatives at least provide descriptive identification of the non-text content. (Refer to Guideline 1.2 for additional requirements for media.)
|
||||
- Check: If non-text content is a test or exercise that would be invalid if presented in text, then text alternatives at least provide descriptive identification of the non-text content.
|
||||
- Check: If non-text content is primarily intended to create a specific sensory experience, then text alternatives at least provide descriptive identification of the non-text content.
|
||||
- Check: If the purpose of non-text content is to confirm that content is being accessed by a person rather than a computer, then text alternatives that identify and describe the purpose of the non-text content are provided, and alternative forms of CAPTCHA using output modes for different types of sensory perception are provided to accommodate different disabilities.
|
||||
- Check: If non-text content is pure decoration, is used only for visual formatting, or is not presented to users, then it is implemented in a way that it can be ignored by assistive technology.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G94: Providing short text alternative for non-text content that serves the same purpose and presents the same information as the non-text content
|
||||
- ARIA6: Using aria-label to provide labels for objects
|
||||
- ARIA10: Using aria-labelledby to provide a text alternative for non-text content
|
||||
- G196: Using a text alternative on one item within a group of images that describes all items in the group
|
||||
- H2: Combining adjacent image and text links for the same resource
|
||||
- H37: Using alt attributes on img elements
|
||||
- H53: Using the body of the object element
|
||||
- H86: Providing text alternatives for emojis, emoticons, ASCII art, and leetspeak
|
||||
- PDF1: Applying text alternatives to images with the Alt entry in PDF documents
|
||||
- G95: Providing short text alternatives that provide a brief description of the non-text content
|
||||
- ARIA15: Using aria-describedby to provide descriptions of images
|
||||
- G73: Providing a long description in another location with a link to it that is immediately adjacent to the non-text content
|
||||
- G74: Providing a long description in text near the non-text content, with a reference to the location of the long description in the short description
|
||||
- G92: Providing long description for non-text content that serves the same purpose and presents the same information
|
||||
- G82: Providing a text alternative that identifies the purpose of the non-text content
|
||||
- ARIA9: Using aria-labelledby to concatenate a label from several text nodes
|
||||
- H24: Providing text alternatives for the area elements of image maps
|
||||
- H30: Providing link text that describes the purpose of a link for anchor elements
|
||||
- H36: Using alt attributes on images used as submit buttons
|
||||
- H44: Using label elements to associate text labels with form controls
|
||||
- H65: Using the title attribute to identify form controls when the label element cannot be used
|
||||
- Providing a descriptive label
|
||||
- G68: Providing a short text alternative that describes the purpose of live audio-only and live video-only content
|
||||
- G100: Providing a short text alternative which is the accepted name or a descriptive name of the non-text content
|
||||
- G143: Providing a text alternative that describes the purpose of the CAPTCHA
|
||||
- G144: Ensuring that the web page contains another CAPTCHA serving the same purpose using a different modality
|
||||
- Implementing or marking the non-text content so that it will be ignored by assistive technology
|
||||
- C9: Using CSS to include decorative images
|
||||
- H67: Using null alt text and no title attribute on img elements for images that assistive technology should ignore
|
||||
- PDF4: Hiding decorative images with the Artifact tag in PDF documents
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- C18: Using CSS margin and padding rules instead of spacer images for layout design
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F3: Failure of Success Criterion 1.1.1 due to using CSS to include images that convey important information
|
||||
- F13: Failure of Success Criterion 1.1.1 and 1.4.1 due to having a text alternative that does not include information that is conveyed by color differences in the image
|
||||
- F20: Failure of Success Criterion 1.1.1 and 4.1.2 due to not updating text alternatives when changes to non-text content occur
|
||||
- F30: Failure of Success Criterion 1.1.1 and 1.2.1 due to using text alternatives that are not alternatives (e.g., filenames or placeholder text)
|
||||
- F38: Failure of Success Criterion 1.1.1 due to not marking up decorative images in HTML in a way that allows assistive technology to ignore them
|
||||
- F39: Failure of Success Criterion 1.1.1 due to providing a text alternative that is not null (e.g., alt="spacer" or alt="image") for images that should be ignored by assistive technology
|
||||
- F65: Failure of Success Criterion 1.1.1 due to omitting the alt attribute or text alternative on img elements, area elements, and input elements of type "image"
|
||||
- F67: Failure of Success Criterion 1.1.1 and 1.2.1 due to providing long descriptions for non-text content that does not serve the same purpose or does not present the same information
|
||||
- F71: Failure of Success Criterion 1.1.1 due to using text look-alikes to represent text without providing a text alternative
|
||||
- F72: Failure of Success Criterion 1.1.1 due to using ASCII art without providing a text alternative
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#non-text-content
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/non-text-content.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#non-text-content
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,44 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.2.1 Audio-only and Video-only (Prerecorded)
|
||||
|
||||
- Level: A
|
||||
- Guideline: 1.2 Time-based Media
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
For prerecorded audio-only and prerecorded video-only media, the following are true, except when the audio or video is a media alternative for text and is clearly labeled as such:
|
||||
|
||||
- **Prerecorded Audio-only:** An alternative for time-based media is provided that presents equivalent information for prerecorded audio-only content.
|
||||
- **Prerecorded Video-only:** Either an alternative for time-based media or an audio track is provided that presents equivalent information for prerecorded video-only content.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: An alternative for time-based media is provided that presents equivalent information for prerecorded audio-only content.
|
||||
- Check: Either an alternative for time-based media or an audio track is provided that presents equivalent information for prerecorded video-only content.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G158: Providing an alternative for time-based media for audio-only content
|
||||
- G159: Providing an alternative for time-based media for video-only content
|
||||
- G166: Providing audio that describes the important video content and describing it as such
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- H96: Using the track element to provide audio descriptions
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F30: Failure of Success Criterion 1.1.1 and 1.2.1 due to using text alternatives that are not alternatives (e.g., filenames or placeholder text)
|
||||
- F67: Failure of Success Criterion 1.1.1 and 1.2.1 due to providing long descriptions for non-text content that does not serve the same purpose or does not present the same information
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#audio-only-and-video-only-prerecorded
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/audio-only-and-video-only-prerecorded.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#audio-only-and-video-only-prerecorded
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,40 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.2.2 Captions (Prerecorded)
|
||||
|
||||
- Level: A
|
||||
- Guideline: 1.2 Time-based Media
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Captions are provided for all prerecorded audio content in synchronized media, except when the media is a media alternative for text and is clearly labeled as such.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Captions are provided for all prerecorded audio content in synchronized media, except when the media is a media alternative for text and is clearly labeled as such.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G93: Providing open (always visible) captions
|
||||
- G87: Providing closed captions
|
||||
- SM11: Providing captions through synchronized text streams in SMIL 1.0
|
||||
- SM12: Providing captions through synchronized text streams in SMIL 2.0
|
||||
- H95: Using the track element to provide captions
|
||||
- Using any readily available media format that has a video player that supports closed captioning
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F8: Failure of Success Criterion 1.2.2 due to captions omitting some dialogue or important sound effects
|
||||
- F75: Failure of Success Criterion 1.2.2 by providing synchronized media without captions when the synchronized media presents more information than is presented on the page
|
||||
- F74: Failure of Success Criterion 1.2.2 and 1.2.8 due to not labeling a synchronized media alternative to text as an alternative
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#captions-prerecorded
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/captions-prerecorded.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#captions-prerecorded
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,44 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.2.3 Audio Description or Media Alternative (Prerecorded)
|
||||
|
||||
- Level: A
|
||||
- Guideline: 1.2 Time-based Media
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
An alternative for time-based media or audio description of the prerecorded video content is provided for synchronized media, except when the media is a media alternative for text and is clearly labeled as such.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: An alternative for time-based media or audio description of the prerecorded video content is provided for synchronized media, except when the media is a media alternative for text and is clearly labeled as such.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G69: Providing an alternative for time based media
|
||||
- G58: Placing a link to the alternative for time-based media immediately next to the non-text content
|
||||
- H53: Using the body of the object element
|
||||
- G78: Providing a second, user-selectable, audio track that includes audio descriptions
|
||||
- G173: Providing a version of a movie with audio descriptions
|
||||
- SM6: Providing audio description in SMIL 1.0
|
||||
- SM7: Providing audio description in SMIL 2.0
|
||||
- G226: Providing audio descriptions by incorporating narration in the soundtrack
|
||||
- Using any player that supports audio and video
|
||||
- G8: Providing a movie with extended audio descriptions
|
||||
- SM1: Adding extended audio description in SMIL 1.0
|
||||
- SM2: Adding extended audio description in SMIL 2.0
|
||||
- G203: Using a static text alternative to describe a talking head video
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- H96: Using the track element to provide audio descriptions
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#audio-description-or-media-alternative-prerecorded
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/audio-description-or-media-alternative-prerecorded.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#audio-description-or-media-alternative-prerecorded
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,33 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.2.4 Captions (Live)
|
||||
|
||||
- Level: AA
|
||||
- Guideline: 1.2 Time-based Media
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Captions are provided for all live audio content in synchronized media.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Captions are provided for all live audio content in synchronized media.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G9: Creating captions for live synchronized media
|
||||
- G93: Providing open (always visible) captions
|
||||
- G87: Providing closed captions
|
||||
- SM11: Providing captions through synchronized text streams in SMIL 1.0
|
||||
- SM12: Providing captions through synchronized text streams in SMIL 2.0
|
||||
- Using any readily available media format that has a video player that supports closed captioning
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#captions-live
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/captions-live.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#captions-live
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,46 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.2.5 Audio Description (Prerecorded)
|
||||
|
||||
- Level: AA
|
||||
- Guideline: 1.2 Time-based Media
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Audio description is provided for all prerecorded video content in synchronized media.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Audio description is provided for all prerecorded video content in synchronized media.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G78: Providing a second, user-selectable, audio track that includes audio descriptions
|
||||
- G173: Providing a version of a movie with audio descriptions
|
||||
- SM6: Providing audio description in SMIL 1.0
|
||||
- SM7: Providing audio description in SMIL 2.0
|
||||
- G226: Providing audio descriptions by incorporating narration in the soundtrack
|
||||
- Using any player that supports audio and video
|
||||
- G8: Providing a movie with extended audio descriptions
|
||||
- SM1: Adding extended audio description in SMIL 1.0
|
||||
- SM2: Adding extended audio description in SMIL 2.0
|
||||
- G203: Using a static text alternative to describe a talking head video
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- H96: Using the track element to provide audio descriptions
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F113: Failure of Success Criterion 1.2.5 due to not using available pauses in dialogue to provide audio descriptions of important visual content
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#audio-description-prerecorded
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/audio-description-prerecorded.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#audio-description-prerecorded
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,31 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.2.6 Sign Language (Prerecorded)
|
||||
|
||||
- Level: AAA
|
||||
- Guideline: 1.2 Time-based Media
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Sign language interpretation is provided for all prerecorded audio content in synchronized media.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Sign language interpretation is provided for all prerecorded audio content in synchronized media.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G54: Including a sign language interpreter in the video stream
|
||||
- G81: Providing a synchronized video of the sign language interpreter that can be displayed in a different viewport or overlaid on the image by the player
|
||||
- SM13: Providing sign language interpretation through synchronized video streams in SMIL 1.0
|
||||
- SM14: Providing sign language interpretation through synchronized video streams in SMIL 2.0
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#sign-language-prerecorded
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/sign-language-prerecorded.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#sign-language-prerecorded
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,35 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.2.7 Extended Audio Description (Prerecorded)
|
||||
|
||||
- Level: AAA
|
||||
- Guideline: 1.2 Time-based Media
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Where pauses in foreground audio are insufficient to allow audio descriptions to convey the sense of the video, extended audio description is provided for all prerecorded video content in synchronized media.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Where pauses in foreground audio are insufficient to allow audio descriptions to convey the sense of the video, extended audio description is provided for all prerecorded video content in synchronized media.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G8: Providing a movie with extended audio descriptions
|
||||
- SM1: Adding extended audio description in SMIL 1.0
|
||||
- SM2: Adding extended audio description in SMIL 2.0
|
||||
- Using any player that supports audio and video
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- H96: Using the track element to provide audio descriptions
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#extended-audio-description-prerecorded
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/extended-audio-description-prerecorded.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#extended-audio-description-prerecorded
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,36 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.2.8 Media Alternative (Prerecorded)
|
||||
|
||||
- Level: AAA
|
||||
- Guideline: 1.2 Time-based Media
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
An alternative for time-based media is provided for all prerecorded synchronized media and for all prerecorded video-only media.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: An alternative for time-based media is provided for all prerecorded synchronized media and for all prerecorded video-only media.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G69: Providing an alternative for time based media
|
||||
- G58: Placing a link to the alternative for time-based media immediately next to the non-text content
|
||||
- H53: Using the body of the object element
|
||||
- G159: Providing an alternative for time-based media for video-only content
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F74: Failure of Success Criterion 1.2.2 and 1.2.8 due to not labeling a synchronized media alternative to text as an alternative
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#media-alternative-prerecorded
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/media-alternative-prerecorded.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#media-alternative-prerecorded
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,30 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.2.9 Audio-only (Live)
|
||||
|
||||
- Level: AAA
|
||||
- Guideline: 1.2 Time-based Media
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
An alternative for time-based media that presents equivalent information for live audio-only content is provided.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: An alternative for time-based media that presents equivalent information for live audio-only content is provided.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G151: Providing a link to a text transcript of a prepared statement or script if the script is followed
|
||||
- G150: Providing text based alternatives for live audio-only content
|
||||
- G157: Incorporating a live audio captioning service into a web page
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#audio-only-live
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/audio-only-live.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#audio-only-live
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,85 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.3.1 Info and Relationships
|
||||
|
||||
- Level: A
|
||||
- Guideline: 1.3 Adaptable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- ARIA11: Using ARIA landmarks to identify regions of a page
|
||||
- H101: Using semantic HTML elements to identify regions of a page
|
||||
- ARIA12: Using role=heading to identify headings
|
||||
- ARIA13: Using aria-labelledby to name regions and landmarks
|
||||
- ARIA16: Using aria-labelledby to provide a name for user interface controls
|
||||
- ARIA17: Using grouping roles to identify related form controls
|
||||
- ARIA20: Using the region role to identify a region of the page
|
||||
- G115: Using semantic elements to mark up structure
|
||||
- H49: Using semantic markup to mark emphasized or special text
|
||||
- G117: Using text to convey information that is conveyed by variations in presentation of text
|
||||
- G140: Separating information and structure from presentation to enable different presentations
|
||||
- ARIA24: Semantically identifying a font icon with role="img"
|
||||
- G138: Using semantic markup whenever color cues are used
|
||||
- H51: Using table markup to present tabular information
|
||||
- PDF6: Using table elements for table markup in PDF Documents
|
||||
- PDF20: Using Adobe Acrobat Pro's Table Editor to repair mistagged tables
|
||||
- H39: Using caption elements to associate data table captions with data tables
|
||||
- H63: Using the scope attribute to associate header cells with data cells in data tables
|
||||
- H43: Using id and headers attributes to associate data cells with header cells in data tables
|
||||
- H44: Using label elements to associate text labels with form controls
|
||||
- H65: Using the title attribute to identify form controls when the label element cannot be used
|
||||
- PDF10: Providing labels for interactive form controls in PDF documents
|
||||
- PDF12: Providing name, role, value information for form fields in PDF documents
|
||||
- H71: Providing a description for groups of form controls using fieldset and legend elements
|
||||
- H85: Using optgroup to group option elements inside a select
|
||||
- H48: Using ol, ul and dl for lists or groups of links
|
||||
- H42: Using h1-h6 to identify headings
|
||||
- PDF9: Providing headings by marking content with heading tags in PDF documents
|
||||
- PDF11: Providing links and link text using the Link annotation and the /Link structure element in PDF documents
|
||||
- PDF17: Specifying consistent page numbering for PDF documents
|
||||
- PDF21: Using List tags for lists in PDF documents
|
||||
- H97: Grouping related links using the nav element
|
||||
- T1: Using standard text formatting conventions for paragraphs
|
||||
- T2: Using standard text formatting conventions for lists
|
||||
- T3: Using standard text formatting conventions for headings
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- C22: Using CSS to control visual presentation of text
|
||||
- G162: Positioning labels to maximize predictability of relationships
|
||||
- ARIA1: Using the aria-describedby property to provide a descriptive label for user interface controls
|
||||
- ARIA2: Identifying a required field with the aria-required property
|
||||
- G141: Organizing a page using headings
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F2: Failure of Success Criterion 1.3.1 due to using changes in text presentation to convey information without using the appropriate markup or text
|
||||
- F33: Failure of Success Criterion 1.3.1 and 1.3.2 due to using white space characters to create multiple columns in plain text content
|
||||
- F34: Failure of Success Criterion 1.3.1 and 1.3.2 due to using white space characters to format tables in plain text content
|
||||
- F42: Failure of Success Criteria 1.3.1, 2.1.1, 2.1.3, or 4.1.2 when emulating links
|
||||
- F43: Failure of Success Criterion 1.3.1 due to using structural markup in a way that does not represent relationships in the content
|
||||
- F46: Failure of Success Criterion 1.3.1 due to using th elements, caption elements, or non-empty summary attributes in layout tables
|
||||
- F48: Failure of Success Criterion 1.3.1 due to using the pre element to markup tabular information
|
||||
- F90: Failure of Success Criterion 1.3.1 for incorrectly associating table headers and content via the headers and id attributes
|
||||
- F91: Failure of Success Criterion 1.3.1 for not correctly marking up table headers
|
||||
- F92: Failure of Success Criterion 1.3.1 due to the use of role presentation on content which conveys semantic information
|
||||
- F111: Failure of Success Criteria 1.3.1, 2.5.3, and 4.1.2 due to a control with visible label text but no accessible name
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#info-and-relationships
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/info-and-relationships.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#info-and-relationships
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,43 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.3.2 Meaningful Sequence
|
||||
|
||||
- Level: A
|
||||
- Guideline: 1.3 Adaptable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
When the sequence in which content is presented affects its meaning, a correct reading sequence can be programmatically determined.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: When the sequence in which content is presented affects its meaning, a correct reading sequence can be programmatically determined.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G57: Ordering the content in a meaningful sequence
|
||||
- H34: Using a Unicode right-to-left mark (RLM) or left-to-right mark (LRM) to mix text direction inline
|
||||
- H56: Using the dir attribute on an inline element to resolve problems with nested directional runs
|
||||
- C6: Positioning content based on structural markup
|
||||
- C8: Using CSS letter-spacing to control spacing within a word
|
||||
- C27: Making the DOM order match the visual order
|
||||
- PDF3: Ensuring correct tab and reading order in PDF documents
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F34: Failure of Success Criterion 1.3.1 and 1.3.2 due to using white space characters to format tables in plain text content
|
||||
- F33: Failure of Success Criterion 1.3.1 and 1.3.2 due to using white space characters to create multiple columns in plain text content
|
||||
- F32: Failure of Success Criterion 1.3.2 due to using white space characters to control spacing within a word
|
||||
- F49: Failure of Success Criterion 1.3.2 due to using an HTML layout table that does not make sense when linearized
|
||||
- F1: Failure of Success Criterion 1.3.2 due to changing the meaning of content by positioning information with CSS
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#meaningful-sequence
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/meaningful-sequence.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#meaningful-sequence
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,38 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.3.3 Sensory Characteristics
|
||||
|
||||
- Level: A
|
||||
- Guideline: 1.3 Adaptable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Instructions provided for understanding and operating content do not rely solely on sensory characteristics of components such as shape, color, size, visual location, orientation, or sound.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Instructions provided for understanding and operating content do not rely solely on sensory characteristics of components such as shape, color, size, visual location, orientation, or sound.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G96: Providing textual identification of items that otherwise rely only on sensory information to be understood
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F14: Failure of Success Criterion 1.3.3 due to identifying content only by its shape or location
|
||||
- F26: Failure of Success Criterion 1.3.3 due to using a graphical symbol alone to convey information
|
||||
|
||||
## Notes
|
||||
|
||||
- Note: For requirements related to color, refer to Guideline 1.4.
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#sensory-characteristics
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/sensory-characteristics.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#sensory-characteristics
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,38 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.3.4 Orientation
|
||||
|
||||
- Level: AA
|
||||
- Guideline: 1.3 Adaptable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Content does not restrict its view and operation to a single display orientation, such as portrait or landscape, unless a specific display orientation is essential.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Content does not restrict its view and operation to a single display orientation, such as portrait or landscape, unless a specific display orientation is essential.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G214: Using a control to allow access to content in different orientations which is otherwise restricted
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F97: Failure due to locking the orientation to landscape or portrait view
|
||||
- F100: Failure of Success Criterion 1.3.4 due to showing a message asking to reorient device
|
||||
|
||||
## Notes
|
||||
|
||||
- Note: Examples where a particular display orientation may be essential are a bank check, a piano application, slides for a projector or television, or virtual reality content where content is not necessarily restricted to landscape or portrait display orientation.
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#orientation
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/orientation.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#orientation
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,37 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.3.5 Identify Input Purpose
|
||||
|
||||
- Level: AA
|
||||
- Guideline: 1.3 Adaptable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
The purpose of each input field collecting information about the user can be programmatically determined when:
|
||||
|
||||
- The input field serves a purpose identified in the Input Purposes for user interface components section; and
|
||||
- The content is implemented using technologies with support for identifying the expected meaning for form input data.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: The input field serves a purpose identified in the Input Purposes for user interface components section; and
|
||||
- Check: The content is implemented using technologies with support for identifying the expected meaning for form input data.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- H98: Using HTML autocomplete attributes
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F107: Failure of Success Criterion 1.3.5 due to incorrect autocomplete attribute values
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#identify-input-purpose
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/identify-input-purpose.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#identify-input-purpose
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,36 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.3.6 Identify Purpose
|
||||
|
||||
- Level: AAA
|
||||
- Guideline: 1.3 Adaptable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
In content implemented using markup languages, the purpose of user interface components, icons, and regions can be programmatically determined.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: In content implemented using markup languages, the purpose of user interface components, icons, and regions can be programmatically determined.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- Programmatically indicating the purpose of icons, regions and user interface components
|
||||
- ARIA11: Using ARIA landmarks to identify regions of a page
|
||||
- Using microdata to markup user interface components (future link)
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- Enabling user agents to find the version of the content that best fits their needs
|
||||
- Using semantics to identify important features (e.g., coga-simplification="simplest")
|
||||
- Using aria-invalid and aria-required
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#identify-purpose
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/identify-purpose.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#identify-purpose
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,47 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.1 Use of Color
|
||||
|
||||
- Level: A
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G14: Ensuring that information conveyed by color differences is also available in text
|
||||
- G205: Including a text cue for colored form control labels
|
||||
- G182: Ensuring that additional visual cues are available when text color differences are used to convey information
|
||||
- G183: Using a contrast ratio of 3:1 with surrounding text and providing additional visual cues on hover for links or controls where color alone is used to identify them
|
||||
- G111: Using color and pattern
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- C15: Using CSS to change the presentation of a user interface component when it receives focus
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F13: Failure of Success Criterion 1.1.1 and 1.4.1 due to having a text alternative that does not include information that is conveyed by color differences in the image
|
||||
- F73: Failure of Success Criterion 1.4.1 due to creating links that are not visually evident without color vision
|
||||
- F81: Failure of Success Criterion 1.4.1 due to identifying required or error fields using color differences only
|
||||
|
||||
## Notes
|
||||
|
||||
- Note: This success criterion addresses color perception specifically. Other forms of perception are covered in Guideline 1.3 including programmatic access to color and other visual presentation coding.
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#use-of-color
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/use-of-color.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#use-of-color
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,61 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.10 Reflow
|
||||
|
||||
- Level: AA
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Content can be presented without loss of information or functionality, and without requiring scrolling in two dimensions for:
|
||||
|
||||
- Vertical scrolling content at a width equivalent to 320 CSS pixels;
|
||||
- Horizontal scrolling content at a height equivalent to 256 CSS pixels.
|
||||
|
||||
Except for parts of the content which require two-dimensional layout for usage or meaning.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Vertical scrolling content at a width equivalent to 320 CSS pixels;
|
||||
- Check: Horizontal scrolling content at a height equivalent to 256 CSS pixels.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- C32: Using media queries and grid CSS to reflow columns
|
||||
- C31: Using CSS Flexbox to reflow content
|
||||
- C33: Allowing for Reflow with Long URLs and Strings of Text
|
||||
- C38: Using CSS width, max-width and flexbox to fit labels and inputs
|
||||
- SCR34: Calculating size and position in a way that scales with text size
|
||||
- G206: Providing options within the content to switch to a layout that does not require the user to scroll horizontally to read a line of text
|
||||
- G224: Accounting for meaningful text indentation and Reflow
|
||||
- G225: Section panels that scroll horizontally are designed to fit within a width of 320 CSS pixels on a vertically scrolling page
|
||||
- Using PDF/UA when creating PDFs (Potential future technique)
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- C34: Using media queries to un-fixing sticky headers / footers
|
||||
- C37: Using CSS max-width and height to fit images
|
||||
- CSS, Reflowing simple data tables (Potential future technique)
|
||||
- CSS, Fitting data cells within the width of the viewport (Potential future technique)
|
||||
- Mechanism to allow mobile view at any time (Potential future technique)
|
||||
- Alternate view supporting Reflow for otherwise excepted content (Potential future technique)
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F102: Failure of Success Criterion 1.4.10 due to content disappearing and not being available when content has reflowed
|
||||
|
||||
## Notes
|
||||
|
||||
- Note 1: 320 CSS pixels is equivalent to a starting viewport width of 1280 CSS pixels wide at 400% zoom. For web content which is designed to scroll horizontally (e.g., with vertical text), 256 CSS pixels is equivalent to a starting viewport height of 1024 CSS pixels at 400% zoom.
|
||||
- Note 2: Examples of content which requires two-dimensional layout are images required for understanding (such as maps and diagrams), video, games, presentations, data tables (not individual cells), and interfaces where it is necessary to keep toolbars in view while manipulating content. It is acceptable to provide two-dimensional scrolling for such parts of the content.
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#reflow
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/reflow.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#reflow
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,40 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.11 Non-text Contrast
|
||||
|
||||
- Level: AA
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
The visual presentation of the following have a contrast ratio of at least 3:1 against adjacent color(s):
|
||||
|
||||
- **User Interface Components:** Visual information required to identify user interface components and states, except for inactive components or where the appearance of the component is determined by the user agent and not modified by the author;
|
||||
- **Graphical Objects:** Parts of graphics required to understand the content, except when a particular presentation of graphics is essential to the information being conveyed.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Visual information required to identify user interface components and states, except for inactive components or where the appearance of the component is determined by the user agent and not modified by the author;
|
||||
- Check: Parts of graphics required to understand the content, except when a particular presentation of graphics is essential to the information being conveyed.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G195: Using an author-supplied, visible focus indicator
|
||||
- G174: Providing a control with a sufficient contrast ratio that allows users to switch to a presentation that uses sufficient contrast
|
||||
- G207: Ensuring that a contrast ratio of 3:1 is provided for icons
|
||||
- G209: Provide sufficient contrast at the boundaries between adjoining colors
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F78: Failure of Success Criterion 1.4.11, 2.4.7 and 2.4.13 due to styling element outlines and borders in a way that removes or renders non-visible the visual focus indicator
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#non-text-contrast
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/non-text-contrast.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#non-text-contrast
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,55 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.12 Text Spacing
|
||||
|
||||
- Level: AA
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
In content implemented using markup languages that support the following text style properties, no loss of content or functionality occurs by setting all of the following and by changing no other style property:
|
||||
|
||||
- Line height (line spacing) to at least 1.5 times the font size;
|
||||
- Spacing following paragraphs to at least 2 times the font size;
|
||||
- Letter spacing (tracking) to at least 0.12 times the font size;
|
||||
- Word spacing to at least 0.16 times the font size.
|
||||
|
||||
Exception: Human languages and scripts that do not make use of one or more of these text style properties in written text can conform using only the properties that exist for that combination of language and script.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Line height (line spacing) to at least 1.5 times the font size;
|
||||
- Check: Spacing following paragraphs to at least 2 times the font size;
|
||||
- Check: Letter spacing (tracking) to at least 0.12 times the font size;
|
||||
- Check: Word spacing to at least 0.16 times the font size.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- C36: Allowing for text spacing override
|
||||
- C35: Allowing for text spacing without wrapping
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- C8: Using CSS letter-spacing to control spacing within a word
|
||||
- C21: Specifying line spacing in CSS
|
||||
- C28: Specifying the size of text containers using em units
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F104: Failure of Success Criterion 1.4.12 due to clipped or overlapped content when text spacing is adjusted
|
||||
|
||||
## Notes
|
||||
|
||||
- Note 1: Content is not required to use these text spacing values. The requirement is to ensure that when a user overrides the authored text spacing, content or functionality is not lost.
|
||||
- Note 2: Writing systems for some languages use different text spacing settings, such as paragraph start indent. Authors are encouraged to follow locally available guidance for improving readability and legibility of text in their writing system.
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#text-spacing
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/text-spacing.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#text-spacing
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,51 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.13 Content on Hover or Focus
|
||||
|
||||
- Level: AA
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Where receiving and then removing pointer hover or keyboard focus triggers additional content to become visible and then hidden, the following are true:
|
||||
|
||||
- **Dismissible:** A mechanism is available to dismiss the additional content without moving pointer hover or keyboard focus, unless the additional content communicates an input error or does not obscure or replace other content;
|
||||
- **Hoverable:** If pointer hover can trigger the additional content, then the pointer can be moved over the additional content without the additional content disappearing;
|
||||
- **Persistent:** The additional content remains visible until the hover or focus trigger is removed, the user dismisses it, or its information is no longer valid.
|
||||
|
||||
Exception: The visual presentation of the additional content is controlled by the user agent and is not modified by the author.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: A mechanism is available to dismiss the additional content without moving pointer hover or keyboard focus, unless the additional content communicates an input error or does not obscure or replace other content;
|
||||
- Check: If pointer hover can trigger the additional content, then the pointer can be moved over the additional content without the additional content disappearing;
|
||||
- Check: The additional content remains visible until the hover or focus trigger is removed, the user dismisses it, or its information is no longer valid.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- SCR39: Making content on focus or hover hoverable, dismissible, and persistent
|
||||
- ARIA: Using role="tooltip" (Potential future technique)
|
||||
- CSS: Using hover and focus pseudo classes (Potential future technique)
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F95: Failure of Success Criterion 1.4.13 due to content shown on hover not being hoverable
|
||||
- Failure to make content dismissible without moving pointer hover or keyboard focus (Potential future technique)
|
||||
- Failure to meet by content on hover or focus not remaining visible until dismissed or invalid (Potential future technique)
|
||||
|
||||
## Notes
|
||||
|
||||
- Note 1: Examples of additional content controlled by the user agent include browser tooltips created through use of the HTML title attribute [HTML].
|
||||
- Note 2: Custom tooltips, sub-menus, and other nonmodal popups that display on hover and focus are examples of additional content covered by this criterion.
|
||||
- Note 3: This criterion applies to content that appears in addition to the triggering component itself. Since hidden components that are made visible on keyboard focus (such as links used to skip to another part of a page) do not present additional content they are not covered by this criterion.
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#content-on-hover-or-focus
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/content-on-hover-or-focus.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#content-on-hover-or-focus
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,40 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.2 Audio Control
|
||||
|
||||
- Level: A
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
If any audio on a web page plays automatically for more than 3 seconds, either a mechanism is available to pause or stop the audio, or a mechanism is available to control audio volume independently from the overall system volume level.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: If any audio on a web page plays automatically for more than 3 seconds, either a mechanism is available to pause or stop the audio, or a mechanism is available to control audio volume independently from the overall system volume level.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G60: Playing a sound that turns off automatically within three seconds
|
||||
- G170: Providing a control near the beginning of the web page that turns off sounds that play automatically
|
||||
- G171: Playing sounds only on user request
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F23: Failure of 1.4.2 due to playing a sound longer than 3 seconds where there is no mechanism to turn it off
|
||||
- F93: Failure of Success Criterion 1.4.2 for absence of a way to pause or stop an HTML5 media element that autoplays
|
||||
|
||||
## Notes
|
||||
|
||||
- Note: Since any content that does not meet this success criterion can interfere with a user's ability to use the whole page, all content on the web page (whether or not it is used to meet other success criteria) must meet this success criterion. See Conformance Requirement 5: Non-Interference.
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#audio-control
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/audio-control.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#audio-control
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,47 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.3 Contrast (Minimum)
|
||||
|
||||
- Level: AA
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following:
|
||||
|
||||
- **Large Text:** Large-scale text and images of large-scale text have a contrast ratio of at least 3:1;
|
||||
- **Incidental:** Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
|
||||
- **Logotypes:** Text that is part of a logo or brand name has no contrast requirement.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1;
|
||||
- Check: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
|
||||
- Check: Text that is part of a logo or brand name has no contrast requirement.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G18: Ensuring that a contrast ratio of at least 4.5:1 exists between text (and images of text) and background behind the text
|
||||
- G148: Not specifying background color, not specifying text color, and not using technology features that change those defaults
|
||||
- G174: Providing a control with a sufficient contrast ratio that allows users to switch to a presentation that uses sufficient contrast
|
||||
- G145: Ensuring that a contrast ratio of at least 3:1 exists between text (and images of text) and background behind the text
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- G156: Using a technology that has commonly-available user agents that can change the foreground and background of blocks of text
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F24: Failure of Success Criterion 1.4.3, 1.4.6 and 1.4.8 due to specifying foreground colors without specifying background colors or vice versa
|
||||
- F83: Failure of Success Criterion 1.4.3 and 1.4.6 due to using background images that do not provide sufficient contrast with foreground text (or images of text)
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#contrast-minimum
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#contrast-minimum
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,51 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.4 Resize Text
|
||||
|
||||
- Level: AA
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Except for captions and images of text, text can be resized without assistive technology up to 200 percent without loss of content or functionality.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Except for captions and images of text, text can be resized without assistive technology up to 200 percent without loss of content or functionality.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G142: Using a technology that has commonly-available user agents that support zoom
|
||||
- Ensuring that text containers resize when the text resizes
|
||||
- using measurements that are relative to other measurements in the content
|
||||
- C28: Specifying the size of text containers using em units
|
||||
- C12: Using percent for font sizes
|
||||
- C13: Using named font sizes
|
||||
- C14: Using em units for font sizes
|
||||
- SCR34: Calculating size and position in a way that scales with text size
|
||||
- G146: Using liquid layout
|
||||
- G178: Providing controls on the web page that allow users to incrementally change the size of all text on the page up to 200 percent
|
||||
- G179: Ensuring that there is no loss of content or functionality when the text resizes and text containers do not change their width
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- C17: Scaling form elements which contain text
|
||||
- C20: Using relative measurements to set column widths so that lines can average 80 characters or less when the browser is resized
|
||||
- C22: Using CSS to control visual presentation of text
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F69: Failure of Success Criterion 1.4.4 when resizing visually rendered text up to 200 percent causes the text, image or controls to be clipped, truncated or obscured
|
||||
- F80: Failure of Success Criterion 1.4.4 when text-based form controls do not resize when visually rendered text is resized up to 200%
|
||||
- F94: Failure of Success Criterion 1.4.4 due to incorrect use of viewport units to resize text
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#resize-text
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/resize-text.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#resize-text
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,47 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.5 Images of Text
|
||||
|
||||
- Level: AA
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
If the technologies being used can achieve the visual presentation, text is used to convey information rather than images of text except for the following:
|
||||
|
||||
- **Customizable:** The image of text can be visually customized to the user's requirements;
|
||||
- **Essential:** A particular presentation of text is essential to the information being conveyed.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: The image of text can be visually customized to the user's requirements;
|
||||
- Check: A particular presentation of text is essential to the information being conveyed.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- C22: Using CSS to control visual presentation of text
|
||||
- C30: Using CSS to replace text with images of text and providing user interface controls to switch
|
||||
- G140: Separating information and structure from presentation to enable different presentations
|
||||
- PDF7: Performing OCR on a scanned PDF document to provide actual text
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- C12: Using percent for font sizes
|
||||
- C13: Using named font sizes
|
||||
- C14: Using em units for font sizes
|
||||
- C8: Using CSS letter-spacing to control spacing within a word
|
||||
- C6: Positioning content based on structural markup
|
||||
|
||||
## Notes
|
||||
|
||||
- Note: Logotypes (text that is part of a logo or brand name) are considered essential.
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#images-of-text
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/images-of-text.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#images-of-text
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,47 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.6 Contrast (Enhanced)
|
||||
|
||||
- Level: AAA
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
The visual presentation of text and images of text has a contrast ratio of at least 7:1, except for the following:
|
||||
|
||||
- **Large Text:** Large-scale text and images of large-scale text have a contrast ratio of at least 4.5:1;
|
||||
- **Incidental:** Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
|
||||
- **Logotypes:** Text that is part of a logo or brand name has no contrast requirement.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Large-scale text and images of large-scale text have a contrast ratio of at least 4.5:1;
|
||||
- Check: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
|
||||
- Check: Text that is part of a logo or brand name has no contrast requirement.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G17: Ensuring that a contrast ratio of at least 7:1 exists between text (and images of text) and background behind the text
|
||||
- G148: Not specifying background color, not specifying text color, and not using technology features that change those defaults
|
||||
- G174: Providing a control with a sufficient contrast ratio that allows users to switch to a presentation that uses sufficient contrast
|
||||
- G18: Ensuring that a contrast ratio of at least 4.5:1 exists between text (and images of text) and background behind the text
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- G156: Using a technology that has commonly-available user agents that can change the foreground and background of blocks of text
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F24: Failure of Success Criterion 1.4.3, 1.4.6 and 1.4.8 due to specifying foreground colors without specifying background colors or vice versa
|
||||
- F83: Failure of Success Criterion 1.4.3 and 1.4.6 due to using background images that do not provide sufficient contrast with foreground text (or images of text)
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#contrast-enhanced
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/contrast-enhanced.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#contrast-enhanced
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,38 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.7 Low or No Background Audio
|
||||
|
||||
- Level: AAA
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
For prerecorded audio-only content that (1) contains primarily speech in the foreground, (2) is not an audio CAPTCHA or audio logo, and (3) is not vocalization intended to be primarily musical expression such as singing or rapping, at least one of the following is true:
|
||||
|
||||
- **No Background:** The audio does not contain background sounds.
|
||||
- **Turn Off:** The background sounds can be turned off.
|
||||
- **20 dB:** The background sounds are at least 20 decibels lower than the foreground speech content, with the exception of occasional sounds that last for only one or two seconds.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: The audio does not contain background sounds.
|
||||
- Check: The background sounds can be turned off.
|
||||
- Check: The background sounds are at least 20 decibels lower than the foreground speech content, with the exception of occasional sounds that last for only one or two seconds.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- G56: Mixing audio files so that non-speech sounds are at least 20 decibels lower than the speech audio content
|
||||
|
||||
## Notes
|
||||
|
||||
- Note: Per the definition of "decibel," background sound that meets this requirement will be approximately four times quieter than the foreground speech content.
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#low-or-no-background-audio
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/low-or-no-background-audio.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#low-or-no-background-audio
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,68 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.8 Visual Presentation
|
||||
|
||||
- Level: AAA
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
For the visual presentation of blocks of text, a mechanism is available to achieve the following:
|
||||
|
||||
- Foreground and background colors can be selected by the user.
|
||||
- Width is no more than 80 characters or glyphs (40 if CJK).
|
||||
- Text is not justified (aligned to both the left and the right margins).
|
||||
- Line spacing (leading) is at least space-and-a-half within paragraphs, and paragraph spacing is at least 1.5 times larger than the line spacing.
|
||||
- Text can be resized without assistive technology up to 200 percent in a way that does not require the user to scroll horizontally to read a line of text on a full-screen window.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Foreground and background colors can be selected by the user.
|
||||
- Check: Width is no more than 80 characters or glyphs (40 if CJK).
|
||||
- Check: Text is not justified (aligned to both the left and the right margins).
|
||||
- Check: Line spacing (leading) is at least space-and-a-half within paragraphs, and paragraph spacing is at least 1.5 times larger than the line spacing.
|
||||
- Check: Text can be resized without assistive technology up to 200 percent in a way that does not require the user to scroll horizontally to read a line of text on a full-screen window.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
- Confirm none of the common failures apply.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- C23: Specifying text and background colors of secondary content such as banners, features and navigation in CSS while not specifying text and background colors of the main content
|
||||
- C25: Specifying borders and layout in CSS to delineate areas of a web page while not specifying text and text-background colors
|
||||
- G156: Using a technology that has commonly-available user agents that can change the foreground and background of blocks of text
|
||||
- G148: Not specifying background color, not specifying text color, and not using technology features that change those defaults
|
||||
- G175: Providing a multi color selection tool on the page for foreground and background colors
|
||||
- G204: Not interfering with the user agent's reflow of text as the viewing window is narrowed
|
||||
- C20: Using relative measurements to set column widths so that lines can average 80 characters or less when the browser is resized
|
||||
- C19: Specifying alignment either to the left or right in CSS
|
||||
- G172: Providing a mechanism to remove full justification of text
|
||||
- G169: Aligning text on only one side
|
||||
- G188: Providing a button on the page to increase line spaces and paragraph spaces
|
||||
- C21: Specifying line spacing in CSS
|
||||
- G146: Using liquid layout
|
||||
- using measurements that are relative to other measurements in the content
|
||||
- C12: Using percent for font sizes
|
||||
- C13: Using named font sizes
|
||||
- C14: Using em units for font sizes
|
||||
- C24: Using percentage values in CSS for container sizes
|
||||
- SCR34: Calculating size and position in a way that scales with text size
|
||||
- G206: Providing options within the content to switch to a layout that does not require the user to scroll horizontally to read a line of text
|
||||
|
||||
## Common failures (W3C)
|
||||
|
||||
- F24: Failure of Success Criterion 1.4.3, 1.4.6 and 1.4.8 due to specifying foreground colors without specifying background colors or vice versa
|
||||
- F88: Failure of Success Criterion 1.4.8 due to using text that is justified (aligned to both the left and the right margins)
|
||||
|
||||
## Notes
|
||||
|
||||
- Note 1: Content is not required to use these values. The requirement is that a mechanism is available for users to change these presentation aspects. The mechanism can be provided by the browser or other user agent. Content is not required to provide the mechanism.
|
||||
- Note 2: Writing systems for some languages use different presentation aspects to improve readability and legibility. If a presentation aspect in this success criterion is not used in a writing system, content in that writing system does not need to use that presentation setting and can conform without it. Authors are encouraged to follow guidance for improving readability and legibility of text in their writing system.
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#visual-presentation
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/visual-presentation.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#visual-presentation
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,43 @@
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
|
||||
# 1.4.9 Images of Text (No Exception)
|
||||
|
||||
- Level: AAA
|
||||
- Guideline: 1.4 Distinguishable
|
||||
- Principle: 1 Perceivable
|
||||
|
||||
## What it is
|
||||
|
||||
Images of text are only used for pure decoration or where a particular presentation of text is essential to the information being conveyed.
|
||||
|
||||
## How to test
|
||||
|
||||
- Check: Images of text are only used for pure decoration or where a particular presentation of text is essential to the information being conveyed.
|
||||
- Use the sufficient techniques below as acceptable methods when applicable.
|
||||
|
||||
## Sufficient techniques (W3C)
|
||||
|
||||
- C22: Using CSS to control visual presentation of text
|
||||
- C30: Using CSS to replace text with images of text and providing user interface controls to switch
|
||||
- G140: Separating information and structure from presentation to enable different presentations
|
||||
- PDF7: Performing OCR on a scanned PDF document to provide actual text
|
||||
|
||||
## Advisory techniques (W3C)
|
||||
|
||||
- C12: Using percent for font sizes
|
||||
- C13: Using named font sizes
|
||||
- C14: Using em units for font sizes
|
||||
- C8: Using CSS letter-spacing to control spacing within a word
|
||||
- C6: Positioning content based on structural markup
|
||||
|
||||
## Notes
|
||||
|
||||
- Note: Logotypes (text that is part of a logo or brand name) are considered essential.
|
||||
|
||||
## Resources
|
||||
|
||||
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#images-of-text-no-exception
|
||||
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/images-of-text-no-exception.html
|
||||
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#images-of-text-no-exception
|
||||
|
||||
[Back to 1 Perceivable index](index.md)
|
||||
@@ -0,0 +1,54 @@
|
||||
# 1 Perceivable
|
||||
|
||||
Information and user interface components must be presentable to users in ways they can perceive.
|
||||
|
||||
## Guidelines
|
||||
|
||||
### 1.1 Text Alternatives
|
||||
|
||||
Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language.
|
||||
|
||||
- [1.1.1 Non-text Content](1.1.1-non-text-content.md) — All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for the situations listed below. (Level A)
|
||||
|
||||
### 1.2 Time-based Media
|
||||
|
||||
Provide alternatives for time-based media.
|
||||
|
||||
- [1.2.1 Audio-only and Video-only (Prerecorded)](1.2.1-audio-only-and-video-only-prerecorded.md) — For prerecorded audio-only and prerecorded video-only media, the following are true, except when the audio or video is a media alternative for text and is clearly labeled as such: (Level A)
|
||||
- [1.2.2 Captions (Prerecorded)](1.2.2-captions-prerecorded.md) — Captions are provided for all prerecorded audio content in synchronized media, except when the media is a media alternative for text and is clearly labeled as such. (Level A)
|
||||
- [1.2.3 Audio Description or Media Alternative (Prerecorded)](1.2.3-audio-description-or-media-alternative-prerecorded.md) — An alternative for time-based media or audio description of the prerecorded video content is provided for synchronized media, except when the media is a media alternative for text and is clearly labeled as such. (Level A)
|
||||
- [1.2.4 Captions (Live)](1.2.4-captions-live.md) — Captions are provided for all live audio content in synchronized media. (Level AA)
|
||||
- [1.2.5 Audio Description (Prerecorded)](1.2.5-audio-description-prerecorded.md) — Audio description is provided for all prerecorded video content in synchronized media. (Level AA)
|
||||
- [1.2.6 Sign Language (Prerecorded)](1.2.6-sign-language-prerecorded.md) — Sign language interpretation is provided for all prerecorded audio content in synchronized media. (Level AAA)
|
||||
- [1.2.7 Extended Audio Description (Prerecorded)](1.2.7-extended-audio-description-prerecorded.md) — Where pauses in foreground audio are insufficient to allow audio descriptions to convey the sense of the video, extended audio description is provided for all prerecorded video content in synchronized media. (Level AAA)
|
||||
- [1.2.8 Media Alternative (Prerecorded)](1.2.8-media-alternative-prerecorded.md) — An alternative for time-based media is provided for all prerecorded synchronized media and for all prerecorded video-only media. (Level AAA)
|
||||
- [1.2.9 Audio-only (Live)](1.2.9-audio-only-live.md) — An alternative for time-based media that presents equivalent information for live audio-only content is provided. (Level AAA)
|
||||
|
||||
### 1.3 Adaptable
|
||||
|
||||
Create content that can be presented in different ways (for example simpler layout) without losing information or structure.
|
||||
|
||||
- [1.3.1 Info and Relationships](1.3.1-info-and-relationships.md) — Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text. (Level A)
|
||||
- [1.3.2 Meaningful Sequence](1.3.2-meaningful-sequence.md) — When the sequence in which content is presented affects its meaning, a correct reading sequence can be programmatically determined. (Level A)
|
||||
- [1.3.3 Sensory Characteristics](1.3.3-sensory-characteristics.md) — Instructions provided for understanding and operating content do not rely solely on sensory characteristics of components such as shape, color, size, visual location, orientation, or sound. (Level A)
|
||||
- [1.3.4 Orientation](1.3.4-orientation.md) — Content does not restrict its view and operation to a single display orientation, such as portrait or landscape, unless a specific display orientation is essential. (Level AA)
|
||||
- [1.3.5 Identify Input Purpose](1.3.5-identify-input-purpose.md) — The purpose of each input field collecting information about the user can be programmatically determined when: (Level AA)
|
||||
- [1.3.6 Identify Purpose](1.3.6-identify-purpose.md) — In content implemented using markup languages, the purpose of user interface components, icons, and regions can be programmatically determined. (Level AAA)
|
||||
|
||||
### 1.4 Distinguishable
|
||||
|
||||
Make it easier for users to see and hear content including separating foreground from background.
|
||||
|
||||
- [1.4.1 Use of Color](1.4.1-use-of-color.md) — Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element. (Level A)
|
||||
- [1.4.2 Audio Control](1.4.2-audio-control.md) — If any audio on a web page plays automatically for more than 3 seconds, either a mechanism is available to pause or stop the audio, or a mechanism is available to control audio volume independently from the overall system volume level. (Level A)
|
||||
- [1.4.3 Contrast (Minimum)](1.4.3-contrast-minimum.md) — The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following: (Level AA)
|
||||
- [1.4.4 Resize Text](1.4.4-resize-text.md) — Except for captions and images of text, text can be resized without assistive technology up to 200 percent without loss of content or functionality. (Level AA)
|
||||
- [1.4.5 Images of Text](1.4.5-images-of-text.md) — If the technologies being used can achieve the visual presentation, text is used to convey information rather than images of text except for the following: (Level AA)
|
||||
- [1.4.6 Contrast (Enhanced)](1.4.6-contrast-enhanced.md) — The visual presentation of text and images of text has a contrast ratio of at least 7:1, except for the following: (Level AAA)
|
||||
- [1.4.7 Low or No Background Audio](1.4.7-low-or-no-background-audio.md) — For prerecorded audio-only content that (1) contains primarily speech in the foreground, (2) is not an audio CAPTCHA or audio logo, and (3) is not vocalization intended to be primarily musical expression such as singing or rapping, at least one of the following is true: (Level AAA)
|
||||
- [1.4.8 Visual Presentation](1.4.8-visual-presentation.md) — For the visual presentation of blocks of text, a mechanism is available to achieve the following: (Level AAA)
|
||||
- [1.4.9 Images of Text (No Exception)](1.4.9-images-of-text-no-exception.md) — Images of text are only used for pure decoration or where a particular presentation of text is essential to the information being conveyed. (Level AAA)
|
||||
- [1.4.10 Reflow](1.4.10-reflow.md) — Content can be presented without loss of information or functionality, and without requiring scrolling in two dimensions for: (Level AA)
|
||||
- [1.4.11 Non-text Contrast](1.4.11-non-text-contrast.md) — The visual presentation of the following have a contrast ratio of at least 3:1 against adjacent color(s): (Level AA)
|
||||
- [1.4.12 Text Spacing](1.4.12-text-spacing.md) — In content implemented using markup languages that support the following text style properties, no loss of content or functionality occurs by setting all of the following and by changing no other style property: (Level AA)
|
||||
- [1.4.13 Content on Hover or Focus](1.4.13-content-on-hover-or-focus.md) — Where receiving and then removing pointer hover or keyboard focus triggers additional content to become visible and then hidden, the following are true: (Level AA)
|
||||
Reference in New Issue
Block a user