Are you a fan of the hamburger menu icon?

Lots of websites that use an icon to represent a hidden menu are now using a symbol of three horizontal stripes - this has become known as the hamburger menu drawer. The top and bottom lines represent the bread, and the middle line represents the meat!

This icon originally appeared in Apps such as the Facebook App. It then spread to other mobile apps, and other responsive websites viewed on mobiles. Its appearance on websites viewed on large screens is a more recent trend.

It is a very versatile symbol that can be applied equally well to a variety of settings. The icon doesn't stand for a specific object, or method, but it appears to be emerging as a common standard. It's a little bit like a new word cropping up in our everyday language that meets a developing need - as time goes on it becomes accepted as standard.

On the other hand, whilst its appearance on websites where space is not a premium may make pages look more trendy, minimalistic and cleaner, it can be argued that the icon could potentially make it more difficult for people to use the site. Some other interaction is required, be it either another click of the mouse, or another mouse movement, in order to see the navigation options.

As always, whether the icon works or not is a very individual thing, and it highlights the importance of good web design.

Here are a few examples of websites that use this icon:



New York Times