The Hamburger icon

Three horizontal lines stacked on top of one another – yes it’s a menu and it also has a name – the Hamburger icon.

hamburger icons

I read the BBC news article on the Hamburger icon with interest. It delves into the history behind it and also throws up some interesting stats:

  • Adding the word “menu” underneath the three lines increases the button’s use by 7.2%.
  • Putting the hamburger inside a box, so it looks like a button, increases use by 22.4%.
  • Switching the lines for the word “menu” makes 20% more people click.

I’m now torn between adding the word ‘menu’ to my burgers or leaving it as a design choice. On my portfolio site it’s a design feature not a visual aid and when routinely building Bootstrap sites I actively remove the background so it doesn’t look like a button – maybe need to rethink that one.

You can read the full article here: Hamburger icon: How these three lines mystify most people.