Answer 19 of 50
Is the Hamburger Menu Really the Best Mobile Navigation Solution
Not as the only navigation. The hamburger menu works, and most users now recognize it, but hiding navigation means people use it less and can take longer to reach what they need. The approach the research supports is to keep your three to five most important destinations visible and let the hamburger hold everything else.
What the research shows
Two Nielsen Norman Group studies, nine years apart, cover the two questions that matter: do people use hidden navigation, and do they recognize the icon?
Use (2016). Kara Pernice and Raluca Budiu tested hidden navigation against visible and combined navigation with 179 participants on 6 websites, on phones and desktops:
| Measure | Hidden | Combo (some links visible, rest in a menu) | Visible |
|---|---|---|---|
| Navigation used, desktop | 27% of cases | 50% | 48% |
| Navigation used, mobile | 57% of cases | 86% | Not tested on phones |
| Extra time to use the navigation | 5 to 7 seconds on desktop, about 2 seconds on mobile | Baseline | Baseline |
| Task difficulty rating, both devices | 21% higher than visible, 11% higher than combo | Baseline for the 11% comparison | Baseline for the 21% comparison |
The differences in navigation use and difficulty were statistically significant; the time difference was only marginally significant in NN/g’s model. One limit matters for mobile decisions: the study did not test fully visible navigation on phones, only hidden against combo. On mobile, the evidence compares a hamburger alone with a hamburger plus some visible links, and the combination won.
Recognition (2025). Kate Kaplan’s review of hamburger-icon recognizability found that “today, most users recognize the hamburger menu and know what it means.” The same article cautions that this “doesn’t mean the hamburger menu is foolproof or universally understood” and that the study examined recognizability only, so it cannot say whether task time or success with hamburger menus has changed. Recognizing the icon and finding what is behind it are separate problems.
If you use a hamburger, use it well
Kaplan’s 2025 article lists practices that improved recognition:
- Use the standard three-line icon. In the study, a border around the icon led one participant to read it as a document.
- Place it in the top-left corner, where users look for hidden navigation.
- Label it “Menu.” In the article’s words, “A label is especially helpful for less-experienced users or when introducing the pattern in unfamiliar contexts.”
- Keep other three-line icons away from that corner, such as list-view or filter icons, which people may mistake for the menu.
When an icon needs a text label in general, beyond the menu button, is covered in when to use icons instead of text.
Make the button accessible too. Give it an accessible name; a visible “Menu” label can provide it. Treat it as a disclosure button: the W3C ARIA Authoring Practices disclosure pattern uses a button with aria-expanded set to true when the content is visible and false when it is hidden, so screen reader users know whether the menu is open.
How to decide for your site
| Question | If the answer is… | Lean toward |
|---|---|---|
| How many primary destinations do you have? | Three to five of similar importance | A tab bar or visible links for those, with a menu for the rest |
| One or two, or dozens | Visible links for the few that matter, with a menu as the overflow | |
| Who are your visitors? | Mostly first-time or occasional visitors | More visible navigation, because they have no reason to learn your patterns |
| Regular users of an app-like product | A hamburger or gestures for secondary items, since repeated use builds familiarity | |
| What do people mainly do? | Read a single feed or article | More screen space for content; a menu can hold the rest |
| Browse categories or compare products | Keep the categories visible |
The tab-bar range comes from platform guidance. Material Design’s original bottom navigation guideline says the bar “exposes the three to five top-level destinations of an app.” Apple’s Human Interface Guidelines for tab bars advise using a tab bar “to support navigation, not to provide actions”, including tab labels, and avoiding overflow tabs.
Combining patterns
The combination that won the 2016 mobile test is easy to build: keep the most important destinations visible and put the rest in the menu. A priority-based layout goes a step further, showing as many items as the screen allows and moving the least important ones into the menu as the viewport narrows, so the hamburger becomes an overflow container rather than the home of all navigation.
Choosing what stays visible takes three inputs: analytics on which sections people use most, research on what people expect to find immediately, and the business decision about which sections matter most. Two navigation patterns add some complexity, so make it obvious which items live where.
Gestures need a visible way in
Swiping from the edge or pulling down to reveal a menu keeps the screen clean, but nothing on the screen says the gesture exists. Users who do not already know it can miss it. An app that people use daily can teach a gesture over time; a website visited once cannot rely on one, so pair any gesture with a visible control.
Mobile web is not the same as an app
People who install an app have chosen it and use it repeatedly, so less conventional navigation can be learned. Website visitors arrive casually, and some visit only once, which argues for more visible, more conventional navigation on the mobile web. Progressive web apps that people add to their home screen sit in between and can lean toward app patterns once you see repeat use.
Test your own context
Measure task completion, time to reach key destinations, and menu open rates with your own users. A/B testing can compare a hamburger-only layout with a combined one if you have the traffic. Read open rates carefully: a low rate can mean people found what they needed on the page, or that they never noticed the menu. Task success tells you which. How to measure whether navigation as a whole is costing you visitors, with tree tests and search-after-browse data, is covered in how navigation complexity affects user drop-off.
Questions teams ask
Should we add “Menu” text to our hamburger icon?
Yes, unless you have tested without it and seen no difference. NN/g’s 2025 guidance recommends the label for less-experienced users and unfamiliar contexts, it costs little space, and it can serve as the button’s accessible name.
Can we use both a hamburger and a bottom tab bar?
Yes. Put the primary sections in the tab bar and secondary items, settings, and account links in the menu. That is the combined pattern, and it is the configuration that performed best on phones in the 2016 study.
Our users are young and tech-savvy. Does the discoverability concern still apply?
NN/g’s 2025 review found that most users recognize the icon, but the 2016 results were about using hidden navigation, not recognizing it. Familiar users may still explore less of what they cannot see. Observe your own users rather than assuming by age, and test before deciding.
Keep the three to five destinations people need most where they can see them, put the standard, labeled hamburger in the top-left corner for everything else, and confirm the choice with task success data from your own visitors.