Step 1: Add Alt Text to Images
Video Length
4:20
WHAT IS ALT TEXT?
Alt text, or alternative text, is text used to describe the content and function of an image. When a screen reader program encounters an image, it will read the alt text. The goal of alt text is to provide an equivalent textual representation of an image.
ACCESSIBILITY FOR EVERYONE
Alt text doesn't just help users with screen readers. It can also help individuals with cognitive or learning disabilities, as well as users with poor internet connections or mobile data caps.
In Canvas, alt text is set when you select Upload Image. Look for the box called "Alt Text" under the Attributes section. You can also change alt text on an existing image by selecting the image and selecting "Image Options."
WHICH IMAGES NEED ALT TEXT?
Not all images need alt text. In fact, if you put alt text on all images, you are likely to frustrate users with screen readers.
Any image that is essential to the content or function of the page requires alt text. Any image that is ;not essential to the content or function of the page should instead have the box "Decorative Image" checked.
While some images are obviously decorative, it can be difficult to determine for many images. A question you can ask yourself is: Would a user have a worse experience of this page if they didn't see this image?
Take, for instance, a logo. When a logo is at the top of a page, it generally informs users of what website they are on. Logos almost always have alt text, then, since not having it can make it confusing what site you are on.
The most important factor in determining whether or not to include alt text, then, is the context for the image. Take this photo of David Letterman on Ball State's campus (source: Wikimedia Commons). Should it include alt text?
If this photo was on the page right next to a quote attributed to David Letterman, it would not require alt text. It is not adding to the content of the page. The experience of any who cannot see the image is not harmed in any meaningful way.
On the other hand, if this photo was in an article about different approaches to comedy, and the photo was showing David Letterman as an example of a particular approach, it would require alt text. In this situation, knowing that David Letterman is an example of that approach to comedy affects the comprehension of learners.
Any image with readable text on it should replicate that text exactly in alt text or in the surrounding text.
While there are no hard and fast rules about alt text, there are a few types of images that almost always need alt text and almost never need alt text.
Almost Always Need Alt Text
- Logos
- Quotations or other text
- Images used as interactive components, such as buttons
- Icons used to convey important information, such as file types
- Screenshots with directions/highlights
Almost Never Need Alt Text
- Photos of people next to a bio or attributed quote
- Images that contribute to the aesthetic feel of a page
- Stock images used to break up text content
- Background images
- Lines, textures, or other non-interactive page elements
- Images that are described in the surrounding text or a caption
On our next page, we'll look at how to write effective alt text.