Images

Every meaningful image should have alternative (alt) text. Alt text is a text-based description of an image. Alt text should be concise and describe the content and context of an image. It serves as a text equivalent for users who cannot see the image or when it fails to load.

Alt text is crucial for accessibility and ensures that all users can understand the content of the image. In most cases, alt text is required for content that contains images. The Title II regulations require that organizations follow the Web Content Accessibility Guidelines (WCAG) version 2.1 standards. Providing alt text is a requirement under the accessibility standard.

How to write effective alt text

• Be concise but descriptive (keep under 125 characters as a best practice).
• Do not use phrases like “image of” or “picture of” (screen readers announce it automatically as an image).
• If the image conveys important data, describe the key points.
• Ensure the text can be understood without additional context.
• If the image is also a link, the alt text should describe the link target.
  • If the image contains text, include it in the alt text. If the image is already described in the surrounding text, don’t include alt text.
  • If an image is purely decorative, don’t add alt text. Mark it as decorative.

Example photo and alt text:

Good alt text: Truman the tiger playfully poses with a student in front of the columns at Mizzou.
Why this works: The alt text succinctly explains the content in the image and the emotion conveyed.

Poor alt text: Photo of Truman and student
Why this doesn’t work: The alt text doesn’t explain who Truman is, where the photo takes place or any additional context. Including “photo of” is unnecessary and repetitive since a screen reader will indicate the file is an image.

Do all images require alt text?

No. According to WCAG, images are either meaningful or decorative.

• Meaningful: Include alt text.
  • A meaningful image presents concepts, data or details that are not fully conveyed by the surrounding text.
• Decorative: Hide from screen readers (e.g., use alt=""). Check your authoring tool for the correct way to do this.
  • A decorative image is an image that provides no additional content or information to the user. They don’t add to the understanding of the webpage’s content and are often used for visual styling.

How do I decide if an image is meaningful or decorative?

A good question to ask yourself is: “If the image were removed, would the user lose essential information?” If the answer is no, then the image is likely decorative. If yes, the image is likely meaningful.

The Web Accessibility Initiative (WAI) has published a decision tree designed to assist authors in determining if an image is meaningful or decorative.

Alt text Guidelines

• Be concise – No longer than a sentence or two.
• Be descriptive – Only focus on the details that matter. What do you expect visual users to get out of the image?
• Alt text should support the surrounding text.
• Don’t use “Image of …” in your alt text.
• If the image is also a link, the alt text should describe the link target.
  • If the image contains text, include it in the alt text. If the image is already described in the surrounding text, don’t include alt text.
  • If an image is purely decorative, don’t add alt text. Mark it as decorative.

For examples of alt text, visit:

• Harvard’s Guide to Writing Alt Text
• Section 508 Guide to Alt Text
• Pew Research’s Guide to Writing Alt Text for Charts

What do I do if an image is too complex to fit in a sentence or two?

Provide the complete description in a linked document. For detailed guidance on writing descriptive alt text for complex diagrams, infographics and STEM materials, see Best Practice for Writing Alt Text for Complex Images (PDF).

How do I add alt text in the following platforms?

The process of adding alt text can vary from platform to platform. See the following resources to learn how to add alt text in commonly used tools.

• Microsoft Office 365
• Microsoft Power BI
• WordPress
• Adobe InDesign
• Qualtrics
• TDX Knowledge Base articles