A lot has been said about the drawbacks of hamburger menus, and we've been seeing a lot of mobile apps moving away from this navigation model in favor of a nav bar (recent example).

In general, I'm in agreement with the thesis behind these arguments, but I'm curious why we haven't seen this trend on the mobile web. Is it just a matter of designers concerned about bucking convention (or finding via AB testing/screen recordings that doing so confuses users)? Are the more complex navigation structure of large websites less appropriate for the nav bar treatment? (I'm not completely convinced this problem is too hard to solve.)

If anyone has examples of content-heavy sites (ecommerce, journalism) that have successfully used an alternative to the hamburger navigation, I'd love to see them. I've seen some that use menus that supplement the hamburger navigation (Sephora and Keep.com are two that come to mind), but I'm pretty sure I've yet to see a site where the hamburger menu is completely supplanted.

  • 4
    well, if Spotify is a good UX example we're doomed :(
    – Devin
    Commented May 4, 2016 at 17:00
  • Maybe they and their community are very happy with their design? Or maybe their user community never use the hamburger menu and the company is happy with that?
    – SteveD
    Commented May 5, 2016 at 9:58
  • I feel this question isn't asked from an objective standpoint.
    – MJB
    Commented May 6, 2016 at 9:41
  • @MJB Curious why you feel that it isn't so...could you explain?
    – dekaliber
    Commented May 6, 2016 at 16:15

2 Answers 2

  • Hamburger menus, like it or not, are widely recognized
  • Inertia: everyone else is doing it, so we did it and now it's done (until the next major redesign/funding come along)
  • Burgers take up very little space and lend themselves to being tucked into a corner of the screen
  • In many instances, they are effective

I want to address that last item in particular. IMO, burger menus are most effective when they contain functions that are less frequently used. Regularly used or core functions of an app or website need to be easily discoverable. Microsoft found this out the hard way with Windows 8, relying too heavily on navigational UI that was revealed only by swiping or mousing from screen edges. To me, an effective solution is to make use of both types of UI tools.

Examples of items that might be included in a burger menu:

  • An "About" section...'cause maybe once in a blue moon would one care (We want to buy your company, hire you, compete with you)
  • Settings, such as narration, e.g. in some of my apps the user can choose whether to have it and whether the voice is male or female. How often do you need that?
  • A contact form (or link to such) or, in the case of an app, a ratings page/control

Examples that would be horrible to include in a burger menu:

  • A play/pause button for a video, slide show or timed exercise app
  • A send command for a messaging or email app/web page

Non-mobile OSes could place most everything into menus because they have the real estate to display/order things, as well as keyboards (with memorizable shortcuts/commands). Yet think of programs you use, such as Photoshop, Illustrator or Word and how they mix tools/function in palettes with those tucked away in menus.

I hope I answered the original question, but also hope to encourage designers to assess which will be the most effective tools for users, regardless of which way the winds are blowing.

  • The question has been put on hold but I think this was a good response that gets at the answer I was looking for. It sounds like the nav bar is successful on a lot of app because most apps have a limited set of primary functions/modes, and the less common stuff can be hidden behind a secondary menu. An e-commerce website, on the other hand, probably has a little more complexity in its taxonomy while the common functions (browse / search / cart / account, etc.) are usually the elements that are exposed off the bat.
    – dekaliber
    Commented May 10, 2016 at 17:56

Both (hamburger and nav bar) have advantages and disadvantages that make them suitable in particular contexts. It very much comes down to how much value your users get from functionality that you consider for your main navigation, and more objectively, how often they use that functionality.

Spotify is a great example where a nav bar makes a lot of sense: Browse / Search / Your Library / Radio - I use all these all the time. They provide similar value and are probably all used frequently. So it makes sense to optimise access to these features.

For some applications, however, there's a bigger disproportion between the main function and the rest of the functionality. Think of Facebook, for example, all that matters is the feed, the ability to scroll through it quickly, and the ability to create new posts (which is integrated into the feed). I bet many users wouldn't even know what else you can do on Facebook. Going to specific pages, events, apps is much less important. So removing these options from the main screen and hiding them behind a hamburger menu makes sense. You can then provide less clutter and a much more focused, content-first experience.

Not the answer you're looking for? Browse other questions tagged or ask your own question.