` element or a `

` element), screen readers present it as a subordinate section rather than a top-level region of the page. This breaks the expected page structure and makes it significantly harder for blind and deafblind users to orient themselves. Instead of finding the banner at the top level of the landmark tree, they encounter it buried within another region, which undermines the purpose of landmarks entirely. This rule is a Deque best practice for accessible landmark structure. While it doesn't map to a specific WCAG success criterion, it directly supports the principles behind [WCAG 1.3.1 Info and Relationships](https://www.w3.org/WAI/WCAG21/Understanding/info-and-relationships.html) (ensuring structural information is programmatically determinable) and [WCAG 2.4.1 Bypass Blocks](https://www.w3.org/WAI/WCAG21/Understanding/bypass-blocks.html) (providing mechanisms to skip repeated content). ## How to Fix It 1. **Identify the banner landmark** — Look for any `

` element that is a direct child of `` (which automatically has the `banner` role) or any element with `role="banner"`. 2. **Check if it's nested** — Determine whether the banner is contained inside another landmark element such as `

`, `

` (with an accessible name), or any element with an ARIA landmark role. 3. **Move it to the top level** — Restructure your HTML so the banner landmark is a direct child of ``, outside of any other landmark. Keep in mind that a `

` element only has the implicit `banner` role when it is **not** nested inside `

`, `

`, or `

`. When nested inside those elements, `

` has no implicit landmark role and won't trigger this rule. However, if you explicitly add `role="banner"` to a nested element, or if your page structure inadvertently places the top-level `

` inside another landmark, the issue will be flagged. ## Examples ### Incorrect: Banner Nested Inside Main Landmark In this example, the `

` with `role="banner"` is placed inside `

`, making it a nested landmark. ```html

Main content goes here.

``` ### Incorrect: Banner Inside a Navigation Landmark ```html

Main content goes here.

``` ### Correct: Banner as a Top-Level Landmark The `

` is a direct child of ``, making it a proper top-level banner landmark. ```html

My Website

Main content goes here.

``` ### Correct: Using `role="banner"` at the Top Level ```html

Main content goes here.

``` Note that using the native `

` element is preferred over `role="banner"` on a `

`, since native HTML semantics are more robust and widely supported.