Designing A More Effective Hidden Menu

September 16, 2015In Web Design4 Minutes

Guiding a user through an interface is perhaps one of the most important pathways a web designer can implement. Navigation is the main tool in guiding this experience, so it’s only fitting that there should be debate over new trends within menu design.

Though a standard well-designed approach to navigation is ideal for most websites, the hidden menu has become increasingly popular. With the rise of a mobile-first strategy, a more pared down, minimalistic navigation has become the norm for screens across the board. By far, the most used method to employ the hidden menu is that of the hamburger menu.

To refresh, the ‘hamburger menu’ is the application of a site hiding their menu navigation when a visitor first lands on the main page. The hidden menu information becomes visible when the visitor is ready to move on to additional information and clicks on the requested icon.

Person on an iPad connecting to social media apps

This implementation of the hidden menu has become so ubiquitous in web design today  that it has gone from a trend to a design standard. Adding the prevalence, popularity and necessity of responsive design – the hamburger menu seems here to stay. However, it is not without ridicule. Many have rallied against the use of this navigation style and even go so far as to say that it creates higher drop rates and less chance of conversion, effectively crushing engagement.

If the hamburger menu is here to stay, how can designers make it better?

Relevant and Simple Content

Just because the content is hidden doesn’t mean that it shouldn’t be pared to the essentials. After conducting user testing, simplify and condense menu items to what the user truly needs. Ensure menu items are prioritized in order of relevancy and user importance.

Provide a Call to Action

As savvy as most users are to the hidden menu, it may still be an issue for visitors to easily locate what they need in a timely manner. Utility elements such as a sign in portal, shop or join button should be included on the main page rather than hidden. While simply showing the stacked hamburger icon is ideal for a minimal approach, labeling ‘Menu’ as a hover can greatly increase user experience, getting the user to where they need to go in the most streamlined way possible.

Avoid Unnecessary Features

Lets face it, many sites that employ the use of a hidden menu are seeking a slick, modern approach to design. It isn’t always about being the most mobile friendly or efficient – design usually wins the day. This can be a slippery slope for flashy features that don’t ultimately serve the user. Allowing the hidden menu to remain static and clickable once its opened will help the user better understand the architecture of the site and all items that are available to them.

More than anything else, its important to explore a design that works for the brand or company it represents. Designing a site with features that the user cannot understand will always result in a redesign once drop rates begin to show up. Hidden menu navigation should be used with care and thought, beginning with the development of user personas and pathway exercises to reach the ideal design.

Person on their cellphone

Essential Mobile App Design Usability Factors

The goal of many mobile app designs is to create a system that speaks the language of the user, leveraging familiar concepts to deliver something that feels new and unexpected - even delightful. This can be challenging to accomplish but aligning…

Two users on a laptop engaging with AMP

UX Solutions: Determining If Your Website Can Benefit From AMP

In a marketplace where speed often equals performance, staying relevant across device with attention to mobile is critical. That’s why AMP, or Accelerated Mobile Pages has been met with such excitement. Site owners and marketers who want to remain…

Video recording test device

The Value of Video Testing for Usability

We all know the power of qualitative testing. Employing platforms to determine the best user experience and using focus groups to target the ideal user to manage the testing process can provide a valuable but all too 'hands-off' approach to…