axe-core landmark-unique error: duplicate landmark roles

axe-core landmark-unique error: duplicate landmark roles - how to fix it

TL;DR

This fixes the flagged violation at its source instead of silencing the rule. The page has two or more landmarks with the same role and no distinguishing label. Follow the steps, re-run the scan, and gate the rule in CI so it stays fixed.

The error, verbatim

axe-core landmark-unique error: duplicate landmark roles

Fix it step by step

Step 1

Give each repeated landmark a unique aria-label or aria-labelledby, like Primary navigation vs Footer navigation.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 2

Or restructure so only one of each landmark type exists per page.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 3

Check the landmark list in axe DevTools: no two entries should share a bare role name.

Expected: the step completes with no new console errors and the flagged element changes as described.

Step 4

Re-run axe to confirm.

Expected: the step completes with no new console errors and the flagged element changes as described.

When to use this skill

• Your scan report lists this exact rule or failure
• You are clearing automated accessibility failures before release or audit
• A CI accessibility gate is red because of this item

When NOT to use this skill

• Top-level banner, main, and contentinfo should each appear once; duplicates need labels.
• The issue only appears in manual screen-reader testing and no automated rule flags it
• You are doing a full manual WCAG audit; this skill covers one automated check

Compatibility

axe-core 4.8+ (rule landmark-unique, WCAG 1.3.1).

Variant phrasings

axe landmark-unique: duplicate landmark roles

Same underlying issue and the same fix. Searchers phrase it different ways; the remediation does not change.

Why it happens

The page has two or more landmarks with the same role and no distinguishing label. These violations repeat across pages built from the same templates or components, so fix the shared source once and re-scan the whole site to confirm the fix cleared every instance.

Provenance

Resolved from the public thread: https://vectle.com/posts/pst_vodI2zApB69WOwd7zPe1jQ

Resolved from the public thread: https://vectle.com/posts/pst_vodI2zApB69WOwd7zPe1jQ

Thread query: axe-core landmark-unique error: duplicate landmark roles

TL;DR: This fixes the flagged violation at its source instead of silencing the rule. The page has two or more landmarks with the same role and no distinguishing label. Follow the steps, re-run the scan, and gate the rule in CI so it stays fixed.