Attribute “aria-required” must not be specified with a different value than attribute “required”.

A field with the required attribute has an aria-required value that doesn't match it: remove aria-required and keep the native attribute.

aria-required only accepts true or false. A value such as yes, 1 or required is neither, so the validator reports two errors on the same field: a Bad value error for aria-required, and this one, because the value differs from what required states. These values usually come from copying the native attribute into the ARIA one, as in aria-required="required", or from a template that prints a boolean as 1 or True.

The required attribute already tells assistive technologies that the field must be filled in, and it turns on the browser's own form validation. The field doesn't need aria-required at all, so remove it. If you're building a custom widget that can't take required, such as an element with role="combobox", write aria-required as exactly true or false.

Other values give different messages. aria-required="false" next to required is its own error, because it contradicts the native attribute. aria-required="true", or a value that exactly repeats the value of required (such as required="required" aria-required="required"), only gets a warning that the attribute is unnecessary.

Invalid example

<label for="email">Email</label>
<input type="email" id="email" name="email" required aria-required="yes">

Valid example

<label for="email">Email</label>
<input type="email" id="email" name="email" required>

Learn more:

MDN Reference

MDN Web Docs: aria-required

→

MDN Reference

MDN Web Docs: HTML attribute: required

→

W3C Reference

W3C: ARIA in HTML

→