• Success Criterion 1.4.1
  • Conformance level A

Highlighted Text Meant to Signal Importance by Color Alone

1.4.1 — Use of Color

Scenario

Setting

A coworking-space booking app

What’s wrong

Text highlighted in color to mean "important/changed" with no other cue (interacts with 1.3.1).

Example 

<p>Your booking includes free cancellation. <span style="background:#fef08a">This deadline moved to 24 hours before check-in.</span></p>
<!-- yellow highlight is the only signal that this sentence changed -->

Why it matters

A member skimming their booking confirmation misses that the cancellation window shrank, then gets charged for a late change.

How to test

View text highlighted to mean 'important' or 'changed' in grayscale: if the highlight's meaning disappears, it fails.

How to fix

Pair the highlight with a bold "Updated:" label so the change is legible without depending on color perception.

<p>Your booking includes free cancellation. <strong>Updated:</strong> <mark>this deadline moved to 24 hours before check-in.</mark></p>

Outcome

The member reads the bolded update and cancels a day earlier, avoiding an unexpected fee.

Who is affected

Low-vision users who don't perceive the pale yellow highlight as distinct from the surrounding paragraph.

Learn more

Related scenarios