Website Drop-Down Menus: When They Work & When They Don’t

A drop-down menu (sometimes called pull-down menu or list) is a graphic control element designed to help visitors find specific pages or features on your website.

Clicking or hovering on a top-level menu heading prompts a list of options to drop down. The user then navigates to the one they want — unless a poorly designed menu structure or functionality makes it too challenging for them.

website-drop-down-menus

Not surprisingly, many drop-downs are difficult to use. This can translate into user frustration, which can lead to a high abandonment rate. Prospects that might otherwise have become your customers will take their business elsewhere.

Let’s look at some of the pros and cons of drop-down menus, as well as some viable website navigation alternatives.

Why We Sometimes Don’t Love Drop-Down Menus

A large percentage of drop-down menus have poor design, making them annoying, confusing and barely functional for your site visitors. They’re complicated and difficult to read or understand.

The most challenging are those menus designed with hover functionality. This means that, when a user hovers over a particular menu item, that item expands to display subcategories. However, if you lose your hover, so to speak, the menu goes away and you have to start over.

dropdown-2

If you have multiple menu items in a drop-down, some screens don’t allow the user to see all the options. The user may try to position the menu bar at the very top of the screen so that all the drop-downs are visible once they click. Or they may simply choose to go to a competitor who has a more usable website navigation scheme.

Another disadvantage to this navigation format is that it rarely translates well to mobile platforms. And because the majority of your site visitors are probably already finding you by using a smartphone or tablet, this is a big disadvantage.

Google isn’t the biggest fan of drop-down menus either. In fact, they can be difficult for the Google web crawlers to index correctly. This could hurt you in the search engine results — significantly in some cases, depending on how your site navigation was coded (programmed).

When Drop-Down Menus *Do* Work Well

If they’re designed correctly, these navigation tools can be effective for getting site visitors where they want to go. They also take up very little of the precious real estate “above the fold,” or the part of the site a visitor can see on their screen without scrolling.

If you have a limited number of options, especially if you don’t have more than one tier of menu options, this approach can work well, even if you use hover functionality. You can also improve the usability of hover if you delay its deactivation. In other words, allow the menu to remain on display for a few seconds, even if the user’s mouse pointer strays.

If you make your drop-down menus clickable, you will potentially make your site visitors more comfortable — unless they can’t figure out how to make the menu go away once they’ve clicked on it.

go-away

Make sure the font style and size are clean and readable and the background colors are different enough from the font colors. Also take care to ensure that the user does not experience a lag once they’ve clicked or hovered. Otherwise, they may click too many times in the wrong places and end up somewhere they never wanted to go — and that will send them scurrying away from your site.

Focus on clean, simple and functional when you use drop-down menus. If you can’t achieve those objectives well, consider using an alternative navigation format.

What Can You Use Instead of a Drop-Down Menu?

Sidebar menus were once the darling of website navigation. But because the vertical format monopolized between one-fourth and one-third of the page, web designers abandoned them in droves for less-intrusive — and harder-to-use — horizontal options. Some of your favorite social media platforms (namely, Twitter and Facebook) still use sidebar menus successfully.

sidebar-menu

If you don’t want a sidebar menu to disrupt the look of your site, you could consider using a collapsible or fly-out sidebar menu.

flyout-sidebar-menu

One option that is growing daily in popularity is known as scrolling panels. This navigation scheme relies on an extended homepage that the user scrolls down through to find the options they want. This works well if you have a limited number of navigation targets, and it translates almost seamlessly to mobile platforms. Scrolling panels are best for brick-and-mortar service businesses like restaurants and hair salons.

Perhaps the most powerful and versatile alternative is card-based navigation. This style of navigation can be adapted to most types of businesses. It also translates extremely well to mobile devices. Because so many sites use cards for navigation today, this navigation architecture has become familiar to most internet denizens.

card-based-navigation

The best alternative for your site will depend on your business model and site structure. If you have a large e-commerce site, for example, you may benefit from a mega-menu. However, unless your mega-menu is designed well, it can vex your uses as much as any drop-down could.

Why Does Any of This Matter?

Drop-down menus are an important component of website navigation, and website navigation is a major component of the user experience (UX). On any site, if the UX isn’t good, you will lose business — potentially a lot of business. A good UX, however, can increase conversions by 200 percent.

The internet has become a critical part of everyday life for most people — including your prospects and customers. The conventions of browsing, researching, communicating and buying online are virtually second nature, almost like turning on the lights or the water.

light-switch

If you go into someone’s home or a hotel, you know how to turn on the lights and run the water, even if you’ve never been there before. Now imagine going into one of these places and not being able to find a light switch, or not being able to figure out how to turn on the hot water.

When a prospect lands on your website for the first time, it is imperative that they recognize immediately how to turn on the water and the lights — so to speak.

That’s the essence of the user experience. A bad UX will send a prospect running to your next competitor with an intuitive, user-friendly site. And because the navigation scheme is the anchor of the UX, having intuitive, usable menus is critically important.

If you’re like most business owners, you may not know the best way to design a good UX — and that’s where an online marketing expert can help. At Be Locally SEO, great website architecture and design are only a part of what we do, but these elements are critical to your overall online marketing effort.

You can spend your entire marketing budget on search engine optimization (SEO), search engine marketing (SEM) and content marketing, with the goal of increasing traffic to your website. But all the traffic in the world won’t provide any benefit if visitors can’t find what they need once they land on your site.

The web designers at Be Locally SEO understand how to create the most user-friendly site structure that encourages visitors to stick around, helping them down the path to that all-important decision to purchase. Contact us today to learn more about how we can help you — using drop-down menus or not — to create the optimal UX for your prospects and customers.

Leave a Reply

Your email address will not be published. Required fields are marked *

Captcha * Time limit is exhausted. Please reload CAPTCHA.