Introduction to Page Structure

Summary

Web pages and documents with a clear structure and hierarchy are easy for people to understand. A good structure helps people scan content, find what they need, and determine where they are.

Page structure is created by elements like titles, headings, landmark regions, and summaries. These elements identify the purpose of each section, make content easier to scan, reveal relationships between different sections of content, and help people find information quickly.

Overview

Pages with a clear structure and logical hierarchy help people understand where they are, scan the content, and find what they need. They also help people understand the purpose of each section and how the sections relate to one another. Headings, landmark regions, bypass mechanisms, and other structural elements create a more consistent, intuitive, and accessible user experience.

The structure of a web page or document helps individuals:

• Explore and understand content.
• Orient themself on the page.
• Identify the main topic and purpose of the content.
• Identify the purpose of each section of content.
• Understand the organization and hierarchy of the content.
• Understand the relationships between different sections of content.
• Quickly locate needed information.
• Easily skip unneeded content.
• Explore content using the structural elements.
• Understand the reading order of the content.
• Reduce their cognitive load.

A meaningful structure consists of many elements:

Page Title

A descriptive page title lets people know where they are and tells them what the page is about.

Main Heading and Summary

A descriptive heading and text at the top of a page identifies its purpose so people can quickly understand the page’s purpose.

Headings

Headings organize content into sections and show how the sections relate to one another. Headings help people scan a web page or document so they can quickly understand the content and find the information they want. Headings also help people using assistive technology understand the content’s structure without relying on the visual layout.

Landmark Regions

Set up landmark regions strategically to help assistive technology users navigate to key sectioning elements like the header, footer, navigation regions, and main content.

Bypass mechanisms

Letting people bypass blocks of content helps them get to the information that interests them quickly. This mechanism primarily benefits people who use keyboards to interact with computers, as they cannot jump directly to a specific part of the page using a mouse.

• Navigational elements like skip links and landmark regions help meet this need for websites.
• Documents can use navigational aids like bookmarks to help people access needed content.

Frames

Providing descriptive titles for frames identifies the content contained within the frame. This makes it easier for people to find content within a frame and determine if they need it.

Reading order

People with visual disabilities depend on screen readers, which process content based on its order in the code. When web pages encode content in a logical order, it ensures that people can consume the information in a reading order that makes sense.

Letting people bypass blocks of content helps them get to the information that interests them quickly. Accessibility guidelines do not require one specific method. You can use skip links, headings, landmark regions, and other navigation methods because each one supports different needs.

Headings

Support everyone, but are especially helpful for people with cognitive and learning disabilities and people using assistive technology.

Landmark Regions

Primarily support people using assistive technology.

Frame/iframe titles

Primarily support people using assistive technology.

Skip links

Primarily support sighted keyboard navigators.

Navigational elements like skip links and landmark regions help meet this need for websites. For documents, you can use navigational aids like bookmarks to help people access needed content.

Who is Helped

• Clear, concise page titles tell people which page they are on and let them quickly decide whether to read it or switch to a different page.

  • Titles help people who use assistive technologies like screen readers and people with cognitive and learning disabilities.

• Top-level headings and summaries that identify the purpose of a page make it easier for people to decide whether they want to read a page.

  • These elements can help people with cognitive and learning disabilities understand content.
  • They can also help people with visual and motor disabilities by making it easier to skip irrelevant content and avoid unnecessary effort.

• Headings help everyone scan content and understand how it is organized.

  • People who are blind and using a screen reader rely on headings as a primary means of orientation and navigation.
  • People with motor-skill or dexterity-related disabilities who rely on voice control or other alternative input devices may also depend on headings for orientation and navigation.
  • People who are neurodivergent often leverage headings to obtain needed organizational and wayfinding cues.
  • Recognizable headings also help people with low vision locate and orient themselves within a page.

• The ability to bypass blocks of content, especially redundant content like menus, helps most people who are keyboard navigators.

  • Skip links let keyboard navigators, especially sighted keyboard navigators, jump to key content areas.
  • Landmark regions let screen reader users jump directly to important structural areas of a page.

• A correctly structured page improves people’s navigation and wayfinding.

  • People who are blind or have low vision can navigate and find information easily using screen readers. For example, well-defined titles help people orient themselves and understand the hierarchy of content.
  • People who have difficulty using the mouse can easily navigate using the keyboard. Jump links and bookmark regions make it easy to navigate without requiring precise pointer actions.
  • For people with cognitive disabilities, navigation and wayfinding become much easier. For example, clear headings can help them follow the structure of the content text.

• Providing descriptive titles for frames helps people in their search for needed information.

  • People with visual disabilities benefit from frames with descriptive title as the title tells them what to expect from the content in the frame. This functionality makes it easier to find needed content when it is embedded within a frame.

• The reading order makes it easy to navigate people the content.

  • Blind or low-vision individuals who rely on screen readers to access content can hear information presented coherently and understand the context of the web page more effectively.
  • People who have difficulty processing complex information or following complicated instructions can benefit from a clear, logical reading order.

Ultimately, having a clear structure for web pages and documents provides better wayfinding cues for everyone.