At WDC, there are some things we know without a doubt – quality web design, proven digital marketing, creative branding… and where to find the best food in town, especially burgers!
Our internal deliberation about who serves up the best burgers in Wilmington sparked a slightly different discussion between our designers and developers. To hamburger or not to hamburger when it comes to web design?
Let’s Talk Burgers
The hamburger is a navigation element represented as an icon consisting of three horizontal black bars piled upon one another, resembling an actual hamburger. It is often used to group and stack the main navigation items of a website and has recently become one of the more controversial features in modern design. Some argue the feature is self-explanatory after years of usage, but others deem it a poor user experience. We’re here to offer our two cents.
When first introduced, the hamburger element seemed to solve a few issues in modern web design. On mobile devices, the smaller menu easily plays to its advantage where space is at a premium. Additionally, with its clean look and ability to simplify navigational clutter, the icon keeps users from becoming distracted from the sites core function.
While you may recognize the icon, there is still a large percentage of people that may not identify the three stacked lines, especially older, less-savvy demographics. This user uncertainty can cause confusion when it comes to site navigation and ultimately derail the user experience.
Secondly, as digital marketers, we’re concerned with the amount of effort the hamburger requires of the user. Simply put, what’s out of sight is out of mind. Because your navigation is hidden behind the three-bar icon, users are ultimately asked to spend more time searching your site for information that should be readily available and simple to locate.
Just like the juicy indulgence we all crave, hamburgers may look good but aren't necessarily good for us. Using this navigational feature isn't the end-all, be-all, so don’t stress. We simply think the feature has room for improvement and warrants discussion, as such with anything in the ever-changing world of web design.
Here are a few solutions we adopt when we can’t quite kick them out of our diets:
Add A Label
Adding a label to your hamburger menu can have a huge impact on user awareness. Whether you add the text below, above or beside is up to you. Just swap your old icon out for one that includes “MENU” with it and we assure you your users will be able to navigate your site with a greater sense of confidence.
Tab Bar Menu
An even more-straightforward solution is to adopt a tab bar menu. Anchored at the bottom of your phone screen, the tar bar displays can display up to five navigational items. Our designers and developers stand behind these because they’re visible, orient the user within the site, and bring the most important items to the forefront.
If it’s not possible to completely implement a tab navigation, one solution we’ve turned to is placing CTAs (Call-to-Actions) at the bottom of a page. We fixate information users are likely searching for, like phone numbers or directions, at the bottom of the page, so they can more easily convert and find the information they are looking for.
As mobile usage continues to surpass desktop, it’s even more important to be up-to-date on best practices when developing mobile-friendly websites and apps. Your site’s navigation may not always be top of mind, but it’s certainly important when it comes to your overall business goals.
Looking to update your hamburger menu or in need of a navigation audit? We’re happy to help! Let’s chat and get started.
Like this article? Check out more just like it at wilmingtondesignco.com
At WDC, we believe honest business and innovative design go hand-in-hand. Our talented team of designers, marketers, and developers are as diverse as their work. We offer a range of services from creative web design and development to digital marketing strategies and branding solutions tailored specifically to your business. Contact Bill at [email protected] or visit www.wilmingtondesignco.com.