Component Library

Required Fields not Denoted

Issue Description

An asterisk is used to indicate a required field, but that status is not indicated via assistive technology.

All Required fields are not indicated as such to assistive technology and there is no notation on page to denote that the asterisk is for required field.

Recommendation

  • In Addition to the "required" attribute, use <aria-required="true"> attribute inside the <input> field.
  • Include the word "required" in the form field label.
  • Include instructions at the top of the page indicating that an asterisk means that a form field is required.
  • When validation fails, ensure that focus is taken to the form fields that fail validation.

https://usability.com.au/2013/05/accessible-forms-2-required-fields-and-extra-information/