WCAG/1-perceivable/1.1.1-non-text-content.md

Back to 1 Perceivable index

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