Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

It's clear that the Hamburger Menu should be to the right of a native app and web application. At least our community concluded (through voting) on the question Hamburger menu icons - should they be on the left or right? that this should be the case.

That's because aprox. 67% of users use the right thumb (so that means the right hand) and in several studies have proved that the screen area is more difficult to reach with this hand posture is the top-left one.

For the same reasons, wouldn't menu items also be right-aligned to make it easier to navigate the menu? The full menu item area may be selectable, but It's not always obvious (and not always implemented). Or do I miss something here?

Example

enter image description here enter image description here

share|improve this question
2  
The only thing I have thought is that, if you touch the menu with your thumb on the right, then your thumb is covering that part of the screen so (perhaps) the list itself should come in on the more visible left. –  Rob Jan 13 at 21:48

3 Answers 3

up vote 6 down vote accepted

I would strongly advise against right text alignment from the readability point of view, at least for countries where the text is read from left to right. It is the same case as reading a book, if it would be right aligned, your eye would get quickly tired by searching the start of every line. See the image:

menu example

Also when user knows what he is searching for, he can just scan through the first letters until he finds a match. That is much harder on the right example.

The case of left handed users, covering parts of the menu while scrolling, can be solved by placing icons on the very left. You increase the legibility and make some space for the finger. See the example:

menu with icons example

share|improve this answer

If the menu takes the complete screen, as in your screenshot, left alignment is just fine. It's more natural and users are used to it. And as Rob said, thumb wouldn't obstruct the menu text.

But if your menu takes only half of the vertical screen, or less, on the right side, only then right alignment can look better.

Maybe because of this text alignment anomaly many apps that show the menu on the half screen choose the left half and hence keep the button on the less accessible top left corner.

A relevant answer

share|improve this answer

The majority of users will read left to right which makes it important for navigational elements to be left aligned.

The best way for usability would be to float the hamburger menu to the right (or align center even), expanding the menu full width with each full width menu item being clickable. This would prove greater accessibility all around.

We recently implemented something similar on our website which launched this week.

Hamburger menu collapsed by default and center aligned.

hamburger menu collapsed

Hamburger menu expanded with full width menu items text aligned left. hamburger menu expanded

share|improve this answer
    
Care to explain why, whoever downvoted this? –  zigojacko Jan 16 at 16:42

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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