The “radio” role is unnecessary for element “input” whose type is “radio”.

The role="radio" attribute is redundant on an <input type="radio"> element because the browser already exposes this element with the radio role to assistive technologies.

Screen readers and other assistive tools determine an element's purpose through its implicit ARIA role. The <input type="radio"> element has an implicit role of radio as defined in the ARIA in HTML specification. Adding role="radio" explicitly just repeats what the browser already communicates, and the W3C validator flags this as unnecessary.

Redundant roles add clutter to your markup without any accessibility benefit. In some edge cases, explicitly setting a role that matches the implicit one can even cause unexpected behavior in certain browser and screen reader combinations. The general rule: don't set a role on an element that already has that same role by default.

This applies to many other elements too. For example, <button role="button">, <a href="..." role="link">, and <nav role="navigation"> are all similarly redundant.

HTML examples

Before: redundant role

<label>
  <input type="radio" name="color" value="red" role="radio">
  Red
</label>
<label>
  <input type="radio" name="color" value="blue" role="radio">
  Blue
</label>

After: role removed

<label>
  <input type="radio" name="color" value="red">
  Red
</label>
<label>
  <input type="radio" name="color" value="blue">
  Blue
</label>

Remove the role="radio" attribute. The element already communicates its role to assistive technologies without it.

Learn more:

MDN Reference

ARIA: radio role

→

MDN Reference

HTML input type="radio"

→

W3C Reference

ARIA in HTML

→