What is image alt text and when should it be used?

Alternate text, also called alt tags and alt descriptions, describes images to visually impaired users. Without alternative text, the content of an image will not be available to screen reader users. Each image that conveys meaning or is used as link content must include alternate text unless including the alternate text would create redundancy (e.g. when text is also included in an image caption or text inside the body of a link). Images used strictly for decoration should not include alt text.

Additional Resources:

Similar Posts

  • What are Skip Links?

    The main content is not usually the first thing on a webpage. This makes it difficult for screen reader users to locate the actual content. Skip links are used on websites to address this problem. These special links are placed at the top of each page to bypass navigation blocks and other decorative content. A…

  • a11y stands for ACCESSIBILITY

    The A11Y Project is a community-driven effort to make digital accessibility easier. The A11Y Project website provides: Fundamentals and principles behind accessible design A checklist based on the Web Content Accessibility Guidelines (WCAG) A community of designers who are interested in improving Web Content Accessibility Many resources, including: tools, books, videos, podcasts, newsletters, even professional help!…

  • How to Build an Inclusive Company Website

    Image via Pexels A website is a crucial element of any successful company. Your website should introduce potential customers to your business and show them what you have to offer. Unfortunately, many websites are not inclusive and don’t necessarily cater to people with disabilities. If you want to draw in a wider audience and make…

  • Did you know? All Headings are not Equal!

    A very common accessibility problem is the lack of properly formatted Heading tags in a webpage (H1, H2, H3, H4, H5 or H6). Sometimes headings are not present or they may be incorrectly nested (ie… H2 before H1, H3 before H2 etc…). Headings communicate the organization of the content on the page and can be…

  • | |

    Correcting Missing or Incorrectly Labeled Landmarks

    Landmarks provide a way to identify the organization and structure of a web page. The structural information conveyed visually to users should be represented programmatically in the markup using landmark roles. The number and type of landmarks that should be used varies but normally each page will have one header, one footer, one main, one…

Cart Accessibility Tools
hide