Skip to content

Page regions

Applies to

  • Websites

Overview

Most web pages have an overall structure that is consistent with other web pages. For example, they tend to have a banner with branding and other high-level content, one or more lists of links for navigation within the website, a section where the main content resides, and a footer. Many pages also have a sidebar with complementary content, and a section of the page dedicated to search. All users benefit from a consistent, predictable page structure as it helps them to easily find content that typically can be found within these page regions.

For sighted users, page regions can easily be located by visual cues. They are typically positioned in predictable places, and often have a background color or border that differentiates them from surrounding content.

Screen reader users need to understand the page structure just like everyone else.  If page regions are coded properly, screen reader users can understand the overall structure of the page, and can easily jump directly to a specific page region. There are two methods for coding web pages in a way that explicitly identifies these common page regions. Both are described on the Techniques page, linked in the following section.

Techniques

WCAG 2.1 success criteria

The issues described on this page, and associated Techniques pages, map to the following success criteria in the W3C’s Web Content Accessibility Guidelines (WCAG) 2.1: