Images should have meaningful alternative text. The purpose of alt text is to provide an alternative description for an image. Every image needs to have an alternative text description so if somebody with visual disabilities (somebody who is blind) visits your site with the use of a screen reader or translator, then that person can understand the meaning behind the photo that they cannot visually see.
The alternative text serves several functions:
- Screen readers read the alternative text in place of images allowing the content and purpose of the image to be accessible to those with visual disabilities.
- Web browsers display the alternative text of the image if the image file is not loaded or if the user has chosen to not view images.
- Search engines use the alternative text to provide a semantic meaning and description which can be used to determine the content of the image.
How to Add Alt Text
In the Photo section of a content type you may upload images to insert into your webpage. Alternative text is required and you will get an error message if you click Upload without filling in the alternative text field.
Be thoughtful when entering your alternative text when you first upload an image. You may change it later, but you will need to delete the image from the page and reinsert the image in order for the new alternative text to be updated in the page code.
Alternative Text Suggestions
- If the image contains minimal and meaningful text, the alternative text should contain that text.
- If the image is a photograph, the alternative text should describe the photograph. There does not need to be a high level of detail in the description. Ask yourself how you would describe the photo to someone over the phone.
- There is no need to include "image of" or "photo of" in the alternative text.
- There are differences between informative and decorative images and special use cases for each.
Images that Convey Complex Information
Complex images with our without text, such as graphs, charts, or diagrams, may contain too much information to be effectively described using alt text. Instead, these images must be described with text on the page and / or an image caption. The best choice is to create the text as text on the page, used in conjunction with a caption, to describe the concept or data the image references.
Additional Resources
For more in-depth guidance on alternative text, visit the Alternative Text article on WebAIM.