How many items should be in a website's main menu?

There is no fixed rule, but fewer is usually better. Each additional item makes the others slightly harder to scan, especially on mobile. Include the routes that serve the tasks most visitors share and move secondary destinations to a utility menu, the footer or contextual links.

Are mega menus good for usability?

They can be, for sites with large catalogues or many audiences, because they expose many destinations with clear groupings and save clicks. They become a problem when poorly organised or overloaded, and they need careful adaptation for mobile. Most small service sites do not need one.

Should navigation open on hover or click?

Click or tap is safer. Hover menus fail on touch devices, can open accidentally as the cursor moves, and are hard for keyboard users. If you use hover on desktop, make sure click, tap and keyboard interaction all work too, and add a short delay to prevent accidental opening.

Do breadcrumbs help SEO?

Breadcrumbs help search engines understand a site's hierarchy, and breadcrumb structured data can be shown in search results. More importantly, they help visitors who arrive on deep pages see where they are and move up a level. They are most useful on sites with clear hierarchies of more than two levels.

How do I test website navigation?

Use tree testing to see whether people can find items in a text-only version of your structure, and first-click testing to see whether they choose the right starting point for a task. After launch, monitor internal search terms, navigation clicks and task completion, and compare them with the previous version.

Website Navigation: How to Design Menus People Actually Use

The main menu is the most contested real estate on a website. Every department wants a slot, and every slot added makes the others harder to find. The result on many sites is a menu that documents the organisation chart rather than helping anyone.

Treat the main menu as a statement of what most visitors most need. Everything else can live in secondary navigation, the footer, contextual links or search. This is a hard conversation internally, but it is the single most effective navigation decision you will make.

A menu item that serves everyone serves nobody; choose the few routes that matter most.

Step 1: Start from tasks, not pages

List the top tasks visitors come to complete. Use analytics (entry pages, most-visited pages, internal search terms), customer interviews and support queries. For an ecommerce site the tasks might be: browse a category, find a specific product, check delivery, track an order. For a B2B services firm: understand what you do, see relevant proof, find pricing or engagement models, get in touch.

Then map each task to where it begins on the site. The tasks that most visitors share belong in the primary navigation. Tasks for smaller groups, such as investors, job seekers or partners, usually belong in a utility menu or the footer. The underlying structure should already be defined by your information architecture; navigation exposes it.

Step 2: Choose the items and write the labels

Keep top-level items few enough to scan at a glance. There is no magic number, but each extra item makes the others slightly harder to see, and on mobile each one pushes the rest further down a list. If you have more candidates than space, group them or demote them.

Fig. 01 · Scorecard

Tap to explore

What makes a good navigation label

Bars show relative emphasis, not measured data

Weights indicate the relative emphasis we recommend, not measured data.

Avoid generic labels such as 'Solutions', 'Resources' or 'What we do' where a specific one would work. 'Services' is better than 'Solutions'; 'Accounting for freelancers' may be better still if that is your main audience. Avoid brand names for features unless visitors already know them.

Step 3: Pick the right pattern

Navigation patterns are tools, each suited to a different volume and type of content. Choose based on how many destinations you need to expose and how well visitors know what they want.

Fig. 02 · Comparison

Tap to explore

Simple menus versus mega menus

Simple or dropdown menuMega menu

Best forSites with a handful of sectionsLarge catalogues, multi-product or multi-audience sites

StrengthFast to scan, easy on mobileShows the breadth of the offer and shortcuts to deep pages

RiskHides too much if forced to carry a large siteOverwhelming if poorly grouped; heavy on mobile

Design ruleOne level of dropdown at mostClear group headings, no more content than needed

Mobile translationSimple list or short accordionProgressive disclosure, one level at a time

Large catalogues need mega menus; most service sites do not.

Other patterns support the main menu. Breadcrumbs show where a page sits in the hierarchy and help visitors move up a level; they also help search engines understand structure. Contextual links within content guide visitors to the logical next step. Footers hold secondary routes such as policies, careers and contact details, and are used more than many teams assume by visitors who have scrolled to the bottom looking for something specific.

Step 4: Design for mobile first

On phones the main menu usually collapses behind an icon. That saves space but hides choices, so keep the most important one or two routes visible outside the menu: a search field on ecommerce sites, a primary call to action on lead-generation sites. Make the menu itself easy to scan, with large tap targets and progressive disclosure rather than long nested lists.

Bottom navigation bars work well for sites and web apps with a few frequent destinations, because they sit within thumb reach. Sticky headers help on long pages but take space; keep them slim. See mobile-first design for the wider principles.

Step 5: Make the current location obvious

Visitors often arrive deep in a site from search or ads, not through the homepage. They need to know where they are and where they can go next. Highlight the current section in the menu, use breadcrumbs on deeper pages, make page titles match the label that led there, and give every page a clear onward path rather than a dead end.

Step 6: Test before and after

Navigation is cheap to test. Tree tests check whether people can find items in your proposed structure without visual design. First-click tests check whether people choose the right menu item for a task; a wrong first click usually means a longer and more frustrating journey. After launch, compare internal search terms, navigation click data and task completion with the old site.

Self-diagnostic

0/5

Is your navigation working?

Answer from evidence where you can.

01Can you name the top three tasks visitors come to complete?
If yes: Check that each has an obvious starting point in the main menu. If no: Research tasks before redesigning navigation.
02Do your most frequent site searches find things that are already in the menu?
If yes: Labels may be unclear. Rename items using searchers' words. If no: Good. Check whether frequent searches reveal missing sections.
03Does every top-level label use customer language?
If yes: Visitors will recognise their options. If no: Replace jargon and brand names with plain terms.
04Is the primary action visible on mobile without opening the menu?
If yes: Your key route is protected. If no: Surface it in the header or as a sticky element.
05Have you tree-tested or first-click-tested the structure?
If yes: You have evidence, not opinion. If no: Run a quick remote test before the next change.

On ecommerce and other large sites, the menu is only the first step. Category pages, filters and site search carry much of the navigation load. Filters should use the attributes shoppers actually choose by, show how many results each option returns, and never lead to empty pages. Site search should tolerate misspellings and synonyms and return useful results for category terms as well as product names. Watching search logs and zero-result queries is one of the cheapest ways to improve findability on a large site.

Common mistakes

Hover-only menus. They fail on touch screens and frustrate keyboard users. Menus should open on click or tap and be fully keyboard accessible.
Duplicate routes with different labels. Two menu items leading to the same page, or one label leading to different pages, erode trust.
Carousels as navigation. Rotating banners are a poor way to route visitors; most see only the first slide.
Navigation that changes between sections. Consistency lets visitors learn the site once.
Ignoring the footer. A well-organised footer is a second chance for visitors who did not find what they needed above.

Navigation also matters for web accessibility. Screen reader and keyboard users rely on semantic navigation landmarks, skip links and logical focus order. Build these in from the start.

Checklist

0/8

Navigation build checklist

Key takeaways

01The main menu is a statement of priorities; it should serve the tasks most visitors share.
02Labels must be recognisable, distinct and predictive, using customer language rather than jargon.
03Choose patterns by content volume: simple menus for most sites, mega menus for large catalogues.
04On mobile, keep the most important route visible outside the collapsed menu.
05Tree tests and first-click tests are cheap ways to validate navigation before and after launch.

Frequently asked

How many items should be in a website's main menu?: There is no fixed rule, but fewer is usually better. Each additional item makes the others slightly harder to scan, especially on mobile. Include the routes that serve the tasks most visitors share and move secondary destinations to a utility menu, the footer or contextual links.
Are mega menus good for usability?: They can be, for sites with large catalogues or many audiences, because they expose many destinations with clear groupings and save clicks. They become a problem when poorly organised or overloaded, and they need careful adaptation for mobile. Most small service sites do not need one.
Should navigation open on hover or click?: Click or tap is safer. Hover menus fail on touch devices, can open accidentally as the cursor moves, and are hard for keyboard users. If you use hover on desktop, make sure click, tap and keyboard interaction all work too, and add a short delay to prevent accidental opening.
Do breadcrumbs help SEO?: Breadcrumbs help search engines understand a site's hierarchy, and breadcrumb structured data can be shown in search results. More importantly, they help visitors who arrive on deep pages see where they are and move up a level. They are most useful on sites with clear hierarchies of more than two levels.
How do I test website navigation?: Use tree testing to see whether people can find items in a text-only version of your structure, and first-click testing to see whether they choose the right starting point for a task. After launch, monitor internal search terms, navigation clicks and task completion, and compare them with the previous version.

Published by Fabulous.Media, a network of specialist marketing agencies. Updated 9 October 2026. Platform features change often; check current official documentation before acting on platform-specific detail.