Error Identification and Suggestion
Errors must be identified in text, described specifically, and accompanied by a suggested fix where one is known.
Definition
WCAG 3.3.1 requires that input errors are identified and described in text. 3.3.3 requires a suggestion for correction where it is known and does not compromise security. 3.3.4 adds reversibility requirements for legal and financial transactions.
Craft convention. True because the industry converged on it. Breaking it costs familiarity, not correctness.
Implementation
- Set aria-invalid on the failing field.
- Associate the message with the field using aria-describedby.
- Include the field name in the message, so it makes sense when read from an error summary.
- Move focus to an error summary on submit, with links to each field.
- Suggest the correction where you know it: an expected format, a valid range, a likely typo.
- For legal or financial submissions, provide reversal, confirmation or the chance to review.
Sources
Where a source establishes something narrower than the popular reading of it, the note says so.
Continue from here
Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.
Applies when you are designing
Depends on
Get these right first, or this one will not hold.
- Labels and InstructionsAccessibility
An error that names a field nobody labelled cannot be acted on.
Related concept
Connected closely enough to change how you apply this.
- Status Messages and Live RegionsAccessibility
- Help Users Recognise, Diagnose and Recover From ErrorsHeuristic
- Error MessagesUX writing