Accessibility FAST

Alternative Text
Quick Start Guide

Alternative text (alt text) is an equivalent text description of visual information.

Visual elements included only for aesthetic purposes, such as a background or border, are decorative images. As they do not contribute information they must be tagged as decorative so they can be skipped by assistive technology.

Mark decorative images

Images included for purely aesthetic purposes, or that have an adjacent text equivalent or descriptive figure caption, should be marked as decorative.

If unsure, err on the side of adding alt text. It is better to present unneeded information than have someone miss out completely.

Describe informative images

For visuals that contain information there are are three methods to provide alternative text:

Adjacent text that provides details equivalent to the visual information. Use visuals and text to support, reinforce, and reference each other. All users can access important information when presented in plain text.

Figure captions placed below visual elements provides all users with a text equivalent to visual information, are useful to orient users,  and link to additional information.

 

The alt text field can present a concise description of visual content to screen reader software used by blind and visually impaired users. The alt text field is also where images are marked as decorative when appropriate..

Depending on the complexity of the graphic, knowing which type of text alternative to provide is important. Alt text depends on context and purpose. If equivalent information is present in adjacent text or a figure caption, graphics should be marked as decorative.

Marking images as decorative, adding a figure caption, or including alt text will differ depending on platform or software. Refer to later chapters in this guide cover providing text equivalents to visuals in specific platforms.

Alt text = type + focus + details

To write alt text: Include the type of visual, describe the focus, and add essential details. Consider how you would describe the image if talking to a friend on the phone. Use proper punctuation and grammar and limit alt text to 2 or 3 brief sentences.

Alt Text Example

Diagram of satellite image resolutions comparing real object shape to 30 metre, 10 metre, and 1 metre resolution images. The diagram explains that as the resolution of a satellite image increases the image will more accurately represent the true shape of an object.[type] Diagram of [focus] satellite image resolutions comparing real object shape to satellite images taken at 30 metre, 10 metre, and 1 metre resolutions. [details] The diagram illustrates that the shape of an object will be more accurately represented as the resolution of a satellite image increases.

Use AI as a starting point

AI has rapidly improved in describing images, particularly the structure of complex images and extracting text from images. Edit AI generated descriptions for accuracy and clarity. Read more about using AI to generate alt text.

 

Moving forward…

Understand that alternative text is so fundamental to accessibility it is the first Web Content Accessibility Guideline (1.1.1). Writing alt text is somewhat of an art. Remember to try your best, ask for help, and try to be as inclusive as possible.

For more information on Alt Text, move to the next page.

License

Icon for the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License

Accessibility Handbook for Teaching and Learning Copyright © 2023 by Briana Fraser and Luke McKnight is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License, except where otherwise noted.