┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈

It is necessary to identity user errors and offer suggestions to the user when an error occurs. Avoid negativity in your error message. Inline error validation is a better user experience than top form validation (see example below).

Summary Points:

• Post the error identification upon submission of content

• Asterisks are often universally used to indicate errors

• Error color and error icon/asterisk should be consistent with a 3:1 minimum contrast ratio

• Red is a universally accepted error color

• Yellow or orange typically is a warning color and a poor choice for error bias

• Error messaging should be consistent throughout

• You can use CSS to create a uniformed error message

• Redisplaying a form after an error with no error warning is ill advised and bad user experience

• Form omission, incomplete data and incorrect formatting are the top reasons for errors

• Avoid negative words such as Oops, Error, Failed, Problem, Invalid, Wrong, and Prohibited

Error Message Code Examples:

Error Form Example:

Warning Icons:

Error Form UX:

Further On This Topic:

https://www.w3.org/TR/UNDERSTANDING-WCAG20/minimize-error-identified.html