Non-Text content

[ecureuill]

1.1.1 All non-text content that is presented to the user has a text alternative that serves the equivalent purpose

Scenario: Controls and Inputs

Such as images used as submit buttons, image maps or complex animations, a name is provided to describe the purpose of the non-text content so that the person at least knows what the non-text content is and why it is there

• 16

Scenario: Time-Based Media (video, video-only, audio)

• [ ] A text alternative that describes the time-based media and/or gives its title, besides this requirements
• [ ] In case it's a live video or live audio, text alternatives provide a descriptive label.

Test Procedure

1. Check that short text alternative provides a descriptive name.
2. Check that short text alternative provides a name that has be previously been given to the non-text content by the author or another.

Expected Results: 1 and 2 are true.

Scenario: Test

Sometimes a test or exercise must be partially or completely presented in non-text format. Audio or visual information is provided that cannot be changed to text because the test or exercise must be conducted using that sense. For example, a hearing test would be invalid if a text alternative were provided. A visual skill development exercise would similarly make no sense in text form. And a spelling test with text alternatives would not be very effective.

• [ ] For these cases, text alternatives should be provided to describe the purpose of the non-text content; of course, the text alternatives would not provide the same information needed to pass the test.

Tests Procedure

1. Remove, hide, or mask the non-text content.
2. Display the short text alternative(s).
3. Check that the purpose of the non-text content is clear, even if content is lost. Expected Results: 3 is true.

Scenario: Sensory

If non-text content is primarily intended to create a specific sensory experience.

• [ ] text alternatives at least provide descriptive identification of the non-text content.

Test Procedure

1. Remove, hide, or mask the non-text content.
2. Display the short text alternative(s).
3. Check that the purpose of the non-text content is clear, even if content is lost.

Expected Results: 3 is true.

Scenario: CAPTCHA

• [ ] A text alternative text alternatives that identify and describe the purpose of the CAPTCHA; AND
• [ ] Alternative forms of CAPTCHA using output modes for different types of sensory perception are provided to accommodate different disabilities.

Test Procedure

1. Remove, hide, or mask the CAPTCHA.
2. Display the short text alternative.
3. Check that the text alternative describes the purpose of the CAPTCHA.

Expected Results: 3 is true.

1. For each CAPTCHA in a Web page, check that the Web page contains another CAPTCHA for the same purpose but using a different modality.

Expected Results: 1 is true.

Scenario: Decoration, Formatting, Invisible

If non-text content is pure decoration, is used only for visual formatting, or is not presented to users.

• [ ] Decorative images: #160
• [ ] Others: Implementing or marking the non-text content so that it will be ignored by assistive technology

Scenario: Images

• 160

Scenario: All other situations

• [ ] Provide a short description that can serve the same purpose and present the same information as the non-text content.
• Using aria-label to provide labels for objects
• Using aria-labelledby to provide a text alternative for non-text content
• Using a text alternative on one item within a group of images that describes all items in the group

If short description is not enough (e.g. chart, diagram), combine with a long description

• [ ] Short description: brief description of the non-text content
• [ ] Long description: that serves the same purpose of the non-text content.

Test Procedure

1. Remove, hide, or mask the non-text content
2. Replace it with the text alternative
3. Check that nothing is lost (the purpose of the non-text content is met by the text alternative)
   1. Check that the short text alternative
   2. Otherwise, check that
      1. Check for the presence of a short text alternative that provides a brief description of the non-text content.
      2. Check that the long description conveys the same information conveyed by the non-text content.
4. If the non-text content contains words that are important to understanding the content, the words are included in the text alternative

Expected Results: Check 3 is true. If the non-text content contains words that are important to understanding the content, check 4 is also true

Failures

Tests Procedure

1. Examine all images added to the content via CSS, HTML style attributes, or dynamically in script as background images.
2. Check that the images do not convey important information.
3. If an image does convey important information, the information is provided to assistive technologies and is also available when the CSS image is not displayed.

Expected Results: If step 2 and step 3 are both false, then this failure condition applies and the content fails this Success Criterion.

Tests Procedure

For all images in the content that convey information by way of color differences:

1. Check that the information conveyed by color differences is not included in the text alternative for the image.

Expected Results: If step 1 is true, then this failure condition applies and content fails the Success Criterion.

Tests Procedure

1. Check each text alternative to see if it is describing content other than the currently-displayed non-text content.

Expected Results: If step 1 is true, then this failure condition applies and content fails the Success Criterion.

Tests Procedure

1. Check each text alternative to see if it is not actually a text alternative for the non-text content.

Expected Results: If step 1 is true, then this failure condition applies and content fails the Success Criterion.

Tests Procedure

For any img element that is used for purely decorative content:

1. Check whether the element has no role attribute or has a role attribute value that is not presentation.
2. Check whether the element has no alt attribute or has an alt attribute with a value that is not null.

Expected Results: If step 1 is true and if step 2 is true, this failure condition applies and content fails the Success Criterion.

Tests Procedure

1. Identify any img elements that are used for decoration, spacing or other purpose that is not part of the meaningful content in the page
2. Check that the alt attribute for these elements is null.

Expected Results: If step 2 is false, this failure condition applies and the content fails the Success Criterion.

Tests Procedure

Identify img, area and input elements of type image. For each of these elements:

1. Check if the alt attribute is present.
2. Check if aria-labelledby attribute is present AND references one or more id elements in the page AND check if aria-labelledby is accessibility supported.
3. Check if the aria-label attribute is present AND check if aria-label is accessibility supported.
4. Check if the title attribute is present AND check if title is accessibility supported.

Expected Results: If all are false then this failure condition applies.

Tests Procedure

The following word looks, in browsers with appropriate font support, like the English word "cook", yet is composed of the string ϲоοk, only one of which is a letter from the Western alphabet. This word will not be processed meaningfully, and a text alternative is not provided.

1. Check the characters or character entities used to represent text.
2. If the characters used do not match the appropriate characters for the displayed glyphs in the human language of the content, then look-alike glyphs are being used.

Expected Results: If look-alike glyphs are used, and there is not a text alternative for any range of text that uses look-alike glyphs, then the content does not meet the Success Criterion.

Tests Procedure

  %   __ __ __ __ __ __ __ __ __ __ __ __ __ __   
100 |             *                             |
 90 |                *  *                       |
 80 |          *           *                    |
 70 |             @           *                 |
 60 |          @                 *              |
 50 |       *        @              *           |
 40 |                   @              *        |
 30 |    *  @              @  @           *     |
 20 |                                           |
 10 |    @                       @  @  @  @     |
      0  5 10 15 20 25 30 35 40 45 50 55 60 65 70
      Flash frequency (Hz)

1. Access a page with ASCII art.
2. For each instance of ASCII art, check that it has a text alternative.

Expected Results: If check 2 is false, then this failure condition applies and the content fails this Success Criterion.

[github-actions[bot]]

This Feature is ready to be implemented.

[ecureuill]

Failure

• [ ] due to Syllabus dialog page
  • The short text alternative for the Logo image is not appropriate or meaningful.