When creating web content, it’s important to keep accessibility in mind to ensure that all users, regardless of any disabilities they may have, can easily access and understand your content. One key aspect of web accessibility is the use of alternative text, or image alt text.
Alt text is a description of an image that is read aloud by screen readers for users who are visually impaired. However, not all images require the same type of alt text. In this article, we’ll break down the different types of images and the alt text requirements for each.
Linked Images
Linked images are used as links or buttons and require alt text to describe the destination of the link or function of the button instead of the visual image. Alt text for linked images involves a few additional considerations for accessibility, such as not repeating nearby text and including all text in the image.
Functional Images
Functional images are used to initiate actions rather than to convey information, and the text alternative for the image should convey the action that will be initiated. Missing or empty alt values for functional images create significant problems for screen reader users because these images are essential to the functionality of the content.
Decorative Images
Decorative images should be given empty or null alt text. However, any time an image is the only content within a link, the image MUST be given alternative text that presents the function of that link.
It’s important to note that when an image has no alt attribute or if the alt attribute is empty or null, screen readers essentially ignore those images. The HTML 5 working group is proposing that the alt attribute be made optional for images, but when an image is the only element within a link, it must have alternative text so that the function of the link is provided to all users.
All links must contain either text or an image with alt text to be readable by screen reader users. Screen reader support for reading the title attribute for descriptions of images is inconsistent and should not be relied upon as the sole means to convey important information.
Alt Text Summary
Alt text is a crucial component of web accessibility that ensures all users, regardless of any disabilities, can access and understand your content. When adding alt text to images, it’s important to consider the type of image and its function to provide appropriate alt text. By following these guidelines, you can make your website more accessible to all users.
Read our full guide to writing accessible alt text.
