7

Do you think the icon "☰" is enough for users to know that a menu is underneath?

Medium.com doesn't even use an icon, it is linked from its logo on the top.

Other websites just use the word "Menu" which I think is a little more intuitive.

Is the "☰" becoming the international symbol for "menu/navigation"?

5

Actually, my company recently did a bunch of field research, and the results were completely mixed, even across age and experience -- most knew of the symbol, but most misinterpreted its meaning. We hypothesized this happens because of how the symbol is used across larger platforms such as Google Chrome and Facebook, i.e., it's not always used to mean the same thing, which makes it confusing for a lot of people.

| improve this answer | |
  • Very interesting, I am writing about this right now as well and came across this little aspect of UI in my own research. Would love to look at your data :) I never thought about social networks that use the symbol, that is a really great point. Thank you for chiming in, I was hoping to get a good answer on this. – Patrick Coombe Apr 16 '14 at 1:27
3
  1. http://thenextweb.com/dd/2014/04/08/ux-designers-side-drawer-navigation-costing-half-user-engagement/?utm_content=buffer044a9&utm_medium=social&utm_source=twitter.com&utm_campaign=buffer
  2. http://www.exquisitetweets.com/collection/lukew/2919
  3. http://exisweb.net/mobile-menu-abtest

The hamburger icon and it's affordance has been hot topic for several months now. Even on this website. I've read a lot of these discussions and also entered some of those.

My take out is that the hamburger icon in itself has little affordance. Styling it as a button increases affordance, but the meaning of the icon is still relatively unknown to audiences of 35 years and up even though the icon has it's origin in 1981. Using the hamburger icon comes with the label "use at own risk" for it can cost you user engagement.

| improve this answer | |
1

If you are referring to the Hamburger button, then I would say yes, it's fairly known now as a metaphor for a menu on mobile devices, and thus making it's way to the desktop (responsive) web as well.

As for the medium, they can afford quite innovative design because their target audience is internet savvy. The pattern is certainly unintuitive.

| improve this answer | |
  • Thank you, and really good point about Medium's audience. I did not know it was called a "Hamburger button!" – Patrick Coombe Apr 16 '14 at 1:25
1

The independent web-publishing firm Exis has been engaging in a number of A/B tests measuring the success of the "list" (or sometimes called the hamburger) icon. Their last test was statistically significant to start drawing some conclusions. Some of their key findings:

  • The word "Menu" performed about 20% than the "list icon."
  • Android were 3x less likely to click a navigation button than iOS users.

The Nielsen Norman Group released an updated study in February 2014 on the success of icons today. While they found that most users understood the magnify glass to mean "Search", most users still do not understand newer icons such as the list/hamburger icon and map marker.

Labels should still be used for newer icons, such as the three-line menu icon (or “hamburger” icon). The map-marker icon is another icon with a still cloudy meaning and inconsistent use. Sometimes it means current location, or a different particular location, or locations in general, or nearby places. Users are still learning what these icons mean and how they behave, so it’s best to use a clear label.

So to answer your questions:

  1. No, enough users don't know that the list/hamburger icon means "Menu". Use a label if you want to use the icon.
  2. "But Medium doesn't use it!" True enough, but most people land on article pages. The team there is much more interested figuring out articles close to the one that interested you enough to click on a link then provide some bulky UI to find stuff yourself. This is why search is completely buried in the menu. It's just not important. If the team there wanted more people to use the menu more, they would call it out better. This is an intentional decision to focus the user on the article page and suggest more articles at the end.
  3. At this point, anyone would be hard-pressed to say that the "list/hamburger" icon is the international symbol for "Menu." It could achieve that status over time, but it'll be a while. In the meantime, providing clear labels with the icon helps users to learn the symbol.
| improve this answer | |
0

I would like to share with you this ab test results

http://exisweb.net/menu-eats-hamburger

| improve this answer | |

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