How to fix landmark unique on WooCommerce

Add a unique aria-label (or aria-labelledby) to every repeated landmark role on the page so screen-reader users can tell them apart.

Steps for WooCommerce

  1. Landmark HTML is output by your active WordPress theme (e.g. Storefront, Astra, GeneratePress), NOT by WooCommerce itself.
  2. If you are using a block theme (Full Site Editing), go to Appearance → Editor → Templates, open the template that contains the duplicate landmark (e.g. 'Single Product', 'Page'), click the block you want to label, open the Block Settings sidebar → Advanced, and add the aria-label in the 'HTML anchor' / 'Additional CSS class' area — or use a Custom HTML block to wrap it.
  3. For classic themes, go to Appearance → Theme File Editor (or use a file manager/FTP) and open the relevant template file (header.php, footer.php, sidebar.php, page.php). Locate the landmark tag and add aria-label='...' directly.
  4. If you cannot edit theme files safely, install a plugin such as 'Add Attributes to Blocks' or use a child theme's functions.php to hook into the output and inject the aria-label.
  5. After saving, run axe DevTools in your browser on the storefront to confirm each landmark is uniquely labelled.
Official WooCommerce documentation ↗

What is landmark unique?

Landmarks are special HTML regions — like `<nav>`, `<main>`, `<header>`, `<footer>`, `<aside>`, and `<section>` — that act as signposts for people using screen readers or keyboard-only navigation. When the same type of landmark appears more than once on a page (for example, two `<nav>` menus or two `<section>` blocks), each one must carry a unique label so users can understand what each region contains and jump directly to the right one. Without these labels, a screen reader will just announce "navigation" twice, with no way to tell which is which.

Screen-reader users rely on landmark navigation to skip around a page quickly — it's the equivalent of sighted users scanning headings at a glance. Duplicate, unlabeled landmarks force these users to listen through entire sections just to find what they need, creating a frustrating, unusable experience. This violates WCAG 2.1 Success Criterion 1.3.6 (Identify Purpose) and is flagged by automated accessibility checkers like axe. Depending on your market, failing WCAG 2.1 AA exposes your business to legal risk under the ADA (US), the European Accessibility Act (EU), and similar laws. Beyond compliance, accessible stores convert better — a broader audience can browse and buy without barriers.

See the complete Landmark unique guide for every platform and the full background.

Not sure if your WooCommerce store has this?

Run a free SEOLZ scan — we’ll find landmark unique and every other issue across your whole site.

Scan my site free

Fix landmark unique on another platform