Alternative Text

Summary

Alternative text, or “alt text” describes the content of images, graphs and charts. It should be added to every image that conveys meaning in instructional and communications materials including Moodle sites, word processing documents, and slide presentations.


Impact

Impact

There are two groups of people you need to consider when using or creating images in digital content: those who can see them and 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. 

If you don't include alternative text with an image, a visually impaired person or user who disables image loading or encounters a broken image won't know what the image is meant to convey.

Example

Google Chrome broken image icon
A sighted person may see an icon like this if a link to an image is broken and no alt text is provided
Dos and Don'ts

Dos and Don'ts

Expand all

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.

Do

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.

Don't

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.

If the information about the graphic is located elsewhere in the document, such as part of the body text or in an image caption, you don’t need to write full alt text.

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.

Include an Empty Alt Attribute for Decorative or Contextualized Images

You do not need to include alt text for images and graphics that are purely decorative, such as a graphic of a line break, or when the same information you would put in the alt text is provided in the surrounding content.

However, you should include an empty alt attribute so screen reader users know that there is an image that is purely decorative. The difference between an empty alt attribute and no alt attribute at all is that the empty attribute lets screen reader users know that an image is there.

Some technologies for displaying content may have features that enable you to include null text by checking a box to indicate that an alt description is not necessary. Others may require that you enter a null attribute instead.

Do

Use your software to indicate that an alt text description is not necessary, if this is available.

Include an empty alt attribute if the feature above is not available:

alt=""

Don't

Don't include alt text with images that are purely decorative.

Don't include alt text that provides the same information as text within the context of the image, such as in the caption.

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.

Do

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:

  • title
  • labels
  • values
  • 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

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.

How-to