2

When using a sidebar menu, it's a good practice to place a menu button on the app's "navigation" header to make it easy for the user to discover the sidebar.

The menu button will be on the left, like the sidebar, and should be visible in each and every view.

Now, let's say a view brings in a master-detail navigation (for example, it offers some details specific to only a part of its content). So now your navigation header must display a Back button.

The question is: how do I layout both the back button and the menu button (they will be both on the left side)?

  1. I don't want to hide the menu button, cause I don't want the user to be forced to think how to access it,
  2. I don't want the back button to go on the right side, cause it's awful,
  3. I don't want the menu button to go on the right side, cause it's awful,
  4. I don't want to put the back button on a footer, cause it's even worse,
  5. I don't like right side sidebars, but that could be an option,
  6. I don't like the approach used by Gmail for iOS, disabling the sidebar when displaying a back button,
  7. Google+ approach (full screen, modal, detail views) is not something I would use as a general solution.

The "less unpleasant" solution I can think of is having the menu bar on the very left side and the back button just on right of it (maybe with a light vertical bar separating the two?).

Any advice?

Improve this question

2 Answers 2

Reset to default
2

Well, there are at least two solutions coming to my mind, maybe one of them could be helpful for you:

1 Placing back button and humburger icon on the left side - it's not a bad idea, I use a few apps which provide this solutions and I don't encounter any problems with clickable area. I suppose even clumsy finger user could click right button.

enter image description here

  1. Placing button on the right side of the header - also common practice, a lot of more place on the left side.

enter image description here

If you're designing app with a huge amount of content in vary categories you should rethink if hamburger icon on the every page is really needed.

Improve this answer
3
  • Could you list a few apps using one of the two solutions you mentioned?
    – ftartaggia
    Commented Mar 30, 2014 at 22:09
  • Screen shots are from polish apps: allegro and ceneo, the first one doesn't use this solution any more.
    – steppenwolf
    Commented Mar 31, 2014 at 12:50
  • Did you come up with a better solution then this?
    – Mike Flynn
    Commented Sep 22, 2023 at 12:58
0

I agree with the above - there is enough room to put both those elements on the left, provided they have adequate clear space around them. I wouldn't add a thin bar to divide them as you suggestion, as this just exacerbates the issue by adding in more elements.

I'm not sure why you think having the menu hamburger on the right is awful. I think it would work and there is always the opportunity of A/B testing.

Give it a shot.

Improve this answer
1
  • It just doesn't feel right, I don't know exactly why... maybe the fact that a right-side button opens a left-side menu.
    – ftartaggia
    Commented Mar 31, 2014 at 21:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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