Article by David Bailey
Alt text, short for “alternative text,” started because of a requirement in the Section 508 Amendment to the United States Workforce Rehabilitation Act of 1973 that requires all federal agencies to make their electronic and information technology accessible to people with disabilities. Alt text is used to describe images in a document for users with a visual or cognitive disability. The words describing the image are read out loud by screen reader software, allowing the person with the disability to understand the content and function of the image.
All federal agencies and institutions that receive federal funding are required to be 508 compliant. This includes government agencies, federally funded nonprofit organizations, public higher education institutions, and public K–12 schools.
See the United States Access Board website for the complete text of the standards and guidelines of Section 508.
The most common usage of alt text is on websites. HTML has the “alt text” feature built into the language: every <img> must have an alt= attribute. However, the alt-text descriptions used on websites are often very brief and not always helpful.
Alt text is also used in 508 compliant PDFs, ePUBs, MOBIs, PowerPoints, and Word documents; that is, any media application with images that can be read by screen readers will need alt text.
For small websites or projects with a limited number of simple images, alt text can be written by the website developer. However, for large websites with hundreds of complex images, such as an online course on biology, hiring a content development group is highly suggested and will improve the quality and usefulness of the alt text.
What is meant by “function” and “content” in alt-text writing?
The function is determined if the image is “clickable” as a link or button.
The content is what is “in” the image and how it relates to the accompanying text (“context”): if there are three people sitting at a dinner table in the image, that should be included in the description. Also, any words that are in the image should be included in the alt text. For example, a company logo with the company’s name should have that name as part of the alt text.
The “context” is what the image is being used for in the relation to the document. For example, photo of an owl accompanies a multiple-choice question about camouflage and the reader will need information in that photo to answer the questions. The alt text should describe the photo to include information needed to answer the questions without giving the answer away.
The animal in this photo is displaying what type of adaptation?
- Migration
- Camouflage
- Hibernation
- Mimicry
If the photo accompanied text that related to the photo in a less specific way (a general discussion of owls), less descriptive alt-text could be used, as below.
If an image is decorative (i.e., it isn’t active and it doesn’t contain information), then it doesn’t need a description. In HTML, it would be written as <img alt=” “>
Brevity is key for alt text; only what is necessary to describe an image should be included in the alt text; this decision is based on the context of the image, or how the image is being used in the document. For example, the map of colonial Boston would need more description when accompanying questions but less description as a decorative background image on a title page. Clip art of a car in a timeline could be described as “A car.” However, if the image was of a Ford Model-T, and the context of the timeline required it, more description should be used: “A Ford Model-T automobile.”
Redundancy is also important. If the image has a caption, the alt text should not include all the information that is already in the caption. WebAIM’s article has an excellent example of how to avoid redundancy in alt-text writing.
For more information on writing alternative text, see Five golden rules for compliant alt text from AbilityNet.