A red border alone explains neither the problem nor its correction.
Accessible forms with field errors and error summaries
Associate labels and errors with fields. Provide a summary linking to errors and retain valid information.
Research context: W3C WAI · Accessible form notifications ↗
Show errors after shoppers have had a chance to complete the field. Remove error state after correction.
Try the pattern
Task and expected result
- 01
Enter invalid email and leave the field: see its associated error.
- 02
Correct email: remove the error text.
- 03
Submit an incomplete form: follow an error-summary link to its field.
How to investigate value
Observe whether shoppers can select variants, correct errors and return from a dialog without assistance.
Watch for side effects
Hidden focus, keyboard traps, unexplained errors and controls covering content when zoomed.
This is a proposed investigation, not a measured result. Choose one hypothesis and define the audience before testing.
Build a measurement plan for this concept ↗