Our registration form wizard used a mix of inaccessible default browser error messages and ambiguous custom form validation messages in red text.
Categories
Upgrading form validation messages
Tag: forms
Forms make or break the most crucial online interactions: checkout (commerce), registration (community), data input (participation and sharing), and any task requiring information entry.
Any meaningful experience on the web has a form. Whether it’s a form made of text boxes, toggles, buttons, checkboxes, or touchable widgets, web developers need to be purposeful about forms to make users happy and increase conversions.
HTML5 introduced new features for web forms. Identifying input purpose via autocomplete attributes makes easier and faster form filling experiences for everyone entering personal or payment information. New input types, inputmode, and pattern attributes help users enter data accurately and efficiently.
Occasionally native HTML elements aren’t enough. A little ARIA can make them accessible, for example to screen reader users.
A form will spellcheck your name, email and postal address, giving false positives. I’ll share how I tweak this for a less jarring form-filling experience.
Identify input purpose (autocomplete values) makes easier and faster form filling experiences for everyone entering personal or payment information.