Alternative text (also known as alt-text) is a written description of an image that can be read by screen readers. This alternative text allows the content of the image to be accessed by those who are blind or have other visual impairments. Adding alternative text also allows students to understand the content of the image if anything were to prevent the image from loading in the web browser. Images in uploaded course documents (for example, assigned PDF readings or Word worksheets), Canvas pages, or other content available to students must have alternative text added to meet accessibility standards.
Alternative text should be written in the context of the instruction given and have all the details needed to understand the content of the image. Simply put, write alternative text to ensure that a non-sighted user would get all the same information from the image – in the context of your lecture – as a sighted user would. Follow the tips below to write high-quality alternative text for your students.
Quick Overview
Do’s:
- Be specific and succinct. Don’t make assumptions about the content of the image and only write information that is needed to understand the image in the context of the lecture being given.
- Include all text that is a part of the image itself. Screen readers are unable to “read” the actual content of an image, even if the image just appears to be normal text. For example, a screen reader would be unable to “read” a drop cap in a document if the drop cap is an image instead of typed text. Ensure that all image artifacts with text are fully transcribed in the alt-text for that image.
- Write alt text for illustrative images even if they are “decorative.” Illustrative images could be a photo of a classroom building or a group of students working on an assignment together. Illustrative images convey information in context and should have alternative text.
- Write only what is needed to know. When writing alternative text for images with complex information, consider what is necessary to know and understand for instruction and what context and information are already available, such as adjacent page text or figure text.
Don’ts:
- Don’t make assumptions about the content of the image
- Don’t write information unrelated to class instruction
- Don’t start the description with “Image of…”, “Photo of…”, or other similar introductions. Screen readers have a built-in ability to inform listeners that an image is present.
- Don’t write alt-text for decorative, unnecessary, or repetitive items. If an image is decorative or not needed to understand class instruction, you may mark it as decorative. For example, page dividers or department graphics do not need alternative text. For photos that are repetitive and have no further contextual or instructional meaning, you may write alt text for the first photo and mark subsequent ones as decorative.
Additional Alternative Text Tips
- When writing alternative text for images that depict actions or information – such as a download icon or support agent icon – it should be written as the exact equivalent of the information or action being conveyed by the icon. A simple way to write alternative text for these kinds of images is to describe what a sighted user can see and interact with, in the context of the rest of the page or document. For a download icon, the alternative text could be “Download assigned reading” whereas alt-text for a support agent icon could be “Contact student support.”
Examples
Good Alt Text:
An undergraduate student working on an assignment in the Campus Library
Bad Alt Text:
Picture of a student
Good Alt Text:
An aerial view of Presidents Circle located on the University of Utah's campus
Bad Alt Text:
Presidents Circle
If you’d like more resources on how to make your course more accessible for students, including more information on how to write alternative text, including examples, visit UCL’s Accessibility Guidelines Course.