Add alternative text, or “alt text,” to every meaningful image in digital content.
There are two groups of people you need to consider when using or creating images in digital content:
- Those who can see the images.
- Those who can't.
It may seem obvious that you'll need to provide the information in an alternative format for people who can't see your visuals—those who are blind or visually impaired—but sighted users who disable image loading or encounter a broken image also won't know what the image is meant to convey.
A sighted person may see an icon like the one below if a link to an image is broken and no alt text is provided.
Dos and Don'ts
Provide Alternative Text for Meaningful Images
Alternative text, or "alt text," can be read by assistive technologies, which helps more of your audience access your content.
It also can help you, the author, make sure an image communicates your intended purpose.
Answer the question: What is the content conveyed by the image and this particular context?
Write in simple, precise language, and keep the explanation brief. Typically no more than a few words are necessary, though rarely a short sentence or two may be appropriate.
Provide different information in alt text and surrounding content. For example, the difference between alt text and captions is context, as explained by Georgetown University's University Information Services:
- The alt text should appropriately describe the content of the image.
- The caption should explain more about the purpose of the image.
Don't simply describe the surface features of the image or graphic.
Don't include the same alt text everywhere an image is used.
Don't use the name of the file itself (e.g., "graphic.png").
Avoid the use of phrases such as "image of ..." or "graphic of ..."; most users will be aware that an image is present, either by visual observation or adaptive technology.
Longer descriptions (more than about 125 characters) should be included in the body text of your document or as a separate page that you link to, rather than as alt text.
Carefully Evaluate the Use of Empty Alt Attributes
Many sources of accessibility information recommend that you include an empty alt attribute for purely decorative or already contextualized images instead of no alt text at all, so that screen reader users know that an image is there but that an alt description is not necessary.
Some technologies for displaying content have features that enable you to include null alt text by checking a box; other technologies may require that you enter a null attribute (alt="" or alt="""") instead.
We recommend that you rarely if ever include null or empty alt text, because most images have meaning.
If you are using an image that you think is purely decorative because it conveys only an emotional message or sentiment, ask yourself the following questions.
Your answers will often give you exactly the alt text you can use to describe the image to a screen reader user:
- Why are you including this image?
- What is its purpose?
- What are you trying to convey with it?
Mass emails sometimes include transparent or colored images that are used to layout the content because email software doesn't display modern HTML and CSS as well as web browsers. On these types of images, include a null or empty alt attribute (alt="" or alt=""""), so that screen reader users know an image is there, but alt text is not necessary.
Don't exclude an alt attribute with images that convey meaning, because screen reader users won't know an image is there and will not get an equivalent experience of the content.
Don't remove the alt attribute entirely from purely decorative images; include empty alt text instead.
Provide a Description for Charts and Graphs
You should add alternative text for all charts and graphics derived from data tables, such as from spreadsheets.
However, charts and graphs made from data tables in spreadsheets usually require more complex descriptions than the alt attribute can provide. There are several ways to provide longer descriptions so that all users will benefit.
Include descriptive text surrounding the image (such as the data table).
Include a link to a separate page with a longer description.
In spread sheets, use the fields provided in some software such as Microsoft Excel and Google Sheets to give more details about the content, including:
- relationships among variables
- x and y axes
- scale increments
Test your alt text and descriptions by having someone review the content when the images are replaced with the alt text or descriptions.
Don't provide descriptions for charts and graphs in a spreadsheet if simple alt text will suffice.
Don't provide a description for charts and graphs in a spreadsheet if users have access to the source file from which the graphic was created.