Add Purposeful Alternate Text

One of the first rules of web accessibility is to include alternative text (“alt text”) to describe an image on a web page. Screen readers need such text in the HTML to “read” the image, since users with low or no vision cannot see the image. However, a key component of this rule that many accessibility novices do not understand is that the alt text must be meaningful and in context.

The WebAIM webpage about alt text states, “The key principle is that computers and screen readers cannot analyze an image and determine what the image presents. As developers, text must be provided to the user which presents the CONTENT and FUNCTION of the images within your web content.”

Look at the image below. If you are instructed merely to include brief alt text describing this image, you might include such text as “woman at computer.” However, think about the situation as though you had no vision and relied on a screen reader to describe the image for you. Would “woman at computer” help you to understand the content and function of this image?

Woman in front of computer as illustration of image needing "purpose" for alt text

Important to note is that an image might require different alt text, depending on the situation. In some contexts, the image might be purely decorative, so that the alt text HTML would be merely “alt=””.” In other contexts, the alt text would be purposeful and provide a significant, yet concise, description of the image.

Support Resources