WCAG 1.4.9 Images of Text (No Exception): Eliminate Text in Images

What This Criterion Requires

WCAG 1.4.9 is the AAA-level extension of criterion 1.4.5 (Images of Text). While 1.4.5 allows images of text when they are essential or customizable, 1.4.9 removes most exceptions and requires that images of text are only used for pure decoration or where a particular visual presentation of text is truly essential, such as a brand logotype. All other text content must be rendered as real, styled HTML text rather than rasterized into images. This ensures maximum flexibility for users who need to customize font size, spacing, colors, and other text properties to read comfortably. Real text also reflows properly on different screen sizes, works with screen readers without requiring alt text workarounds, can be translated by browser translation tools, and is indexable by search engines. Meeting this criterion pushes organizations to invest in web typography and CSS capabilities rather than relying on image-based text for visual appeal.

Why It Matters

Images of text create barriers for multiple groups of users. People with low vision cannot resize image-based text independently of the page zoom, and the text becomes blurry or pixelated at higher zoom levels. Users with dyslexia or cognitive disabilities cannot apply custom stylesheets to change fonts, line spacing, or background colors that make text easier to read. Screen reader users depend on alt text that may not perfectly replicate the nuance of the original, especially for longer text passages. Users who speak different languages cannot use browser translation features on text embedded in images. On mobile devices, images of text do not reflow to fit narrow viewports, forcing horizontal scrolling. Meeting criterion 1.4.9 ensures that all textual information is flexible, adaptable, and accessible to the widest possible range of users and devices.

Common Failures and How to Fix Them

<div class="hero">
  <img src="/images/hero-banner.jpg" alt="Transform your business with AI-powered analytics">
</div>

<div class="hero" style="background-image: url('/images/hero-bg.jpg');">
  <h1>Transform your business with AI-powered analytics</h1>
  <p>Start your free trial today</p>
</div>

<nav>
  <a href="/about" class="nav-item">
    <img src="/images/nav-about.png" alt="About Us">
  </a>
</nav>

<nav>
  <a href="/about" class="nav-item">About Us</a>
</nav>
<!-- Use CSS web fonts for custom typography -->

<img src="/images/stats-infographic.png" alt="85% of users prefer accessible websites">

<div class="stat-card">
  <span class="stat-number">85%</span>
  <p>of users prefer accessible websites</p>
  <img src="/images/stat-decoration.svg" alt="" aria-hidden="true">
</div>

How to Test

1. Visually scan every page for text that appears to be part of an image rather than real HTML text.
2. Right-click on text elements and check if they are selectable; image-based text cannot be selected or highlighted.
3. Use browser developer tools to inspect elements and confirm text is rendered in HTML, not embedded in img, svg, or canvas elements.
4. Try zooming to 400% and check if all text remains sharp and readable without horizontal scrolling.
5. Verify that only logos and purely decorative elements use images of text.

CMS-Specific Guidance

This criterion commonly causes issues on these platforms:

• Wordpress Accessibility Checklist
• Shopify Accessibility Checklist
• Squarespace Accessibility Checklist
• Wix Accessibility Checklist

Further Reading

• Accessible Images Beyond Alt Text
• Alt Text Guide
• Color Contrast Guide

Related WCAG Criteria

• WCAG 1.4.5
• WCAG 1.1.1
• WCAG 1.4.4