Success Criterion 1.3.1
Conformance level A

Price Strikethrough Shown Only Visually, Not in the Markup

1.3.1 — Info and Relationships

Scenario

Setting

A food-delivery app's order-tracking screen

What’s wrong

Semantics conveyed by strike-through/highlight (e.g., old vs — sale price) with no markup (inserted/deleted-text code (del/ins)/text).

Example

This shows up on a food-delivery app's order-tracking screen: semantics conveyed by strike-through/highlight (e.g., old vs — sale price) with no markup (inserted/deleted-text code (del/ins)/text).

Why it matters

Screen-reader, braille, and reading-tool users who depend on coded structure rather than visual layout. On a food-delivery app's order-tracking screen, this barrier means they can't tell what's going on without extra effort.

How to test

Inspect elements styled to look emphasized/structural (bold price, indented note) in DevTools: if there's no matching semantic tag (strong, blockquote) behind the style, it fails.

How to fix

Convey the distinction in markup (inserted/deleted-text code (del/ins)) or text (e.g., 'was ₹999, now ₹799'), not styling alone.

Outcome

Corrected, a food-delivery app's order-tracking screen now lets a visitor move through the content with confidence.

Who is affected

Screen-reader, braille, and reading-tool users who depend on coded structure rather than visual layout.

Learn more

Understanding Understanding document (opens in a new tab)