When to use this method

Use accessible complex images when you need to:

• Display charts, graphs or infographics with detailed data
• Share maps or diagrams that convey essential information
• Ensure all users can access the complete meaning of visual content

The template

Copy this HTML code into WordPress classic editor's text tab:

<figure role="group" style="max-width: 100%; margin: 1em 0;">
  <img 
    src="YOUR-IMAGE-URL" 
    alt="Chart type and main finding. See detailed description below." 
    style="width: 100%; height: auto; max-width: 700px;">
  <figcaption>
    <strong>Figure 1: Your descriptive title</strong><br>
    Write a detailed description here that explains all the important data, trends & relationships shown in your image.
  </figcaption>
</figure>

Step-by-step instructions

Step 1: Upload your image

1. Use "Add Media" to upload your chart/graph
2. Copy the image URL from the Media Library

Step 2: Add the code

1. Switch to the text tab (not visual)
2. Paste the template where you want your image
3. Replace YOUR-IMAGE-URL with your actual image URL

Step 3: Write your content

• Alt text: Brief summary under 150 characters (chart type + main finding)
• Title: Clear, descriptive heading in sentence case
• Description: Detailed explanation of all data, trends & key points

Writing helpful descriptions

Include these details in your descriptions for complex images:

• Specific numbers, percentages or ranges
• Trends (increases, decreases, patterns)
• Highest/lowest values or significant differences
• Time periods & context

Think: "How would I explain this chart to someone who can't see it?"

Get AI help

Many AI tools can generate useful image descriptions and alt text, saving time and enabling greater accessibility. Try this prompt when uploading an image to an AI chatbot:

"Create accessible alt text & description for this chart that meets university web standards. Include: 1) Brief alt text under 150 characters, 2) Detailed description with specific data points, 3) No phrases like 'image of' or 'chart showing'"

Please note when getting AI help: 

• You must follow university guidelines around AI use. You may only use approved AI tools when working with university data (exception: data classified as "public" is OK to use in non-approved tools).

• You must always verify an AI tool's output before using it on the web. AI tools can sometimes misinterpret images and make mistakes, potentially introducing errors into your work. You are responsible for ensuring your alt text and image descriptions are correct, helpful and meet accessibility standards.

Why this works

• Accessible: Screen readers can navigate the content properly
• Mobile-friendly: Images scale automatically on phones & tablets
• Standards compliant: Meets WCAG 2.1 AA requirements
• Future-proof: Works with any WordPress theme