When to use the hamburger menu?

2 minute read by Erin 'Folletto' Casali

hamburger-menu-no

“Hamburger menus are terrible at both of those things, because the menu is not on the screen. It’s not visible. Only the button to display the menu is.”

“The downside of being able to show a lot of options is that you can show a lot of options.”
— Mike Stern (2014) Designing Intuitive User Experiences

“The MENU button was clicked by 20% more unique visitors than the HAMBURGER button.”
— James Foster (2014) Hamburger vs Menu: The Final AB Test (web archive)

Both are excellent articles, I’d suggest you to read them.

I’d just add one data point from the second article:on both iOS and Android, both the hamburger menu and the “Menu” explicit button were clicked ZERO POINT something times.

This means that even if the “Menu” button was triggered 20% more times, we are still talking about an interaction that is below 1% of usage. Which pretty much gives us only one conclusion: hiding the menu under any kind of single menu button means basically hiding everything.

This shouldn’t be surprising… so why designers keep doing that?

This is said again by Mike Stern, Apple UX Evangelist, in the first article:

“People who use their app don’t switch to different sections very frequently when they use this menu.”

That’s all. Hamburger menu can be useful, but they are useful basically for all the extra options that you actually want to hide. All the uncommon tasks. All the things that you don’t expect the user to really use.

Note also this quote from an AMA with Matias Duarte, VP of Design at Google:

It’s pretty clear that “hamburgers” can be overused. It’s just too easy for someone trying to “clean up” their app to shove all that stuff in the drawer where it gets lost – out of sight and out of mind. However there are a lot of secondary functions that are really nice to tuck out of the way, so we tried to include it as a possible pattern with strong guidance around when it’s appropriate to use. Maybe we didn’t do a good enough job on that, and that’s one of the things you can expect us to keep doing with the spec going forward: making it clearer and easier to use.

So, even the argument “but Google Material advocates for that” is not valid.

More Sources

Erin 'Folletto' Casali 2014·08·21