This article provides a summary of mega menus and how to use them.
As the devices we view the web with shrinks in size, the sheer amount of what we are consuming grows exponentially everyday. When it comes to buzz-feedy like websites, that’s all well and good. Some of us have the attention span of gnats and really, the more cat videos, the better. But in terms of a corporate website for a professional service firm with large areas of services or capabilities, it can be a bit much to take in. Especially in terms of website navigation and finding exactly what you want to find. Thankfully, “Mega Menus” are here to save us all.
Let it Flow
Navigation, much like everything that has levels of importance, flows from top to bottom: primary, secondary, tertiary, quaternary, quinary, etc. Primary being you’re main level of navigation. Your who, what, where, when & how of basic navigation. But once you leave that level, things can get more complicated and confusing very quickly. What if you have 6 secondary levels of services, but within each of those secondary levels of service, there are 8 tertiary services? What if even some of those tertiary services have some very specific quaternary services you want to talk about? How do you navigate that clearly? Should you even be showing that much in a menu? That’s a lot to take in. Well, with traditional drop-down navigation with fly-outs, you’ve opened yourself up to some very complicated and difficult to follow navigation. The exact opposite of what you want the people coming to your website to experience. Down the rabbit hole into the land of confusion. But thankfully there is an alternate solution.
Bigger Can Be Better
Say hello to the Mega Menu. A much more stylistic and user-friendly navigation option for wading through large sections of a website. In essence, it’s just a large (mega) drop-down panel with navigational links. But what you can do within the panel is what sets it apart from traditional fly-outs. Organization is a key element to design in general. A hierarchy of dominant and subdominant items arranged with clarity and purpose. When you apply this way of thinking to designing a complex mega menu, the result is a faster and much more intelligent way to get to where you want to go. You can take a complex navigational structure and simplify it in a way that’s both elegant and easy to use. It’s all there. Everything you want front and center, yet it doesn’t seem intimidating or complex.
Dress It Up
Organization doesn’t just need to have straightforward lists of services. You can accomplish multiple things at once. Say you have a resources/insights section made up of articles, blogs, presentations, white papers and events that are written around a set of 10 topics or categories. In a mega menu you can give your user an option to navigate not only by format, but by topic. You can even promote your latest piece of content directly in the menu as a way of getting your users to the most recent blog post on your site. You can use photography or iconography or link to a video. In a weird way, the possibilities are endless. Instead of your standard color boxes with type, you can fully design a mega menu like a blank canvas. Just take a look at some of these examples.
Lowes
Amazon
The North Face
Nike
ESPN
Woodside
Starbucks
So while we push ourselves to create more content for our ever-expanding presence on the web, we’ve also begun getting to the point where too much is too much in terms of navigational structure. We have a lot to say, but not everybody wants to hear everything. They want to find something specific to them. So as they say, it’s out with the old and in with the new. Where the new isn’t just big or bigger, it’s Mega.