|If user input is required for a form control the
aria-required attribute must must used.
- Users benefit from information being informed if a input to a control is required for form submission or task completion.
HTML4 Legacy Techniques
HTML5 and ARIA Techniques
|WCAG Success Criteria
3.3.3 Error Suggestion (Level AA, Primary Success Criterion)
input[type="text"] elements, and ARIA textbox, gridcell and combobox widgets
- To identify a required form control, add the HTML5
required attribute to the standard form controls.
- If compatibility with HTML4 standards or legacy browsers and assistve technologies, you can also use
aria-required="true" to indicate a form control is required.
- Use the
required attribute (or the
aria-required if used) as the CSS selector for visually styling the form control as required. This ensures that the visual state stays synchronized with the accessibility API state used by assistive technologies.
- The only reason to support both
aria-required on the same form control is to support legacy browsers and assistive technologies. This required extra care to make sure the two values do not conflict. If they do conflict the
required attribute will override the
aria-required property value.