Navigation bar
The navigation bar pattern displays a horizontal navigation menu for pages related to the current page.
Rules for the navigation bar
- Must be present on all webpages, apart from long-form stories and web applications.
- Must come below the category header and above the breadcrumbs and main body of the page.
- Must not contain any dropdown menus.
- Must only contain links to other webpages or web applications.
- The link with highest priority should be placed at the left hand side, with other links following in order of importance.
- Link titles should be concise, with the list of links kept to a single horizontal row.
Options available
Primary navigation
The primary navigation menu is required on all top-level pages and must use the primary palette colour.
Code
Example
Primary and secondary navigation
The secondary navigation bar is required on all subpages of a section and must use the secondary palette colour.
Code