A young woman in a mustard yellow sweater and purple skirt gestures with her right hand in front of stylized computer interface panels. The text "Alternative Text" is displayed in bold, dark letters below her.

Infographics, Charts, and Diagrams

When creating alt text for an infographic or charts, it's important to include key text, the overall context, and the layout of the image. For the infographic image, use the short description as the alt text to provide a brief overview. However, it is essential to include a long alt text below the image. This ensures that users can visualize the image and fully understand its content.

Best Practices for the Infographic/Chart/Diagram Alt Text :  

Here’s an example of a different infographic description: It includes a concise alt text for the image and a detailed, descriptive caption below the image that provides a comprehensive explanation of the infographic.

Example: 

Short Alt Text: “Mind Map Infographic – A central lightbulb graphic labeled 'MIND MAP' with various idea categories branching out “ 

Mind Map Infographic – A central lightbulb graphic labeled 'MIND MAP' with various idea categories branching out

Long Alternative text:  
“This infographic visually represents different types of ideas in a mind map format. At the center, a lightbulb icon inside a light blue circle is labeled "MIND MAP." Surrounding this are seven labeled boxes, each representing a different type of idea: UNIQUE IDEA, FRESH IDEA, SIMPLE IDEA, INNOVATIVE IDEA, SMART IDEA, ORIGINAL IDEA, and CLEVER IDEA. Each box contains a short paragraph explaining the concept of that idea. Arrows connect the boxes, visually linking them to the central lightbulb and to each other. The background consists of a light-colored grid pattern, maintaining a structured layout. The color scheme is pastel-like, making the text easy to read. The modern design uses clean lines and clear typography to ensure clarity.”

See below for additional information on:

Additional Tips 

For more information, check out the WCAG 2.2 (Text Alternatives) for detailed guidance on ensuring your web and document content is fully accessible. 

How to use Alternative Text: