Primary vs secondary navigation: what goes where

Key takeaways

Primary navigation is the main menu holding the pages most visitors come for: services, prices, proof, about and contact. Secondary navigation covers everything else: utility links such as login and search, section menus within a topic, contextual links in copy and the footer. Keeping them distinct stops the main menu growing until nothing stands out.

• Primary: the pages most visitors need to decide.
• Secondary: utility tools such as login, basket and search.
• Primary: one site-wide menu of about five to seven items.
• Secondary: section menus, breadcrumbs, contextual links and the footer.

What is primary navigation?

Primary navigation is the site-wide main menu, usually across the top of every page, linking to the sections that matter most to most visitors. On a business site that usually means services, prices or fees, projects or reviews, about and contact. It is the map of what the business offers.

• How clear website navigation improves user experience
• How many menu items should a website have?

What counts as secondary navigation?

Secondary navigation is any navigation that is not the main menu. Each type has a job.

• Utility navigation: login, basket, search, language, phone.
• Section or local navigation: pages within one topic.
• Breadcrumbs: the path from the homepage.
• Contextual links: links within page copy.
• Footer navigation: policies, careers, sitemap, contact details.

• Utility navigation: login, basket and search, out of the way
• Section navigation: help visitors move within a topic

How do you decide what goes where?

Ask how many visitors need the page and when. If most visitors need it to decide, it goes in the primary menu. If a minority need it occasionally, it goes in the footer. If visitors need it only while in a section, it goes in section navigation. Tools go in the utility area.

• Website footer design: what to include and leave out

How should the menus look different?

Visitors should be able to tell the menus apart. Primary items are the largest and most prominent. Utility links are smaller, often top right. Section navigation sits beside or above the content. Footer links are compact. Using one style for all of them makes visitors read everything to find the main routes.

What are the common mistakes?

The common mistakes are putting careers, news and policies in the main menu, duplicating the whole main menu in the footer with nothing else, hiding login inside a dropdown, and mixing tools and pages in one row. Each blurs the line between what most visitors need and what a few do.

What does this look like in practice?

A pattern we see: a main menu of nine items includes 'Careers', 'Privacy', 'Client login' and 'News'. Moving login to the utility area and the rest to the footer leaves five primary items that describe the business.

• See client work
• Website Design & Development for UK businesses

Primary and secondary checklist

• Primary: only pages most visitors need to decide.
• Utility: login, basket, search, language.
• Section menus on larger areas.
• Footer: policies, careers, contact details.
• Different visual styles for each.

• Flat vs deep site structure: which is easier to navigate?
• Breadcrumb navigation: does your website need it?

Next step

List every item in your main menu and mark which ones most visitors actually need.