Avoid deprecated ARIA roles

Accessibility isn’t only about avoiding violations — it’s about ensuring your product can be used confidently by everyone. This guide explains the principle of this rule, shows what goes wrong in real-world code, and provides a verified fix that meets WCAG and the European Accessibility Act (EAA).

Why this matters and how to fix it

Why this matters

Deprecated ARIA roles have been removed or replaced in newer versions of the WAI-ARIA specification. Continuing to use them can lead to inconsistent or incorrect announcements by screen readers because modern assistive technologies no longer recognize them. This can cause key interface elements to be skipped entirely or read with misleading semantics, reducing user trust and accessibility reliability.

How to fix this issue

Audit your codebase and component library for deprecated roles. Replace them with current equivalents defined in WAI-ARIA 1.2, or use native HTML elements that already provide the same semantics. Always verify behavior with multiple assistive technologies—such as NVDA, JAWS, and VoiceOver—to confirm that updated roles are announced consistently.

Automated detection · Manual review recommended

Developer guidance

Deprecated ARIA usage often appears in legacy code or copied UI patterns. Add automated checks in your accessibility testing pipeline to flag outdated roles early. When upgrading design systems, review ARIA mappings against the current spec to ensure forward compatibility. Keep a changelog of role updates so downstream teams know when old patterns are retired.


Code examples

Incorrect Implementation

<div role="directory"></div>

Correct Implementation

<div role="tree"></div>
eu icon getwcag

Trusted by organizations across Europe working toward WCAG and EAA conformance