WCAG 1.1.1 — Non-text Content (Empty Alt Text on Informational Images)

Who Is Affected

People who are blind or have low vision and use screen readers, users with cognitive disabilities who benefit from alternative descriptions, and anyone whose images fail to load due to slow internet connections.

What This Means

When an image conveys important information — like charts, diagrams, photos with context, or graphics with text — it needs alt text that describes what the image shows. An empty alt attribute (alt="") tells screen readers to skip the image entirely, which is only appropriate for purely decorative images.

Informational images with empty alt text create information gaps for screen reader users. They hear nothing about the image and miss critical content that sighted users can see.

Fix: Content Editor

For each image flagged by the scan:

1. Identify the image's purpose:

   • Does it convey information, show data, or illustrate a concept?
   • Is it referenced in the surrounding text?
   • Would a visitor miss something important if they couldn't see it?

2. Add descriptive alt text:

   • In WordPress: Select the image → click the pencil icon → enter alt text in the "Alternative Text" field
   • In Joomla: Select the image → Image tab → enter text in the "Alt Text" field
   • Keep descriptions concise but complete (typically 125 characters or less)
   • Describe what the image shows, not what it "is" (write "Bar chart showing 60% increase in applications" not "Bar chart")

3. Examples of good alt text:

   • Photo: "Mayor Johnson signing the budget resolution at Tuesday's council meeting"
   • Chart: "Pie chart showing park maintenance budget: 45% landscaping, 35% equipment, 20% staffing"
   • Diagram: "Flowchart of permit application process with 4 steps from submission to approval"

4. Save and republish the page.

Fix: CMS / Theme

If multiple pages have this issue due to a theme or template problem:

1. Check image insertion defaults:

   • In WordPress: Go to Settings → Media and ensure default alt text behavior is not set to empty
   • In Joomla: Check if your template is stripping alt attributes from images

2. Review content templates:

   • Look for hardcoded images in theme files that have empty alt=""
   • Update any template images that convey information with appropriate alt text
   • Ensure decorative template images keep alt="" but verify they're truly decorative

3. Train content editors:

   • Create guidelines for when alt text is required vs. when empty alt is appropriate
   • Establish alt text writing standards for your organization

Standard Reference

WCAG 2.1 Success Criterion 1.1.1 — Non-text Content, Level A

All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for decorative, formatting, or invisible content which should be marked so assistive technologies can ignore it.

• W3C Understanding SC 1.1.1
• WCAG Technique G94 — Short text alternative for informative images
• WCAG Technique H37 — Using alt attributes on img elements
• WCAG Technique G95 — Long descriptions for complex images
• WCAG Failure F65 — Missing alt attribute on informative images
• WCAG Failure F67 — Using empty alt on informative images