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

> Canonical HTML version: https://rocketvalidator.com/html-validation/attribute-aria-required-must-not-be-specified-with-a-different-value-than-attribute-required
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

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

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

## Valid example

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