Understanding WCAG SC 1.1.1: Non-text Content

Web Content Accessibility Guidelines (WCAG) provide a framework to make web content more accessible to everyone, including people with disabilities. One of the foundational guidelines is WCAG Success Criterion 1.1.1: Non-text Content (Level A). This guideline focuses on ensuring that all non-text content (images, audio, video, and similar elements) has an equivalent text alternative that conveys the same information or serves the same purpose.

Text alternatives are crucial because they make content accessible through various sensory modalities. A user who cannot see images can use screen readers to hear a description. Someone who cannot hear an audio file can read its transcript. Providing text alternatives isn't just a requirement; it's a practical way to make the web more inclusive and usable for everyone.

Success Criterion

Success Criterion 1.1.1 outlines how to handle various forms of non-text content. Here are the specific scenarios:

Controls and Inputs: If non-text content acts as a control (e.g., buttons, interactive elements) or takes user input, it should have a name that explains its function. This is important so that assistive technology can help users understand what the control does. A visually impaired user, for example, should know that an image of a shopping cart is a "checkout button."
Time-Based Media: Content like videos or audio files must include text alternatives that at least identify and describe what they are. This might not fully replace the media, but it helps users know what they are dealing with. Detailed descriptions are covered in WCAG guidelines under time-based media.
Tests and Exercises: If the content is a test or exercise that can’t be translated into text without losing meaning (like a visual puzzle or hearing test), a text alternative should identify what it is. This ensures that users know the content’s purpose, even if they can’t fully interact with it.
Sensory Experiences: Content that aims to create a specific sensory experience (like an artwork or a musical piece) should have a descriptive text alternative. The description should explain the content's purpose or context, even if it can't fully replicate the experience.
CAPTCHA: CAPTCHAs (tools to distinguish humans from bots) must include a description of their purpose. Since they can be difficult for people with certain disabilities, it's also recommended to offer alternative CAPTCHA formats, such as audio or simpler visual options.
Decoration, Formatting, Invisible: Non-text content that serves purely decorative purposes or is not meant for users (like invisible tracking images or formatting elements) should be marked so that assistive technology ignores them. This prevents unnecessary distractions for users relying on screen readers.

Intent of SC 1.1.1

The main goal is to make information presented visually or audibly accessible via other methods. This is usually done through text, which is flexible and can be converted into different formats (like speech or braille) based on user needs. A well-chosen text alternative can make an image accessible to someone who can't see it or an audio track accessible to someone who can't hear it.

By following these guidelines, websites can become more inclusive, allowing all users to access and interact with the content effectively, regardless of the sensory modality they rely on.

Examples of SC 1.1.1 in Action

Here are a few practical scenarios illustrating how to apply this guideline:

Data Chart: A bar chart comparing sales across three months should have a short label like "Figure 1 - Sales for June, July, and August" and a longer description detailing trends or implications. This allows users to understand the data even if they can’t see the chart.
Audio Recording of a Speech: A link to an audio file of a chairman’s speech should have a clear description, such as "Chairman's speech to the assembly." A text transcript should follow, providing all the spoken content and identifying who is speaking.
Informational Images: A photograph of a historic handshake at a summit should have a text alternative like "President X shakes hands with Prime Minister Y during an international summit." This text helps users understand the image’s significance in context.
Interactive Image Maps: An interactive image of a building's floor plan should have a description like "Building floor plan. Select a room for more information." This way, users know that they can click different areas for specific details.
E-learning with Sound Cues: An e-learning platform using sounds to indicate correct or incorrect answers should include text labels like "Chime sound means correct answer" so that users who can't hear can still understand the feedback.

Why SC 1.1.1 Matters

Providing text alternatives for non-text content benefits a wide range of users:

People who are visually impaired can hear descriptions of images.
People who are deaf or hard of hearing can read transcripts of audio content.
People who are deaf-blind can read the content in braille.
Individuals who have cognitive disabilities may find text descriptions more accessible than visual or audio elements.

Moreover, text alternatives make non-text content searchable and allow it to be used in various contexts, supporting flexibility in how information is consumed.

Conclusion

WCAG SC 1.1.1 is about making non-text content accessible to all users by providing text alternatives that convey the same information. This practice helps create a web that is inclusive and usable for everyone, regardless of how they interact with content. By understanding and applying this criterion, web developers can ensure that their content reaches the widest possible audience, fostering a more accessible digital environment for all.