Alt text is crucial for web accessibility, providing descriptions of images for visually impaired users via screen readers. It also aids in SEO by allowing search engines to understand image content, potentially boosting website visibility. Additionally, alt text enhances user experience by providing context for images, especially when they fail to load properly.
Missing Alternative Text, As Defined by WCAG 2.0.
According to the WebAIM Million Report, 2024, 54% of Home Pages failed a Web Content Accessibility Guidelines (WCAG) 2.0 audit due to Missing Alternative Text.
WCAG 2.0 is a standard accessibility framework published by the Web Accessibility Initiative (WAI) of the World Wide Web Consortium (W3C), the main international standards organization for the Internet.
The success criterion can be found here and is outlined as follows:
Level: A
1.1.1 Non-text Content
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
- Time-Based Media
- Test
- Sensory
- CAPTCHA
- Decoration, Formatting, Invisible
Here’s an example of good, descriptive alternative text applied to an image:
And here’s an example of poorly implemented alternative text. Note that it’s generic, and not useful to the user:
Why Does It Matter?
Providing alternative text to describe visual elements aids individuals who struggle with perceiving visual content. Assistive technology can read alternative text aloud, visually present it, or convert it to braille.
Text alternatives assist individuals who may find it challenging to comprehend the meaning of various visual elements such as photographs, drawings, images (like line drawings, graphic designs, paintings, or three-dimensional representations), graphs, charts, animations, and more.
The alt attribute provides sufficient descriptive text so that users can discern the content of an image without having seen it. Businesses or institutions that fail to provide inclusive options create barriers to accessing their products or services and portray an image of apathy for users’ needs, which can result in lost business and negative perceptions.
Also, including alternative text can provide benefits to website SEO. By providing thorough text descriptions of media content, helping search engines to properly rank and promote the site, driving customers and users towards your online presence, and gaining a competitive edge against any who don’t do this.
How Do I Fix It?
Ensure alternative text, or “alt text” is included for all suitable content. An example of what this might look like is below:
<img src="./feature-image" alt="Example map of the 2021 Baltimore Half Marathon" />
When including alternative text, the following questions may help to discern what it should include:
- Why is the non-text content here?
- What information is it presenting?
- What purpose does it fulfill?
- If I could not use the non-text content, what words would I use to convey the same information or function?
Be sure that all text contained in the attribute is useful. Generic words like “chart,” “image,” “diagram,” or image file names tend not to be useful for the user and should not be included.
Why Is This Important?
It’s estimated that 16% of the world’s population – 1 in 6 of us – have a significant disability. In a world where technology continues to play a critical role in our daily lives, our work, our learning, and many of the businesses and services we need, it’s vital to ensure that everyone’s needs are catered for wherever possible. For any individual business, these statistics and the importance of what they represent cannot be overstated.
Thursday, 16th May 2024, marks Global Accessibility Awareness Day, an annual event for institutions and technology companies to draw attention to the vital goal of ensuring digital assets—from websites to photos, video, audio, and social media—are accessible to everyone, including people with disabilities that may impair their sight, hearing, or mobility.
As a specialist in application modernization and development, gravity9 is committed to this inclusivity. Here, we’re looking at some key findings of the annual WebAIM (Web Accessibility in Mind) report, which studies 1,000,000 home pages to assess their accessibility and highlight any shortfalls. We’ll be examining why they matter and what you can do to ensure that you’re not letting your customers or your business down by failing to address these vital areas.
More in This Series
Here’s the full set of articles in this series: Common Accessibility Failures and How to Avoid Them.
- Low Contrast Text
- Missing Alt Text
- Missing Form Labels
- Empty Links
- Empty Buttons
- Missing Document Language