Use the in-page navigation component only on a page where content is long. It provides users with a persistent, anchored overview of the page's structure. By exposing H2-level headings as a fixed list of jump links, it allows users to assess the full scope of the content at a glance and move directly to the section most relevant to them.
Do's
- use for pages with three or more H2-level sections
- place the component in a consistent position on long-form pages - to build a predictable navigation pattern across the site
- write section headings (H2s) that reflect the user's goal or question, not just the content category (e.g. "How to apply" rather than "Application procedure")
- use H2s that are short, distinct, and meaningful in isolation
- ensure the headings, when read as a list, tell a coherent story about the page's content
Don'ts
- restrict links to H2 headings only - nesting deeper levels creates visual noise and undermines the component's role as a high-level orientation tool
- do not rely on the in-page navigation to compensate for poor page structure; if the headings are weak or the content is poorly sequenced, address that issue first
When to use
- use for long-form, single-topic pages with multiple sections (e.g. policy explainers, guidance documents, procedure overviews, etc.), where a user may want to jump to a specific section rather than read sequentially from top to bottom
- on pages where users are likely to arrive with a specific intent. Where analytics or user research suggest different user groups seek different content on the page, the in-page navigation directly supports efficient access
When not to use
- do not use for short or lightly structured pages. If the page has only one or two H2s, or can be read in full without significant scrolling, the in-page navigation adds no value and introduces unnecessary clutter
- do not use the in-page navigation to link to content beyond the current page. It is an on-page way-finding, not a cross-site navigation tool. Instead, opt for the Menu, Mega menu, or Navigation list components