Aside must not be contained in another landmark

Complementary content is ancillary content to the main theme of a document or page. Screen reader users have the option to skip over complementary content when it appears at the top level of the accessibility API. Embedding an <aside> element in another landmark may disable screen reader functionality allowing users to navigate through complementary content.

Fixing the problem

This best practice rule ensures that aside elements or elements with role=complementary are not an internal part of another ARIA landmark. Nesting landmarks create confusing document structures. This rule is similar to existing rules that test this same ARIA requirement for the banner, contentinfo, and main roles.

Examples

The following example FAILS the Complementary landmarks are at the top level rule:

<main>
<p>Some text</p>
<aside><p>An aside</p></aside>
</main>

The following example PASSES the Complementary landmarks are at the top level rule:

<main><p>Some text</p></main>
<aside>An aside</aside>