Objective
Including Alternative Text to Digital Imagery.
Audience
Environment
Microsoft and Adobe
Procedure
Digital imagery plays a relatively outsized role in higher education learning. These image types include the following:
- Photos
- Diagrams
- Data visualizations
- Maps
- Digital video stills
- Digital slides
- X-rays
- Macro photos
- Website banners and others
People with visual acuity issues may not be able to consume digital imagery directly. To enable their access to the information in the visible, alternative text (or "alt text") is required wherever those images are found: on websites, in documents, in slideshows, in digital learning objects, in quizzes, in tests, and so on.
How to add informative alt text
To add alt texting to various file types, finding the text field for the alt-texting is essential.
Microsoft PowerPoint
In PowerPoint, right-click the image, and select "Edit Alt Text" in the dropdown menu.
The Alt Text window will open to the right. (Figure 1)
Figure 1: Alt Text Window in PowerPoint
This software enables you to input several sentences. If the image is decorative, there is an option to check the box below to indicate that the visual is cosmetic, so users of the alt text will not assume that there is more informational value.
The "Generate a description for me" enables the artificial intelligence in the MS Office Suite of tools to create a description from machine vision and artificial intelligence (AI). At first use, you will be asked to turn on "Intelligent Services" (Figure 2).
Figure 2: Window Asking for Approval of Use of Intelligent Services
Text will be generated, and the AI will indicate the generated text's confidence level. AI was used to create alternative text for Figure 2 above. The result may be seen below. (Figure 3)
Figure 3: Auto-generated Alt Text for Figure 2
Review what is generated, revise as needed (in the text field), and proceed. Computers will focus on particular aspects of an image that may not be what the teacher is focused on, so AI should be used with care.
Microsoft Word
To input alternative text to an image in word, please right-click on the digital image to activate it. In the dropdown menu, select "Edit Alt Text." A window like the one above will show to the right of the page.
Microsoft Excel
Right-click on the image in the Excel file to activate it. In the dropdown menu, select "Edit Alt Text." A window like the one above will show to the right of the page.
Adobe PDF
For Adobe PDF files, people generally use the original authoring tool (Word, LaTeX) to emplace alt-text. In most cases, transcoding to PDF will maintain the alt text availability to users.
Please visit their dedicated site for more information about accessibility in Adobe software.
Adobe Photoshop
Adding alt tags
Adobe Photoshop is the leading digital image editor for images in the raster and some other formats.
- Click on the image to add alt texting to a photo or image.
- Select the slice tool from the left menu.
- Right-click the image.
- Select "Edit Slice Options."
- Add the "Alt Tag" in the bottom text window.
- Click OK.
(For screenshots, see the "Accessibility Features in Adobe Photoshop" article linked here.]
Adding image file info
Go to the "File" tab in the top menu.
Select "File Info." There is room for a title and keywords. (Figure 4)
Figure 4: Editing Ride-along Image Information on Adobe Photoshop
Adobe InDesign
- Click on the visual.
- Go to the Object tab in the menu at the top.
- In the dropdown menu, select Object Export Options. (Figure 5)
Figure 5: Object -> Object Export Options in Adobe InDesign Desktop Publishing Software
The editable alt-text field will appear. (Figure 6)
Figure 6: The Alt Texting Window in Adobe InDesign Desktop Publishing Software
Across file types
If you have alt text on your images, check if they still function correctly if you transcode across different file types. Sometimes, the alt text can go missing, and you may have to re-add some alt texts to go with the images.
The art of writing alt texts
It may not be easy to disambiguate the alt texting for a diversity of learners sufficiently. Alt texts are often written as short phrases, not complete sentences, to save on space. There are ways to add more contextual meaning to digital visuals in various contexts.
Captions
Another layer of information around a digital visual involves the name of the graphic, often in the caption. All captions should be informational informative.
A note underneath the visual
Some figures may include a "note" underneath with more explanatory information. (The source citation method used in a formal paper will determine how common such notes are.)
Lead-up and lead-away text
Another way to add value to visuals is to add lead-up writing (in the paragraph or paragraphs before the figure is shown) and lead-away writing (in the sections following the introduction).
Complex digital visuals
Maps, data visualizations, multi-component diagrams, and other digital visuals may contain complex information. In such cases, it may help to enrich the descriptions around the visual, per the comments above.
However, if the image becomes separated from the context (the document, the slideshow; the course; the publication, etc.), the image's meaning will have to depend on the alt text and the visual information. Unless both are designed very well, there will be visual ambiguity.
In a live performance or presentation
During a live online presentation, live presenters often use extra descriptions to describe the visuals… even as live signers sign the speech and as AI closed captioning/timed transcription scrolls.
Extra points about color contrast
Visuals that use color to convey information (such as on maps on signs) should ensure that the colors are sufficiently contrastive between the various shapes and letters in the foreground and background. To check for sufficient contrast, there are multiple online tools. One of the most popular ones is the following:
WebAIM Contrast Checker:
https://webaim.org/resources/contrastchecker/