As part of our mission to make GOV.UK work harder for users, we have been looking closely at how we can make navigation on the site work better.
This has been integral to the piece of work we previously called Finding Things, and which is now called Group and Transform Content. We’ve been looking at how the navigation on GOV.UK can be improved and how it can align with a new taxonomy on the site, to make it easier for users to quickly find what they need.
We’ve implemented three significant changes:
- a consistent breadcrumb across all pages
- organising topics in a grid, where appropriate
- an accordion design that makes it easier for users to quickly check what content sits under each topic
Breadcrumbs to show the user where they are
We’ve introduced a breadcrumb list at the top of each page. This helps users understand the levels of content on the site. The breadcrumb lists also show the page the user is currently on, to help them understand where they are within the site.
In our research we found that people were using the breadcrumbs to navigate around the prototype. We found that they used them to go back one step, or even to go back to the homepage if they felt they were too deep into the website.
Users are now able to navigate from a piece of content to the other parts of the site using either the breadcrumb link or the topics in the sidebar.
On mobile view we only show the parent topic, so as not to affect usability.
A grid system for large amounts of content
One of the main design challenges we had on the new topic pages - starting with the education topic page - was the sheer volume of content.
The grid is a way of subdividing large amounts of content. We’ve used it on landing pages so that the user can more easily navigate the content when they see it for the first time.
In user research we found that the grid system meant people were able to quickly scan at a high level and navigate to the correct content.
We’ve also been working closely with publishers across departments to make sure that the titles and descriptions used on content are clear and easily understandable for users.
Testing and iterating the accordion pattern
We looked at several ways to make it easier for users to scan through large amounts of content. We carried out testing on 2 elements - the anchor link and the accordion.
The anchor link shows a list of the subtopics at the top of the page, letting users see the content in the topic without having to scroll.
The accordion lets users see all the subtopics in a list and click to open the list in place.
We tested and iterated an accordion design that had originally been developed by the Service Manual team and found that it was the best option for letting users scan through content.
When the user wants to explore something in more detail, they can click on one of the titles and a list of the guidance in that section becomes visible.
In the Service Manual the accordion remembers which sections have been opened when users revisit the page. In our research we discovered this was confusing for our users as their patterns of navigating were different, and they lost the context of seeing all the headings when sections were left open.
We changed this behaviour and users were more successful at orienting themselves. The URL also changes when an accordion section is opened so users can still link to an open accordion section.
We’re continuing to track use of the accordion as we go into beta and will iterate as necessary.
Launching and assessing the new navigation
The new navigation is now live on GOV.UK, in A/B testing on the new education topic.
We’ve set up a performance framework so that we can track how well the navigation is working for users. We’ll be monitoring the results closely and iterating based on our findings.
If this new taxonomy and navigation performs well, we’ll look to roll them out across GOV.UK and bring in more topics and themes.