WCAG 1.4.5 — Images of Text

What this requires

If the technologies can deliver the same visual presentation with real text, real text must be used — not an image of text. Exceptions are narrow: logotypes (where the appearance is part of the identity) and text that the user can customise. Stylised headings, marketing slogans, charts with embedded labels, and "design-quality" typography rendered as images all fall on the wrong side of this criterion.

How AI coding tools fail this

When asked to "use this hero from Figma" or "match the marketing banner", AI tools sometimes export the design as a single PNG and embed it whole, baking the headline copy into the image. The result is pixelated at high zoom, untranslatable, unsearchable, and invisible to screen readers without an alt attribute that often gets omitted.

The second pattern: charts and infographics generated as static PNGs with no associated data, no accessible name beyond a vague title, and no equivalent textual content. The information is locked in the image.

The third: blog posts where pull-quotes are exported as images so they can use a special font. CSS web fonts can deliver the same effect with real text behind it.

Failing examples

Headline copy baked into a hero image:

<img src="/hero-banner.png" alt="" />

A pull-quote rendered as an image to use a display font:

<img src="/pullquote-bold.png" alt="Accessibility is non-negotiable" />

Passing examples

Real text rendered with a web font, with the visual emphasis preserved in CSS:

<section className="bg-hero bg-cover bg-center text-white">
  <h1 className="font-display text-5xl font-bold tracking-tight">
    Accessibility built into the model loop
  </h1>
  <p className="mt-4 text-lg">
    Track every WCAG criterion across every commit.
  </p>
</section>

A pull-quote with a <blockquote>:

<blockquote className="font-display text-3xl italic">
  Accessibility is non-negotiable.
</blockquote>

Edge cases

Logotypes are exempt. A logo can be a stylised image of text; the appearance is part of the identity.
Text in screenshots of other software is exempt when the screenshot is the point (a how-to page documenting a UI). Provide alternative text describing the relevant text in the screenshot.
Decorative images that happen to contain text (a photo of a shop window with a "Sale" sign) aren't images of text in the criterion's sense; they're photographs with text in them.
Charts with embedded labels are images of text for those labels. Either deliver the chart as SVG with selectable text, or provide a data table beside the image.
AAA: 1.4.9 removes even the "customisable" exception. AAA-targeting content must use text wherever the visual presentation isn't essential.

How Jeikin handles this

axe-core can detect images via <img> but cannot tell whether the content is text without OCR. Jeikin's guided review surfaces large images on landing pages and asks the reviewer to confirm whether the image contains essential text. The dashboard records the answer and links to the file for traceability.

References

W3C — Understanding 1.4.5 Images of Text (opens in new tab)