Landmark regions are semantic HTML elements that define the major sections of a webpage: header, navigation, main content, aside, and footer. For sighted users, these regions are often invisible – they're just part of the visual layout. For screen reader users, landmark regions are essential navigation tools that allow them to jump directly to different sections of a page.

Think of landmark regions as the table of contents for your webpage. Just like you'd scan a book's table of contents to find relevant chapters, screen reader users scan landmark regions to understand page structure and jump to relevant content.

Most websites have poor landmark structure, making navigation frustrating for screen reader users who must read through content linearly to find what they need.

Header (`

Screen Reader Navigation: - R key: Jump to next landmark region - Shift+R: Jump to previous landmark region - D key: Jump to next landmark (alternative command) - Landmark list: View all landmarks on the page

Common Navigation Patterns: - Users often jump directly to main content to skip navigation - Users scan landmarks to understand page structure - Users return to navigation to move between pages - Users check footer for additional links and information

Multiple Navigation Regions: ```html

One Main Per Page: Each page should have exactly one main landmark region.

Descriptive Labels: Use aria-label to distinguish between multiple navigation or complementary regions.

Logical Order: Landmark regions should follow a logical reading order.

Consistent Structure: Use the same landmark structure across all pages on your site.

Skip Links: Provide skip links to jump directly to main content from the top of the page.

Test With Screen Readers: Verify that landmark navigation works as expected with actual screen readers.

Don't Overuse: Not every section needs to be a landmark – use landmarks for major page sections only.

WebAbility automatically ensures proper landmark structure, making your site easy to navigate for screen reader users while maintaining clean, semantic HTML structure.