Hamburger Menus are Spoiling Desktop Websites
Written by Nathan Bolton
An emerging trend in web design is to hide navigation behind a toggle. This toggle button is usually the hamburger menu, which looks like a stack of three horizontal lines. This technique is becoming understood by mobile users, but it’s a problem when applied to desktop sites.
Hamburger menu woes
Usability studies by the Nielsen Norman group show that hidden navigation significantly slows down desktop users. Some users even fail to notice the navigation. Your website represents your business online, so every second counts. Making your visitors slog through unfriendly navigation will discourage them from further interaction with your site.
Different platforms need different techniques
Many sites are now designed mobile-first to create the best possible experience for handheld devices. This can be great, but it starts to cause a problem when all mobile practices are applied to the desktop. Desktop users have a lot more screen real estate to interact with, so hiding your menu behind a tiny icon makes it much more difficult to notice.
Best practice for desktop designs is to show top-level links in the main navigation. And make sure that navigation is always visible. This gives your users an at-a-glance view of the main areas of your site. It’s also much faster for them to use.
Mobile devices are a better home for the hamburger menu. Screens are smaller, so it can be a necessity to hide navigation behind a toggle. Fortunately, this technique has become ubiquitous enough that mobile users understand it.
Like most web design patterns, hiding your navigation behind a hamburger menu isn’t always bad. But it can be a poor decision depending on the context. Mobile and desktop users interact with the web differently. Websites need to accommodate both audiences.