ACCESSIBLE E-COMMERCE: The Strikethrough Strikes Out

Pencil Drawing of Shopping Cart

So many e-commerce websites use the strikethrough style to indicate a discounted price, like this:

Display:
Price: $12.99 $9.99

Code:
Price: <span style=”text-decoration: line-through;”>$12.99</span> $9.99

For the sighted user, the strikethrough text remains readable.

But for those individuals who use screen readers, it’s a strike out.

Screen readers, such as NVDA, ignore the strikethrough text. NVDA reads the price example above as:

Price: $12.99 $9.99

What is the actual price? Very confusing.

Solution

Be sure to deliver the complete info so all shoppers can understand.

Display:
Price: $12.99 now $9.99. You save $3.

Code:
Price: <span style=”text-decoration: line-through;”>$12.99</span> now $9.99. You save $3.

===

WEBSITE ACCESSIBILITY TESTING & REMEDIATION SERVICES: Mary Gillen is an experienced Website Accessibility Compliance Auditor and Remediator. She can test your website to determine if it meets accessibility standards:

WCAG 2.1: 312 checkpoints covering A, AA and AAA W3 accessibility guidelines
Section 508: 15 US federal guidelines covered by 59 accessibility checkpoints

Find out more about Mary Gillen’s Accessibility Testing & Remediation Services: Websites, PDFs, Office Docs & Videos

===