When an error occurs the user is informed what caused the error, and the error is described in text. This ensures that the error is available to people who cannot see, distinguish colours, or understand icons and other visual cues.
Accessibility Requirements for 3.3.1 Error identification (A)
- Each error is described in text;
- Each error is associated with the field it relates to;
- Multiple errors are summarised at the top of the form.
Common mistakes for 3.3.1 Error identification (A)
- An error is only indicated by a red border around the field;
- An error is only indicated by an icon near to the field;
- An error is described in text, but it is not associated with the field it relates to;
- Multiple errors occur, but no summary is provided.
- An error summary is provided, but keyboard focus is not taken to it.
FAQs for Error identification (A)
What to do after identifying input errors?
1.Identify and explain to the user any mistakes that you can detect automatically.
2.Add error explanation close to the error, showing what is wrong and how to fix it.
Tips for error identification.
If a form requires input in a certain format, show and describe the required format.
If a mandatory field is empty, highlight the field and explain what’s required.
Build forms to be forgiving, accepting variations on the formats you prefer.
Don’t ask for too much information, just what you need.
Be specific. Use clear, concise instruction and form field labels.
Highlight mistakes in forms with colours and symbols.
Don’t clear a form if a user makes a mistake. Save the information and allow the user to edit their error and continue.
Provide extra help by giving your contact details on all pages (the header or footer are great) and especially near forms.
- The following are common mistakes that are considered failures of Success Criterion 3.3.1 by the WCAG Working Group