Rule ID: ace-landmark-single-main

Check that the page contains no more than one main landmark region

Blind Deafblind Mobility Best Practice

What This Rule Checks

The role=”main” ARIA landmark identifies the primary content of a page. Only one role=”main” element should exist on each webpage to avoid confusion for screen reader users. If duplicate main landmarks are present, it becomes difficult for assistive technology users to distinguish which content is the main focus.

Who Is Affected

This issue primarily affects: Blind users, who rely entirely on screen readers or braille displays to navigate and interact with content; Deafblind users, who rely on braille displays and cannot access visual or auditory content; Mobility users, who navigate using keyboards, switches, voice control, or other assistive input devices.

Why This Matters

The main landmark should identify the single primary content area. Multiple visible main landmarks make it unclear which contains the content the user is looking for.

How to Fix

To avoid duplicate main landmarks, make sure there is only one role=”main” or <main> element per page. Each iframe on the page should either have no role=”main” landmarks or only one.

Best Practice for Using HTML5 and ARIA Landmarks: It’s recommended to use both HTML5 landmarks (such as <header>, <nav>, <main>, and <footer>) and ARIA landmarks (role=”banner”, role=”navigation”, role=”main”, and role=”contentinfo”) to improve compatibility with various assistive technologies. This approach ensures the page content is divided into clear, navigable sections.

Code Examples

Incorrect Markup Solutions:
Code example
<!-- Multiple main landmarks --> <main> Primary content </main> <main> Secondary content </main> Copy
Code example
<!-- Single main landmark --> <main> <section> Primary content </section> <section> Secondary content </section> </main> Copy

Common Mistakes to Avoid

  • Having multiple <main> elements visible at the same time.
  • Not hiding alternate main regions with the hidden attribute when only one is active.

Tip: Landmark regions let screen reader users jump directly to key sections of a page. They serve as the accessibility equivalent of a table of contents for page layout. Label landmarks when multiple of the same type exist.