ALT Descriptions for Images
Images can be a great way to engage your learners with different modes of learning, and can help communicate complex ideas to students. For students with visual impairments, image descriptions that explain the content of an image are crucial for their learning. For all students, text descriptions can provide deeper context to aid their comprehension.
Ally checks for image descriptions anywhere there is an image. This includes image files and files that include images. For example, a document or presentation.
ALT - Alternative text: word phrase that is inserted in the HTML to describe the image for people who are unable to see the image.
What is Access4All | Workshops | Using Access4All
Videos
Fixing ALT Descriptions
Fix Canvas Pages | How to Write Descriptions
1) Using Canvas' Image Options to Fix ALT Descriptions
Once you provide an alternative description for an image through Ally in a Canvas Page, the description will change to a Green indicator “dial”. The description added through Ally will get pushed back into the Canvas content directly so that it can be stored by Canvas and made available to your students. This ALT description is not saved in Canvas and can be copied into future courses.
From the Canvas Page
- Look for a red or orange Accessibility Score - Dial (bottom left of image).
- In Canvas, click on the Pages course menu (left). If you have a HOME page, you will need to click on the View All Pages button (top left).
- Use Canvas' Rich Content Editor to fix the page, Click on the Edit button on the top right of the Page.
- Click on the image within the page, then select Image Options.
- Add the ALT Description in the (A) ALT Text box OR click on (B) Decorative Image box (if the image is decorative). Note: this is an example of a "decorative" image on a page.
- Scroll down and choose the Done button.
- At the bottom of the Page, click on the Save button (bottom right).
- Video tutorial - Add ALT Text to Images in Canvas
Writing Good Descriptions
ALT tag descriptions should be short - less than 100 characters. This description is extremely important when students come across an image that has become suddenly unavailable and when students who rely on a text-to-speech or screen reader program to navigate the web access your course content. In the former case, the alt text is visible to any sighted person. In the latter case, the alt text is read aloud or translated to braille. If you need more than 100 characters to describe this image via the ALT tag, add the instructional text within the page.
Follow these best practices to write good alternative text descriptions for your images:
- Describe the image based on the page context. Convey the full meaning of the image.
- Avoid saying "image of" or "picture of". Screen readers automatically announce images as images.
- Be concise.
- Write narratives for complex images like infographics. Put this narrative on the page immediately following the infographic. Include an anchor link at the top of the page to view the text alternative. See an example of an infographic with a text alternative.
- Avoid images of text. If you can't avoid it, copy the text into the alternative description.
- Say something new. Don't repeat alternative descriptions on the same page. Don't repeat what is already said on the page.
- Identify images that don't represent relevant content as decorative.
What is a decorative image?
An image is decorative when it doesn't add to the information on the page. For example, art work used to separate topics or a photo of someone on the phone when discussing communication skills.
They are valuable in their visual appeal but may not need to be read by screen readers.