Related Navigation
Component showing related content, including topics, guidance and collections
When to use this component
This is used on most content pages. Different page types include different types of related navigation. The most common ones are related content and collection links.
How it works
The component displays as a list of links to information related to the page. It sits in the right hand side bar next to the main content.
It can appear:
- by itself (usually in the sidebar)
- as part of the contextual sidebar (opens in a new tab) or contextual footer (opens in a new tab)
View this component in the Component Guide (opens in a new tab) and the Developer Docs (opens in a new tab).
The component can be used with a variation of contents listed below. Find out more in this report (opens in a new tab).
Related content
Related content links are either:
- created by the algorithm (currently broken)
- added by a content designer
Find out more in this report (opens in a new tab).
Document Collections
Collections appear under the related content section on specialist and mainstream content.
If a content item is part of a collection, the collection links appear in the right-hand column.
If the content item is part of multiple collections, all the collections are displayed.
Find out more in this report (opens in a new tab).
Explore the topic
Explore the topic shows the topics the content has been tagged to. This appears on mainstream content pages as well as specialist content pages. It is usually displayed in the Contextual Footer component. E.g. Mainstream guide: Pay your Corporation Tax bill: Overview - GOV.UK (opens in a new tab).
Find out more in this report (opens in a new tab).
Topical event
Gov publishers can add a link to a topic event page on the content page in Whitehall when needed. This can be done on most content types. Some examples are:
- Policy papers, e.g. Charter for Budget Responsibility: Autumn 2022 update (opens in a new tab)
- Detailed guides, e.g. National Mourning Guidance (opens in a new tab)
- Official statistics, e.g. National norovirus and rotavirus surveillance (opens in a new tab)
World locations
Can appear on certain content types such as news articles; taking users back to a World location news page for that country (opens in a new tab).
Statistical data set
Appears on certain specialist content types, such as some:
Elsewhere on the web
Appears on, for example:
- Mainstream smart answers, e.g. Find a job (opens in a new tab)
- Mainstream guides, e.g. Make, register or end a lasting power of attorney (opens in a new tab)
Other contacts
Appears on, for example Mainstream answers, e.g. contact pages like Employer PAYE and National Insurance: payments (opens in a new tab) and Self Assessment: general enquiries (opens in a new tab).
| Date | Description | Document | Format |
|---|---|---|---|
| December 2024 | Only GDS can remove automatic related links. This wiki entry explains how the algorithm generated links are updated by GDS content designers |
Wiki entry: Related links on Whitehall content (opens in a new tab) | GOV.UK wiki |
| April 2023 | A details analysis showed: 43% of all clicks are of the first related link - this shows that lots of users only click the first link in ‘Related content’ Most users do not click more than 3 links Some advisers (‘advise a thing’ users) struggle to grasp the distinction between related content and ‘also part of’ links |
Page-level navigation: analytics findings (opens in a new tab) | Google Docs |
| February 2023 | This report expains what related links are and how they are generated, both algorythmically and manually. |
Related links and how they are generated (opens in a new tab) | Google Slides |
| November 2021 | This research explored how users who advise others interact with and navigate GOV.UK content page. Users were found to have varied expectations for what “related content” might mean. The phrase “related content” means different things to users depending on their prior experience of the content and of other resources. “I do not know if these are maybe ones that have been recently clicked on by someone” “[related content] might be things that are referred to in that document that if you want more detail on, you click into those pages” “you need to click on all of these [related links] anyway, even if you do not understand what they are… because obviously there could be information there that you are missing that could help you”. |
GOV.UK Explore: page level nav (advisers) - Research round 5 (opens in a new tab) | Google Slides |
Accessibility criteria
Should have a role of ‘navigation’ on any navigation elements inside the component Should be marked up as navigation and not as tangential content
Links in the component must:
- accept focus
- be focusable with a keyboard
- be usable with a keyboard
- indicate when they have focus
- change in appearance when touched (in the touch-down state)
- change in appearance when hovered
- be usable with touch
- be usable with voice commands voice commands (opens in a new tab)
- have visible text
- have meaningful text
Existing issues with this component
- Accessibility: Landmarks should have a unique role or role/label/title (i.e. accessible name) combination (landmark-unique) (opens in a new tab)
- If the content is part of a collection, the collection page appears in the related content section and it’s not possible to remove this link. (opens in a new tab)
- We could create an 'escape hatch' from specialist to mainstream content for people who end up 'too deep' in GOV.UK content (opens in a new tab)
- There are too many things in the sidebar. Users tend to click on the top 3 links so there’s an opportunity to simplify (opens in a new tab)
- The algorithm to generate related content links for Whitehall content is broken (opens in a new tab)
- We should explore how effective or confusing related links are. Are they worth keeping? (opens in a new tab)
How to report an issue
If you happen to come across an issue:
- Report it on Github (opens in a new tab).
- Once the issue has been added, update this document by adding the title and Github Issue’s link.
- Give yourself a high-five.
Help improve this page
To help make sure that this page is useful, relevant and up to date, submit a GitHub issue (opens in a new tab) with your proposed updates.