| UI or UX | UI + UX - Persistent utility controls separated from destination navigation | UI + UX - Persistent top-level navigation shell | UI + UX - Service-scoped identity and navigation strip |
| UI guidance | Render utility controls such as search, help, notifications, profile, account settings, language, product switcher, and sign out as a visually distinct utility group rather than as peer primary destinations. | Render product or service identity, a compact set of top-level destination links, current-section state, separate utility controls, and responsive overflow behavior. | Render the service name, service-home link, a compact set of service-level links, current or active service state, and any service-level tools in a navigation strip below the general site or platform header. |
| UX guidance | Use utility navigation to keep session, support, discovery, account, and cross-product tools reachable from many pages without changing the user's current destination or local work state. | Help users move between major product or service areas while preserving orientation, local state, and confidence that they are in the right service. | Use service navigation to reassure users that they are inside the right service and to let repeated or multi-task users move among the most important service areas. |
| Good UI | A product header shows Dashboard, Projects, and Reports as primary links, while Search, Help, Notifications, Account, and Sign out sit in a separate utility group. | A header shows the product name, Dashboard, Projects, Reports, Billing, a More overflow, and separate Help and account controls. | A benefits service shows the GOV.UK header above a light service strip with 'Apply for support', Overview, Applications, Messages, and a Welsh language link. |
| Bad UI | A nav row lists Home, Cases, Help, Sign out, Alerts, Profile, Reports, and Billing as equal section links. | A crowded row mixes every page, account action, language selector, and sign-out link. | The service strip mixes GOV.UK topics, start-page links, sign out, Help, local page anchors, and admin tools as equal destinations. |
| Good UX | A user opens Notifications, reviews three unread items, the badge clears, and the current Projects section remains selected. | Users switch from Projects to Reports, return to Projects, and find their project draft count preserved. | A caseworker switches from Applications to Messages and returns to Applications with draft progress and filters preserved. |
| Bad UX | Clicking Help changes the current nav highlight to Help while the main content remains Projects. | Switching top-level sections clears filters or drafts without notice. | A linear eligibility check exposes service navigation that invites users to leave before completing the required questions. |
| Best fit | Users need persistent access to support, search, account, notifications, language, switching, or sign-out controls. | Users revisit several top-level product or service areas. | A named service is used repeatedly by some users. |
| Avoid when | The control is a primary destination such as Dashboard, Projects, Reports, or Applications. | The flow has a single ordered transaction where navigation would distract or cause abandonment. | The journey is a simple end-to-end transaction with a clear sequence. |
| Required state | Default state with destination navigation and a separated utility group. | Default state with product or service identity and top-level links. | Default state with general header, visible service name, service-home link, and service navigation links. |
| Accessibility burden | Label the utility group separately from primary or service navigation. | Use a labeled navigation landmark for primary navigation. | Use a correctly labelled service information region or navigation landmark that reflects the service name and link list. |
| Common misuse | Treating help, search, profile, notifications, and sign out as primary navigation destinations. | Listing every page or admin object in the global nav. | Using service navigation as a site map for every page in the service. |