Describe Images Using Text
Individuals with visual disabilities or other cognitive impairments often cannot perceive information conveyed through images without help from a textual alternative. Image-based content that impedes accessibility includes charts, graphs and other non-textual content.
Textual alternatives accompany images in order to make the content and purpose of images accessible. All alternatives need to be compatible with screen-reading software.
Document creation software such as Microsoft Word or Adobe Acrobat allow for images to have alternative text to describe the image to the user.
Guidelines
Alternative text used should follow these considerations:
- If the image is necessary for understanding the page content, equivalent information should be communicated as text using the alternate text attribute.
- If the image is decorative and not necessary for understanding the page content, the alt attribute should be empty. Empty attributes tell screen-reading software to completely ignore the image. A decorative image could be something like a decorative line break, or a graphic element having to do with brand.
- If an image is used inside of a link or as a button, the alternative text should describe the link's destination or the button's purpose.
Resources
Benefits
These measures allow users with visual disabilities to understand information communicated using images, as well as the destinations or purpose of image links and controls.
These measures also instruct screen reading software to ignore decorative-only images, which makes navigating content faster and easier.
Best Practices
- Keep alternative text concise; no more than 10-15 words.
- Include any words that appear in informative images in the alternative text.
- Verify alternative text for links or controls helps to form the link text and/or control label.
- Treat images as decorative if the proposed alternative text would repeat neighboring text.
- Use an empty alt="" attribute for decorative images to indicate that it should not be announced.
Checking for Correct Usage
- All descriptive images are required to have an alternative text attribute.
- Alternative text for informative images needs to provide the same information as the image.
- Each decorative image should have an alternative text attribute with an empty string (alt="").
- Alternative text for images used in links or buttons must describe the function or destination of the link, even when read out of context.