Chapter 20a: Error Handling: part 1: Informing Field Types & Invalid Formats

As we discussed in chapter 17, instructions is one way of warning the users about the data to be filled in. HTML5 and ARIA provides some attributes to programmatically inform mistake the user is attempting immediately. Eg: HTML5 invalid attribute or aria-invalid property can be used to inform the user if an invalid format is entered into the field. The attribute can be invoked immediately when the user moves away from the field and be notified to the user. The HTML5 required or aria-required property is also a similar attribute that helps the user avoid mistakes.
The new input type elements such as type=”tel”, type=”email” etc also get into the same category.
<label for=“email”>Email Id</label>
<input type=“email” id=“email” aria-required=“true” aria-invalid=“false” />
If user enters an invalid format of email i.e. info@maxability then invoke aria-invalid to true.