LOWWCAG 4.1.2 A
Redundant ARIA
Native HTML semantics are overridden or repeated, increasing complexity without accessibility gains.
Try It Yourself
Demo warning
Redundant ARIA can add noise and confusion for maintainers and sometimes for assistive technologies.
Compare native semantic markup with the noisy ARIA-overloaded version to see unnecessary verbosity.
Native HTML (clean)
<button>Save</button>
<nav aria-label="Main">...</nav>Redundant ARIA (noisy)
<button role="button">Save</button>
<nav role="navigation" aria-label="Main">...</nav>Manual Testing Protocol
Follow this sequence to reproduce the failure consistently and verify the fix with the same workflow.
1. Setup
- Open markup comparison panel.
- Review native element behavior before checking ARIA-heavy variant.
2. Reproduction Steps
- Inspect duplicate roles on native semantic elements.
- Compare announcement output between native and redundant variants.
- Evaluate maintainability overhead in repetitive patterns.
3. Expected Failure Signals
- No user value added, but markup complexity increases.
- Potential inconsistent announcements in edge AT combinations.
- Developers may copy ineffective patterns across codebase.
4. Fix Verification
- Native semantics are used first, with ARIA only when required.
- Redundant role attributes are removed from semantic elements.
- Team patterns document when ARIA is truly necessary.
Evidence Capture Checklist
- Record the exact user goal that fails (for example: submit form, complete checkout, navigate menu).
- Capture screen recording + keyboard path from first interaction to failure state.
- Map failure to WCAG 4.1.2 (Level A) and affected user groups.
- Document business impact: conversion loss, support burden, legal/compliance risk, or trust damage.
The Impact
What Happens
- Code maintenance burden increases
- Team accessibility understanding erodes
- Potential announcement duplication appears
Who Gets Hurt
Engineering teams
Assistive technology users (in edge cases)
The Broken Code
<button role="button" aria-pressed="false">Save</button>
<nav role="navigation" aria-label="Main navigation">
...
</nav>
<!-- Native semantics already provide these roles -->WCAG 4.1.2: Reference
"For all user interface components, the name and role can be programmatically determined."
Level A - Clean semantic HTML should be the default. ARIA is a supplement, not decoration.
Related Low Issues
Explore neighboring failures in the same severity band.