The "hamburger" menu, the icon of three horizontal lines, has become the standard way to fit a website's navigation onto a phone screen. It is tidy, familiar and saves space. It also has one real drawback: whatever is inside it is out of sight.
The trade-off
Things people can see get used more than things they have to remember to look for. A visible link to "Prices" invites a tap; the same link hidden inside a menu relies on the visitor thinking "I wonder if they show prices" and opening the menu to check.
For most small business websites, that is fine for secondary pages. It is a problem when the thing hidden is the one action you most want people to take.
When a hamburger menu works well
- On phones, where there is no room for more than one or two links in the header.
- On sites with several pages of equal importance, none of which needs to stand out.
- When people know the icon: most visitors today recognise it, so it is not confusing in itself.
How to use it without hiding what matters
Keep the main action outside the menu. Your phone number, "Get a quote" or "Book a call" should sit in the header next to the menu icon, visible on every page. This single change matters more than the choice of menu style.
Link the key pages within the content. Service pages should link to each other, to your prices and to your contact page, so people can move around without opening the menu at all.
Keep the menu short. Five to seven clear items are easier to scan than fifteen. Group the rest in the footer.
Use plain labels. "Services", "Prices", "About", "Contact" work better than clever names.
Make it easy to close. A clear close button and a menu that does not trap people make it feel safe to open.
Alternatives worth considering
- A short visible menu on wider screens. On laptops there is usually room to show the main links directly; the hamburger can be kept for phones.
- A bottom bar on phones with two or three key actions, such as Call, Directions and Book, which suits businesses people contact on the go.
- Showing key links on scroll. Some sites reveal a few quick links in the header once the visitor starts scrolling.
What we do on our own site
Our own website uses a full-screen menu behind the three-line icon, because it keeps every page clean. The "Start a project" button sits next to it in the header on every page, so the most important action never hides behind the menu.
Not sure whether your navigation is helping or getting in the way? Our free website health check includes a few quick tests, or ask us to take a look.