axe-core rule: aria-roles

Elements use invalid ARIA roles

Fix reference | BarrierScan

What it is

Elements have a role attribute with a value that is not a real ARIA role (a typo or invented name), so assistive technology ignores it.

Who it blocks

Screen reader users miss whatever semantics the author intended the role to convey.

How to fix it

Replace the invalid role with a valid one from the ARIA specification, or remove the attribute if a native element already provides the semantics.

Example fix

<!-- Before -->
<div role="navigation-menu">...</div>

<!-- After -->
<nav aria-label="Main">...</nav>

This is one of the barrier types BarrierScan checks for on every scan. Request a free accessibility scan to see whether it appears on your site, alongside the rest of the automated findings.