Table of Contents

    All non-text content like images, charts, icons and infographics, must have an appropriate text equivalent. This ensures that information conveyed by non-text content is available to people who cannot see it, like screen reader users.

    Accessibility Requirements For 1.1.1 Non-Text Content (A)

    • Images (like logos and icons) that communicate information have short text descriptions;
    • Editorial images that support the text around them have short descriptions;
    • Images (like infographics, charts and diagrams) that communicate complex information also have longer text descriptions within the same page;
    • Decorative images have empty text descriptions.
    • In situation of capcha present in the form of image (non-text content), Alternative text should be provided for assistive technology users that clearly informs about the presence of capcha and alternative and accessible way should be provided to solve capcha.

    Common mistakes for 1.1.1 Non-Text Content (A)

    • The image communicates information but does not have a text description;
    • The text description does not communicate the same information as the image;
    • The image has a text description but, like a placeholder or file name, it does not communicate the information in the image;
    • The image has a text description that is an exact duplication of content elsewhere on the page.
    • Images that contains capcha should have the alternative text such as “capcha” or similar alternative text. Also, other way of solving capcha should be provided for assistive technology users.

    Benefitted disability types of success criteria 1.1.1 (Non-text content)

    Following are the types of specially challenged people who are using their assistive technology, benefitted through this success criteria.

    • Visually challenged person, who is using screen reader as an assistive technology.
    • A defblind person, who is able to read screen reader’s output through a special device called braille display.
    • A cognetive challenged user, who is unable to understand complex images.

    Techniques for 1.1.1 Non-Text Content (A)

    HTML Techniques

    CSS Techniques

    Your site doesn’t include support for the Accordion Item block. You can try installing the block, convert it to a Custom HTML block, or remove it entirely.

    Common Failures for 1.1.1 Non-Text Content (A)

    The following are common mistakes that are considered failures of Success Criterion 1.1.1 by the WCAG Working Group.

    FAQS about Non-text Content

    Why should you add alternative text to your image?

    Adding alternative text to photos is first and foremost a principle of web accessibility. Visually impaired users using screen readers will be read an alt attribute to better understand an on-page image. Alt text will be displayed in place of an image if an image file cannot be loaded.

    How descriptive should alt text be?

    While ALT tags need to be descriptive, they also need to be brief. They should not be full sentences or paragraphs. With a limit of about 125 characters, an ALT tag should provide enough detail for users and search engines to relate the image to the context of the page.

    When should you not use alt text?

    Including alt text for decorative images or itemsDecorative items such as dividers or design items that don’t provide additional context or content don’t need alt text. They don’t add to the information a user needs and they make little sense, or are unnecessary, when read with a screen reader.

    Is information conveyed through sensory characteristics also supported in text?

    Text alternatives are a primary way for making information accessible because they can be rendered through any sensory modality (for example, visual, auditory or tactile) to match the needs of the user. Providing text alternatives allows the information to be rendered in a variety of ways by a variety of user agents.

    Should all images have alt text?

    Each image should have an alt text. Not just for SEO purposes, but also for accessibility. Because people with a visual impairment will otherwise not know what the image is about.

    Related to 1.1.1 Non-text Content (A)

    Useful resources for 1.1.1 Non-Text Content (A)

    Leave a Reply

    Your email address will not be published. Required fields are marked *