Images of Text

Why it matters

A picture of a sentence is a sentence that cannot adapt. It will not reflow to a narrower screen or recolor for dark mode. It will not take somebody's font or their line spacing, will not translate, and will not turn up in the page's own search. Every capability a reader uses to make text readable stops at the edge of that image. The group most often forgotten here is not blind readers. It is people with visual tracking difficulties, who change line spacing and alignment to hold their place on a line, and a flattened JPEG has one line spacing forever.

Who this rule protects

Low-vision users who zoom in or apply a custom stylesheet lose the words first. Dyslexic readers who swap in a different font lose them too. People with visual tracking difficulties who change line spacing and alignment cannot change either one inside an image. Users of browser translation tools get a page in their language with a picture still in yours.

How to check it yourself

1. 1Try to select the words with your cursor. If they do not select, they are a picture. This is the reliable test.
2. 2Do not rely on zooming to spot it. A high-resolution image of text stays sharp at 200%, so the zoom test can pass something that fails.
3. 3Check banners, promos, menu specials and anything uploaded through a CMS by somebody who is not a developer. That is where these live.
4. 4Where an image of text is unavoidable, check the same words appear as real text on the page, visible, next to it. Alt text does not satisfy this rule.
5. 5Check whether the image really is an image of text. A screenshot, a graph or a diagram carries other visual content and sits outside the criterion.
6. 6For a scanned document, check whether it has been through character recognition, because running the recognition is the named remedy.

Failures we see most often

• A promo banner exports its headline, price and terms together as a single flattened JPEG, so none of it is text on the page.
• A restaurant menu gets uploaded as photographed pages instead of live, selectable text.
• A styled pull-quote is rendered inside a design tool and embedded on the page as a PNG.
• An image of text is fixed by writing the words into the alt attribute, which discharges the text alternative rule and leaves this one failing.
• An SVG containing text is loaded through an img element, so a user stylesheet cannot reach it, when the same SVG inline would have been fine.

Who this one is for

Read from this rule's own note above, so the grouping and the note cannot disagree.

• Low visionpeople who can see the screen but not easily
• Cognitive and learningpeople for whom the difficulty is understanding, remembering, or staying with it

How this one is tested

We list 1 ACT rule against 1.4.5. Each one defines exactly what a checker looks at, which is how automated tools decide what to flag. Each one also checks a slice, so passing every rule here is not the same as meeting the criterion, and a rule can be proposed rather than approved or need a person to finish it. The note beside each says which.

• HTML images contain no textNothing implements this yet

How to fix it

• Rebuild the text with web fonts and CSS, since modern typography can reproduce almost any design as live text rather than a picture of one.
• Where a CMS will not let you rebuild it, publish the same words as real text beside the image. That is a conforming route rather than a workaround, and it is the answer for every locked-down platform.
• Run character recognition over scanned menus, forms and policy documents so the words become text a browser can read.
• Write the words into the alt attribute as well. That serves the text alternative rule and keeps a screen reader user whole, so do both rather than choosing one.
• Where a font license is the reason, write that down in your accessibility notes. A font you cannot redistribute is a named legitimate reason to ship an image, and the exception turns on whether the presentation could conform another way.

Passes vs. fails