• Success Criterion 1.4.5
  • Conformance level AA

Quote Card Image Used as the Only Version of a Quote

1.4.5 — Images of Text

Scenario

Setting

A streaming music app's search results

What’s wrong

Social-media quote cards embedded as sole representation of the quote.

Example

<img src="sale-banner.png" alt="50% off everything">

Why it matters

Low-vision users who need scalable text, and people who customize fonts or colors.

How to test

Try to select the quote text inside a social-media-style quote card: if it's an image with no text alternative equivalent, it fails.

How to fix

Real text must be used instead of an image of text (except logos or where the exact rendering is essential).

<div class="banner"><p>50% off everything</p></div>

Real text can be resized, recolored, and read aloud accurately — an image of text can't.

Outcome

On a streaming music app's search results, this barrier is gone for low-vision users who need scalable text — they can complete the task without hitting this wall.

Who is affected

Low-vision users who need scalable text, and people who customize fonts or colors.

Learn more