Image Alt Text

Alternative text, or “alt text” describes the content of images, graphs, and charts. Alt text that conveys meaning in instructional and communication materials should be added to every image on platforms including Moodle sites, word processing documents, and slide presentations. 

The Purpose of Alt Text

Alt text can be read by assistive technologies, which helps make sure more of your audience can access your content. Alt text has a secondary purpose, too: alt text can help you, the author, make sure that the image you have selected communicates your intended purpose, which can help improve the overall quality of your content. You do not need to include alt text for images and graphics that are purely decorative. However, you should include an empty alt attribute, which we will discuss below. 

Examples of Alt Text Descriptions 

Alt text should answer this question: What is the content conveyed by the image?

The content of the image is not simply a description of the surface features of the image or graphic. Instead, describe what additional content the graphic contains. What information do you want the reader to gain from looking at the image? What is the main idea being expressed by the graphic? Write in simple, precise language and keep the explanation brief. Typically, no more than a few words are necessary, though rarely a short sentence or two may be appropriate.
George Washington and Lafayette on horseback talking to soldiers in snow at Valley Forge.

Possible Alt Text:

  • ALT = "George Washington at Valley Forge" (most succinct) 
  • ALT = "George Washington and Lafayette on horseback talking to soldiers in snow at Valley Forge" (more detailed) 
  • ALT = "Valley Forge in winter. The landscape is snow-covered and soldiers are sitting by the open road with a camp fire.” (emphasizing climate) 

Source: http://accessibility.psu.edu/images/alttext/ 

Alt Text in Moodle 

This is the dialog box that appears when you add an image in Moodle:
Screenshot of Alt Text Dialog Box in Moodle
 
Notice the field labeled, “Describe this image for someone who cannot see it.” Place the alt text in this field. If you check the box below this field, labeled “Description not necessary”, Moodle will insert an empty alt attribute. This is only acceptable if the image is purely decorative.

Alt Text in Microsoft Word and PowerPoint

Microsoft Word

Add your image to the Word or PowerPoint document. Now, choose Format > Picture from the dropdown menu (or right-click on the image and select “Format picture” from the menu). Click “Alt text”, one of the options on the side bar. Here is the dialog box you will see:
Alt Text Dialog Box in Microsoft Office Suite
Depending on what version of the application you have on your computer, the box may look slightly different. Filling in both the “title” and the “description” fields is important. The title can help the reader decide whether or not they want to read the full description. The description can be longer. Remember to describe the purpose of the image to help achieve the goal of what you are trying to communicate. The user can hear the title and determine if they wish to hear the longer description.  

Adapted from https://accessibility.umn.edu/core-skills/alt-text

PowerPoint

After adding an image to a slide or spreadsheet, navigate to the menu: Format > Alt Text. The dialog box looks like this:



Add the full alt text in the Description field, choose "Generate a description for me," or choose the "Mark as decorative" box.

Empty Alt Attribute

Web-based content is marked up with HTML code that tells your web browser how to display text and images. The HTML image tag looks like this: <img src=“mammoth.jpg”>

The empty attribute (also called “null”) looks like this: <img src=”mammoth.jpg” alt=“ ”>

This attribute lets the screen reader user know that there is an image but that the image has no description. The attribute is useful where the image is purely decorative but should not be used when the image conveys meaning.

If you are working with images in a Moodle course web page, you do not need to worry about this as long as you remember to click the box next to “Description not necessary” (Moodle adds the attribute for you in the HTML view).