Alternative Text

What is Alternative Text?

Images convey information quickly and powerfully—assuming they can been seen and understood. However, some readers may not understand the meaning of the image; others may not be able to see it due to visual impairment, personal viewing preferences (especially on the web), or technological limitations.

Alternate text (often called “alt text” or "alt tag") is added to an image to provide a textual alternative to visual information. Why is this important? Remember, some users won’t see your information; instead, they’ll hear it using screen-reading software. By adding an alt text to an image, you make its meaning available to people who, for whatever reason, cannot see it.

The following video clips demonstrate what images sound like to someone using a screen reader. The first is an example of an accessible image with alt text. The second shows what happens when alt text is not included.

Video: Alt Text with JAWS (Screen Reader)

Video: Screen Reader Reading Image without Alt Text

Writing Alt Text

Alternate text should be added to all non-text elements, including:

Pictures
Graphs
Charts
Microsoft Office SmartArt

Make alternate text meaningful to a listener:

What is the context of the image? What meaning does it add to the page?
Be concise. Describe only what you expect visual users to get out of the image.
If the image is already described in the surrounding text, the alt text can be very short.
Avoid redundant statements like “Image of” or “This is a picture of.” Simply state what it is.
If an image is purely decorative, mark it as such (various methods depending on software).

Adding Alt Text in Specific Software

Adobe Acrobat Professional

Adding Alt Text in Acrobat

Use the Action Wizard in Acrobat to detect any images (Figures) in a PDF. (See instructions on using the accessibility checker in Acrobat.)

The Wizard will prompt you to add alternate text to any images it finds.

Canvas

Adding Alt Text in Canvas

Canvas provides a text box for entering alternate text at the same time that you upload an image. In the text editor, click on the Images icon or use the Insert menu to upload an image.

At the bottom of the Upload Image window, type the image description in the Alt Text box, then submit the image.

Video: Adding Alt Text in Canvas

Facebook

Adding Alt Text in Facebook

Add alternative text to any images that you post, including memes.
For memes with text in them, repeat the text but also include any context that helps the audience understand the point.
You can include the description in the text of the post, or edit the image to add it in the background.

To add alternative text, click or press on the photo to edit it:

In the Edit Photo menu, press Alt text:

Press "Override generated alt text" to add your description:

HTML Code

Coding Alternative Text in HTML

When editing HTML code directly, include the alt attribute (“alternative text”) for all images. The alt attribute is added after the path to the file:

Example: <img src="file-name.jpg" alt="Descriptive text goes here.">

Alt text should describe the meaning of an image rather than its appearance. For example:

Poor: <img src=" lab_sign.gif" alt="Sign hanging on lab door.">
Better: <img src="lab_sign.gif" alt="Each laboratory has safety policies posted on the door.">

Purely decorative images (graphics that convey no information), require a “null” or “empty” alt attribute. The null attribute is a signal to screen reader software that the image is unimportant and can be skipped.

Example: <img src="spacer.gif" alt="">

Instagram

Adding Alt Text in Instagram

To add alt text in Instagram, scroll down to Advanced Settings at the bottom before sharing a new post:

In Advanced Settings, select Write Alt Text:

In the new window, type a short description of the image in the text box. Select Done to return to the new post.

*Note that alt text does not carry over automatically on posts shared from Instagram to Facebook. You'll need to edit alt text in Facebook after sharing.

Microsoft Office 365

Adding Alt Text in Office 365

Right-click on the image, then select Edit Alt Text from the menu.

An alt text panel will open in the document pane to the right. Type a short description in the text box.

If the image is decorative, you can check the Mark as Decorative checkbox instead. You should only use this option if no meaning will be lost to any audience who cannot see the image.

Microsoft Office 2013 & Later

Adding Alternative Text in Office 2013 - 2016

Note: Sometimes images that are downloaded from the web have “junk” alternate text (usually a long file name). Make sure to manually check every image.

Right-click on the image, then select Format Picture from the menu. (This menu option may be Format Shape on other types of graphics).

Format picture is the last choice in the image context menu

A Format Picture menu will open in the document pane to the right. Select the Layout and Properties tab, the third option in the Format Picture Pane.

Format picture sidebar showing the layout & properties tab