WCAG Master Guide: Text Alternatives

While you may browse a website and be able to view images with ease, this is not the case for website visitors with low vision or blindness.

Text alternatives are an integral part of the Website Content Accessibility Guidelines (WCAG) and should be a key consideration when remediating your website. 

What are Text Alternatives?

Text alternatives are alternative output formats for non-text content. Alternatives could include:

• Large print
• Braille
• Text-to-speech
• Symbols
• Simpler language

These alternatives ensure that users with low vision or blindness can still understand and engage with media on your site.

WCAG Alternative Text Success Criteria

Here are the success criteria you would need to meet for alternative text in order to achieve Level A or higher.

Non-Text Content

Any non-text content, such as images or videos, that is presented to a user should automatically have a text alternative. The text alternative helps a user understand what’s on screen, ensuring they can fully engage with the content on a page.

For example, an image of a white cat could have the following alternative text, which is embedded in your HTML code:

<img src=”white_cat.Jpeg” width=”145″ height=”126″ alt=”White Persian Cat”>

This alternative text is then relayed back to a user in their preferred format with the help of assistive technology. 

Alternative text requirements go beyond just images, though, and will apply in the following circumstances too:  

• Controls & User Input. If non-text content is a control or accepts user input, then the name should describe its purpose. Some examples include submit buttons, image maps or complex animations. 

• Time-Based Media. Alternative text for time-based media should provide a description of the non-text content. Videos, audio, slides, computer simulations are a few examples. 

• Exercises. Should any non-text content be a test or exercise, alternative text should be used to provide a description. A user having to explain what’s in an image is an example of this. 

• Sensory. For non-text content that’s designed to provide a sensory experience, alternative text should provide a description. Works of visual art or a symphony performance are some examples of sensory experiences. 

• CAPTCHA. In circumstances where a user needs to identify themselves as a person, alternative forms of CAPTCHA should be supplied for different disabilities. 
• Decoration & Formatting. Any non-text content that is used for decorative purposes should have null alternative text tags that indicate it can be ignored by assistive technology. 

Time-Based Media

Time-based media refers to any pre-recorded audio and video content that’s present on your website. For any audio or video content that isn’t a media alternative for text and is appropriately labeled, the following steps should be taken to achieve a specific WCAG level: 

Level A

• Pre-Recorded Audio. Equivalent information needs to be provided for any pre-recorded audio-only content. This includes pre-recorded audio in synchronized media. Captions are an example of this. 
• Pre-Recorded Video. Alternative time-based media or an audio track is required for any pre-recorded video-only content. Captions can also be used here. 

Level AA

• Pre-Recorded Audio. In order to achieve WCAG Level AA, which is the ideal level, captions need to be provided for all live and pre-recorded audio in synchronized media.
• Pre-Recorded Video. For any pre-recorded videos, an audio description or captions can be provided for all content in synchronized media.

Level AAA

• Pre-Recorded Audio. In order to achieve WCAG Level AAA, which can be more difficult, it’s recommended that sign language interpretation is provided for all pre-recorded audio. If foreground audio pauses are sufficient to allow for audio descriptions, these can also be used as an alternative.
• Pre-Recorded Video. Alternative time-based media should be used for any pre-recorded synchronized media and pre-recorded videos. 
• Live Audio. An alternative for time-based media that includes equivalent information for live audio-only content should be added. 

Alternative Text Best Practices

Alternative text will always be required to meet the minimum WCAG requirements. However, to achieve Level AA, which is what most businesses should be aiming for, here are some best practices you can apply. 

Write for the user first. Alternative text is designed to help disabled users better understand what’s on your site. While your alternative text can contain keywords where possible, you should rather be describing an image to benefit the user. 

Make it specific. There is no need to make alternative text overly descriptive unless it makes sense to do so. Always aim to make it specific and only add in extra details if you really need to – 125 characters or less is ideal. 

Check for spelling errors. Alternative text that contains spelling errors can create a confusing experience for your users when it’s read back to them. 

Use null alt tags. For any images that are used for formatting or decorative purposes, make sure that you include a null alt tag. This indicates to assistive technology that it can be ignored.

The tag will look like this: <img src=”black_line.png” alt=””>

Clear, simple language is key. When creating captions for video content, keep your language clear and simple. It’s also important to keep any international viewers in mind. Would they still be able to understand your captions based on the language you’re using?

Not all sounds need captions. Captions should only be paired with the most important audio in your videos. Basic background noises that wouldn’t provide any context don’t need to be captioned.

Frequently Asked Questions