Page Structure Concepts

Well-structured content allows more efficient navigation and processing. Use HTML and WAI-ARIA to improve navigation and orientation on web pages and in applications.

  • Page Regions: Identify and mark up regions on web pages using HTML5 and WAI-ARIA roles.

  • Labeling Regions: Label regions to allow users to distinguish and access them.

  • Headings: Add headings and nest them logically to label sections of web pages according to their relationships and importance.

  • Content Structure: Mark up the content on a page in a way that uses appropriate and meaningful elements.

Why is this important?

Pages with well-structured content are essential for many web users, for example:

  • People with cognitive and learning disabilities can more easily find and prioritize content on the page.
  • People using screen readers can skip to the main content directly and navigate to sections that are important to them.
  • Keyboard users can browse pages and their sections more efficiently. Otherwise, users have press the tab key multiple times to navigate through all links in each section.
  • People using software that only shows the main content of a web page, such as people with cognitive disabilities, will receive better results if the page structure is correctly marked up.
  • People with visual impairments, including people with low vision, have cues that provide orientation on the page and in the content.
  • Mobile web users often have access to a so-called “reader” or “reading” mode that will only show the main content of the page if it is correctly marked up.
  • People using certain browser plugins can use landmark roles to jump to specific sections on a page.
  • There are additional benefits to a good, accessible page structure, beyond those experienced by people with disabilities. As an example, search engines can use the data to better index the content of a page.

These tutorials provide best-practice guidance on implementing accessibility in different situations. This page combined the following WCAG 2.0 success criteria and techniques from different conformance levels:

Success Criteria: