What is the Hamburger icon?
The Hamburger icon is a website tool. Intended to make minimalistic design optimal for mobile. Three simple horizontal bars make up the hamburger icon. The icon is often placed in a top corner as an alternative to a navigation bar. How does it work? The icon represents a hidden navigation tool (like a side menu).
The idea is that when you have a navigation bar, while fine on a regular site it can take up too much space on mobile. This is a real problem. The hamburger icon is an attempt at keeping a minimalist design while still being functional.
However the hamburger icon has received a lot of criticism. Despite the clear need for less cluttered mobile sites. Here’s why:
Hamburger icon cons
The hamburger icon is often considered a poor design choice. This is because you are effectively hiding all of your website’s feature behind an icon. There is a lot of theory suggesting that the hamburger icon is bad for user engagement. Put simply if users can’t see your navigation menu, they won’t use it.
The argument is that people are not familiar enough with the hamburger icon to recognise that it is used to hide your website or apps special features. Hamburger buttons are not very efficient in terms of UX. Think about it. In comparison to a navigation bar you have to tap just to even see what your options are. Then again if you want to move to your next page. Websites visitors are not known for their patience. Do not give them a reason to bounce from your site before they even know what your offering.
Also the triple bar is not particularly indicative of anything it is quite literally three lines. This unintuitive design is very negative on all kinds of conversions.
Hamburger icon pros
So, does this mean there is no place for the Hamburger icon? Actually no. In fact in terms of mobile optimisation the icon can prove vital. Yes, you are risking visitors misunderstanding the purpose of your hamburger. But the triple bar is becoming more and more prevalent across all devices. While I think there is very few circumstances to warrant a hamburger icon on your desktop website, navigation bars on mobile’s are incredibly frustrating.
Not to mention the lack of screen space. There are some alternatives to the hamburger even on mobile however such as the Tab Bar. An array of small navigation bars spread out across your page. This is definitely worth considering especially if you have less navigation options on your website.
Conclusion
In the end the Hamburger icon has a clear purpose. To give smaller resolutions some space to breathe. While it’s true that it is not the easiest icon to recognise initially. Once you understand it’s function it quite clearly indicating some kind of list. When you consider the only realistic alternative so far is the word ‘menu’, I think the icon is here to stay.
With time people will only grow more accustomed to the icon but for now it is definitely worth considering whether you really need this on your website, mobile or not.
I hope that this has helped clarify the Hamburger icon issue for you. If you would like to learn more about how we can help your business with web design please leave a comment below or call us on 01273 328877.