Just Drop It: Get Rid of Drop-Down Menus (And If Not, 3 Ways To Use Them Effectively)

Posted by ImageWorks Creative Team March 23, 2016
We have something to let you know. The attention span of today’s internet consumer is short.
In a world of bombarding choices that can drive your customers out the door, your website should offer a quick and smooth browsing and buying experience. In other words, if you have something to say, or better yet, to show on your website, get it done fast. The Guardian gave us a heads up that 32% of consumers will leave a website within 1 to 5 seconds of arriving if the page load speed is too slow. For a 1 second delay? You could be looking at  11% fewer page views, 16% decreased customer satisfaction and 7% lost conversions.  
That’s why we just don’t have a lot of love for drop-down menus in website navigation.
Website design is a crucial tool that drives results, traffic and search engine rankings for your business. When customers make their journey onto your website, they will search for eye-catching features that are quick and easy to use. Speaking on behalf of this digital-age generation, we have an undying love for beautiful visuals, brand personality and…a website that’ll work on our mobile devices. Sorry to say, drop-down menus just don’t work well on an iPhone or Android and in fact, it suggested to never use them for navigation. And on your webpage? Too many drop-down menus may actually do more harm than good. 
Honestly, drop-down menus are downright irritating. Here at ImageWorks Creative, we are working on a full makeover of our own webpage, and we currently have just one drop down menu getting the job done!
Now if drop down menus are your cup of tea and you never want to give them up, we have three ways to use them effectively (and minimally): 
Use in Buying Mode
A great navigational tool for e-commerce, drop-down menus is most commonly used on online retail sites. Shoppers are able to take a shortcut to specific products as it cuts down on a “busy” layout. To avoid usability issues, minimize drop-down menus with more than two levels as seen over at BestBuy.com.
Use Mega-Menus
Mega menus are a growing trend in web design. ASOS uses this feature to display multiple buying options and products, underneath their “women” and “men” tabs. The drop downs allow users to quickly hover over all of the product sub-categories. Large drop-down menus can display more links to sections of your website, which allows users to go directly to the category or sub-category that they are looking for. If well designed, mega menus will be kept short and horizontal in size, offer a variety of paths, and use headings and columns to group links together.
Use Responsive Web Design
Everyone wants (and should want) a mobile version of their website. However, creating a web version for each resolution and new device would be highly impractical- that’s where responsive web design comes in.  Coined by Ethan Marcotte, responsive web design (RWD) is “an approach to web design aimed at crafting sites to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones)”.  As the user switches from their laptop to iPad, the website should have the technology of being flexible and use CSS media queries to automatically respond to the user’s preferences. Fun fact? More Internet traffic comes from mobile devices than computers. 
BONUS: If you’re Apple, you can get away with having no drop down menus at all!  We. Wish.
Is your website navigation on point? Or does it need some drop-down menu therapy? Tell us what you need to create the most optimal web experience possible for your customers.
Back to Main Blog