Replacement record: Page structure and navigation
This record explains how four Drupal 7 theming pages were consolidated into the proposed current documentation page, Page structure and navigation. It also provides a short archival notice for each Drupal 7 page.
Pages replaced
| Drupal 7 page | Disposition |
|---|---|
| Creating accessible site and page navigation | Navigation, link, keyboard, and current-location guidance retained and updated. |
| Creating accessible structure and markup | Semantic structure, page titles, language, reading order, focus, and table guidance retained and updated. |
| Providing a way to skip navigation | The purpose of skip links was retained. Drupal 6 and Drupal 7 code was replaced with the verified Drupal 11 core implementation. |
| Using headings to improve accessibility | Heading guidance retained and corrected to avoid overstating WCAG requirements. |
What was retained
- Use semantic HTML to communicate page structure.
- Provide descriptive page titles, headings, links, and navigation labels.
- Keep source order meaningful and preserve visible keyboard focus.
- Provide a way to bypass repeated content.
- Use table headers and associations for tabular data.
- Test navigation without a pointing device.
What was updated or added
Drupal 11 implementation
The new page includes a Drupal-specific example only where current core provides a stable implementation. The skip link and its target were copied from Drupal 11 core's default html.html.twig and page.html.twig templates. The text explains that a theme overriding either template must preserve both parts or provide equivalent behavior.
The new page also identifies head_title, html_attributes, and template attribute preservation because these are current Twig mechanisms. It does not translate Drupal 7 PHPTemplate examples into speculative Twig.
Landmarks and regions
The four source pages predate widespread use of native HTML landmark elements. The replacement adds current guidance for header, nav, main, aside, and footer. It requires distinct names for multiple navigation regions and explains that landmarks complement, rather than replace, headings and skip links.
Navigation components
The replacement distinguishes ordinary website navigation from the ARIA application menu pattern. It adds disclosure-button behavior, aria-expanded, separate link and disclosure controls where necessary, aria-current="page", responsive states, and breakpoint testing.
Focus and responsive layouts
The new page treats DOM reading order, visual order, and keyboard focus order as related requirements. It adds CSS Grid and Flexbox reordering, reflow, responsive navigation, focus return, and focus not obscured. These are common current implementation risks that the Drupal 7 pages do not cover.
Repeatable testing
The replacement provides a compact test list covering keyboard operation, skip-link behavior, headings, landmarks, links, responsive states, zoom, focus visibility, tables, and automated checks. Automated testing is presented as partial coverage, not proof that the page is accessible.
What was removed or corrected
| Old material | Change and reason |
|---|---|
Drupal 6 and Drupal 7 PHPTemplate examples, including page.tpl.php, html.tpl.php, $primary_links, and $search_box |
Removed. These APIs and templates are unsupported and should not be adapted for a current Drupal site. |
| Named anchors and lengthy dynamic PHP skip-link generation | Removed. Current core already provides a translated link to a stable ID and a programmatically focusable target. |
| IE7, WebKit, clipping, negative-positioning, and other historical skip-link workarounds | Removed. They solve obsolete browser problems and are harder to maintain than Drupal's current utility classes. |
| Suggestions to conceal a skip link by using the same text and background color | Removed. Concealing focusable content this way creates a barrier and may fail contrast and focus-visibility requirements. |
A hidden h2 presented as necessary for navigation because of old assistive-technology limitations |
Corrected. A visible heading may help everyone, and an accessible name is required when multiple navigation landmarks need to be distinguished. Hidden headings are not a universal requirement. |
| The implication that every navigation group must use list markup for screen-reader support | Corrected. Lists are appropriate when the items form a list. Native nav supplies the landmark semantics. |
The claim that every page must have exactly one h1 and must never skip a heading level |
Corrected. WCAG requires meaningful structure, not exactly one h1. Logical nesting is recommended, but a skipped level is not automatically a WCAG failure. |
title attributes as the repair for unclear link text |
Removed. The attribute is not consistently exposed. The visible label and accessible name should communicate the purpose. |
The table summary attribute |
Removed. It is obsolete in HTML. Use a visible caption or nearby text for essential context. |
| XHTML examples and links to obsolete language-code references | Removed. Current HTML and Drupal's html_attributes mechanism provide the relevant implementation. |
| Audio CAPTCHA as the principal alternative to a visual CAPTCHA | Moved out of this page. CAPTCHA is a form and authentication issue, and an audio-only alternative does not address all users. Current guidance belongs in the forms documentation. |
| "Non-traditional navigation devices" and the suggestion that people with mobility disabilities may use solely the Tab key | Rewritten. Current testing covers keyboard, touch, speech input, magnification, and screen readers without reducing disability to one device or keystroke. |
Content mapping
| Current section | Primary source material |
|---|---|
| Start with semantic HTML | Creating accessible structure and markup; navigation list guidance from Creating accessible site and page navigation. |
| Provide a useful page title and language | Creating accessible structure and markup, updated for current Drupal Twig. |
| Identify page regions | Navigation and structure concepts from two source pages, expanded using current HTML landmarks. |
| Create a useful heading structure | Using headings to improve accessibility, with WCAG claims corrected. |
| Preserve Drupal's skip link | Providing a way to skip navigation, with all old implementation code replaced by verified Drupal 11 core templates. |
| Build predictable navigation and Write useful links | Creating accessible site and page navigation plus related link guidance from Creating accessible structure and markup. |
| Keep reading order and focus order meaningful | Source-order and focus guidance from Creating accessible structure and markup, expanded for responsive CSS and WCAG 2.2. |
| Mark up data tables | Creating accessible structure and markup, with obsolete summary guidance removed. |
| Test the rendered page | Keyboard test from Creating accessible site and page navigation, expanded into a repeatable current review. |
Copy-ready archival notices
Each Drupal 7 page can use the same short notice. The distinct headings below make it clear which source page the notice belongs to.
Creating accessible site and page navigation
<p><strong>This Drupal 7 page is no longer supported.</strong> See <a href="/docs/getting-started/accessibility/page-structure-and-navigation">Page structure and navigation</a> for current guidance. Drupal 7 reached end of life on 5 January 2025. See <a href="/about/drupal-7/d7eol/partners">Drupal 7 support options</a> if you still maintain a Drupal 7 site.</p>Creating accessible structure and markup
<p><strong>This Drupal 7 page is no longer supported.</strong> See <a href="/docs/getting-started/accessibility/page-structure-and-navigation">Page structure and navigation</a> for current guidance. Drupal 7 reached end of life on 5 January 2025. See <a href="/about/drupal-7/d7eol/partners">Drupal 7 support options</a> if you still maintain a Drupal 7 site.</p>Providing a way to skip navigation
<p><strong>This Drupal 7 page is no longer supported.</strong> See <a href="/docs/getting-started/accessibility/page-structure-and-navigation">Page structure and navigation</a> for current guidance. Drupal 7 reached end of life on 5 January 2025. See <a href="/about/drupal-7/d7eol/partners">Drupal 7 support options</a> if you still maintain a Drupal 7 site.</p>Using headings to improve accessibility
<p><strong>This Drupal 7 page is no longer supported.</strong> See <a href="/docs/getting-started/accessibility/page-structure-and-navigation">Page structure and navigation</a> for current guidance. Drupal 7 reached end of life on 5 January 2025. See <a href="/about/drupal-7/d7eol/partners">Drupal 7 support options</a> if you still maintain a Drupal 7 site.</p>Sources checked
- Drupal 11 core: html.html.twig
- Drupal 11 core: page.html.twig
- Drupal: Using attributes in templates
- Drupal: Hide content properly
- W3C: Page Structure Tutorial
- W3C: Page Regions
- W3C: Headings
- W3C: Menus Tutorial
- W3C: Tables Tutorial
- W3C: Understanding Bypass Blocks
- W3C: Understanding Focus Not Obscured (Minimum)