How to fix landmark complementary is top level on Adobe Commerce (Magento)

Steps for Adobe Commerce (Magento)

1. In your Magento admin, go to Content → Design → Configuration → select your store view → Edit, and note the active theme.
2. Via FTP/SFTP or the admin theme editor, navigate to `app/design/frontend/[Vendor]/[theme]/` and locate the relevant layout XML file (e.g., `Magento_Catalog/layout/catalog_product_view.xml` for product pages or `Magento_Theme/layout/default.xml` for sitewide layout).
3. In the layout XML, find the block or container that renders the sidebar (`sidebar.main` or `sidebar.additional` containers). Check whether it is declared inside the `main` container in the XML hierarchy.
4. Move the sidebar container declaration in the XML to be a sibling of `main`, not a child — update the `parent` attribute or restructure the container nesting in the XML.
5. In the corresponding `.phtml` template file (e.g., `Magento_Theme/templates/root.phtml` or a page-specific template), ensure the `<aside>` tag wrapping the sidebar renders outside the `<main>` element and add `aria-label="Sidebar"` to the `<aside>`.
6. Run `bin/magento cache:clean` and `bin/magento setup:static-content:deploy`, then validate with axe DevTools on the storefront.

What is landmark complementary is top level?

Landmarks are special HTML "signposts" that screen readers use to let users jump directly to major sections of a page — the header, main content, navigation, footer, and sidebars. The "complementary" landmark (created by an `<aside>` tag or `role="complementary"`) is meant to mark supporting content that stands on its own alongside the main content, like a sidebar, related-links panel, or promotional widget. The WCAG rule "landmark-complementary-is-top-level" fires when that `<aside>` is placed inside another landmark (for example, inside a `<main>`, `<header>`, or `<section>` with a role), rather than sitting directly inside the `<body>` at the top level of the page.

Screen reader users — including customers with visual impairments — rely on landmark navigation to quickly skip around a page without listening to everything. When a complementary landmark is buried inside another landmark, screen readers either misreport its purpose or completely hide it from the landmark list, making it impossible for these users to find your sidebar content (promotions, related products, trust badges, support widgets) efficiently. This is a WCAG 2.1 Success Criterion 1.3.6 (Identify Purpose) and best-practice landmark structure issue, and repeated accessibility failures create legal exposure under laws like the ADA (US), EAA (EU), and AODA (Canada). Fixing it improves the experience for the roughly 7 million screen reader users in the US alone, reduces legal risk, and signals to Google that your page is well-structured.

See the complete Landmark complementary is top level guide for every platform and the full background.