Including Alternative Text to Digital Imagery

Summary

Including Alternative Text to Digital Imagery.

Body

 Objective

Including Alternative Text to Digital Imagery.

 Audience

  • Students
  • Faculty
  • Staff

 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.  

  1. Click on the image to add alt texting to a photo or image.
  2. Select the slice tool from the left menu.
  3. Right-click the image.
  4. Select "Edit Slice Options."
  5. Add the "Alt Tag" in the bottom text window.
  6. 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

  1. Click on the visual.
  2. Go to the Object tab in the menu at the top.
  3. 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/

Details

Details

Article ID: 179
Created
Tue 5/31/22 8:20 PM
Modified
Wed 9/4/24 7:20 PM