Alt Text
What Is the Alt Attribute?
When you view the source code of the page, you will see that the image is in an <img> tag, which has a number of "attributes," such as src, title, height, width, and alt. How you code these tags will define the image and will control how the image looks.
In terms of accessibility, our focus is on the alt attribute. The alt attribute's purpose is to contain a short text description of the image in case the image fails to correctly load on the page. Screen reading software can read that text so that a person who is blind will also get the information conveyed by the image.
Alt vs. Title Attributes
It is important to differentiate between the alt and title attributes. The title attribute creates a visual tool tip when you hover over an image with the mouse, but it is usually ignored by screen readers when a more accessible description is present. All screen readers will read the title attribute if no other information is provided. Using the title attribute is entirely optional, but it should not be used to convey important information.
Writing Alt Text
An alt attribute text should
- be short (about 125 characters)
- be context-sensitive
- have spaces between each letter in an acronym (e.g., A C L U)
- not include figure numbers, textbook page numbers, or page location information
- be empty for decorative images (i.e.,
alt="", no spaces)
Uploading Images and Alt Text in Canvas
When you use the Embed Image button in the Rich Content Editor to upload an image, by default the alt text will be the image file name, which is not ideal. If the image is decorative, check the Decorative Image checkbox; otherwise, replace the file name with descriptive text.