3.3.1 Error Identification

Form errors must be communicated in text. Relying on colour alone (turning a border red) or position alone (showing an icon next to the field) is not sufficient.

Two things are required: the field that contains the error must be identified (by name or description), and the nature of the error must be described in text so the user knows what to fix.

Show error messages in text next to or near the relevant field. The message should name the field: 'Email address: Please enter a valid email address.'

Move focus to the first error when a form is submitted with errors, or show a summary of errors at the top.

Use aria-describedby to associate error messages with their field programmatically.

Inline validation can help, but must not remove error messages before the user has corrected the problem.

• Form that highlights invalid fields in red with no text explanation of what is wrong
• Form that shows a generic 'Please fix the errors above' message without identifying which fields failed
• Error summary that lists errors but does not link to the fields