OER Accessibility Series: Alternative Text
Alternative (alt) text is a description of an image coded into the background of the image that a screen reader will then read in place of the image. There are a couple of important things to keep in mind about alt text:
- Many tools will provide an option to say the image is “decorative,” which will then eliminate the requirement of alt text. The “decorative” option should only be used when an image is actually decorative (it doesn’t bring any meaning or value to the page except to make it pretty). If the image is not there solely for decoration, descriptive alt text is necessary for the document to be accessible.
- “Descriptive” doesn’t mean it needs to be described down to every little detail. It means that the alt text should describe the image generally and specify what the student should get out of the image. So if the image is a diagram of the bones in a human hand with tags indicating the metacarpal bones, the alt text should explain that and include a description of where those metacarpal bones are located (i.e. “the metacarpals are the bones running from the base of the hand to the base of each finger, between the carpals and the proximal phalanges”).
This work by Tiffani Tijerina for Affordable Learning Georgia is licensed under a Creative Commons Attribution 4.0 International License. The example image used is from the public domain.
The basic Microsoft Office tools from its 2019 edition all use the same process for adding alt text (pretty convenient, huh?).
Note: Microsoft also includes a “Generate a description for me” button. It is very rarely accurate and is not recommended. Unfortunately, Office 2019 has that function set to automatically run when you insert images. However, you can (and should) turn it off! To do so, go to File > Options (at the bottom) > Ease of Access, and then make sure the “Automatically generate alt text for me” option is unchecked.
- Right click the image and click “Edit Alt Text.”
- In the screen that opens on the right-hand side, type your descriptive alt text.
Adobe Acrobat Pro DC has an accessibility toolbar that allows you to do all of your alt text in a document in a row without having to search for all of your images. It can save you a bit of time to add all of your alt text when the document is complete.
- Click the “Tools” tab.
- Scroll to the section titled “Protect and Standardize,” and click “Accessibility.”
- In the screen that pops up on the right-hand side, click “Set Alternate Text.”
- Adobe will tell you that it’s going to detect all figures in the document. Click “OK.”
- Type the alt text for the highlighted image in the box. If you have multiple images in the document, click the arrows to cycle through each of them, typing alt text for each. When you are finished with all images, click “Save & Close.”
There are a lot of tools that we use to develop course materials, and we could never cover them all. However, if your tool has an HTML-editing function, you can add alt text to your image using its code.
- After adding your image to the document, open the HTML-editing feature. Find the section of code that starts with <img and ends with />.
- In that code, look for a piece that says alt=“some text”. If there is no alt attribute, add it to the code after the part that says src=“some file path”. Make sure that there is one space between tags.
- Read the part inside the quotations. Is it accurately descriptive of the image? If not, replace that text with the correct description.
- Save and close the code.