- Success Criterion 3.3.1
- Conformance level A
Form Errors Marked Only by a Red Border, With No Text
3.3.1 — Error Identification
Scenario
Setting
An online clothing store's product listing page
What’s wrong
Errors indicated only by red borders/icons with no text describing the item in error.
Example
Here's what happens on an online clothing store's product listing page: errors indicated only by red borders/icons with no text describing the item in error.
Why it matters
Everyone submitting forms — especially screen-reader and color-blind users who miss color-only cues. On an online clothing store's product listing page, this barrier means they can't complete the form at all.
How to test
Submit invalid data and inspect the error indication: if only a red border/icon appears with no text describing the specific problem, it fails.
How to fix
A text error message must identify each field in error and be exposed to assistive technology (announced automatically or focused).
Outcome
Corrected, an online clothing store's product listing page now lets a visitor finish the task in one attempt.
Who is affected
Everyone submitting forms — especially screen-reader and color-blind users who miss color-only cues.
Learn more
- Understanding Understanding document (opens in a new tab)
Related scenarios
- Form Submission With No Way to Identify What Went Wrong
- Form That Fails Silently With No Error Message at All
- Generic ‘There Were Errors’ Message With No Field Named
- Error Text That’s Visible but Never Announced to Screen Readers
- Error Summary That Names Fields Too Vaguely to Identify Them
- Error Toast That Disappears Before It Can Be Read