25 Examples of Mega Menus in Web Design

by Steven Snell

August 4, 2009 in Inspiration

Mega menus are a growing trend in web design (see Mega Menus: The Next Web Design Trend from Sitepoint). For sites that involve a lot of pages and/or products, a mega menu may be able to improve navigation and usability. In this post we’ll look at 25 examples of mega menus in action.

Many of those featured in this post are from e-commerce websites. Mega menus are common on e-commerce sites because they typically include a lot of categories of different products, and so mega menus can be very useful for visitors. They are also a possibility for other large websites where fewer clicks can be used to get to a specific page with a mega menu.

Little Kids Bedrooms

Little Kids Bedrooms

OfficeMax

OfficeMax

Office Depot

Office Depot

Action Envelope

Action Envelope

ASOS

ASOS

The Sak

The Sak

Nike

Nike

Adidas

Adidas

Etnies

Etnies

Target

Target

REI

REI

House of Fraser

House of Fraser

Northern Tool + Equipment

Northern Tool + Equipment

Food Network

Food Network

Martin + Osa

Martin + Osa

Quiksilver

Quiksilver

Might Leaf Leaf

Might Leaf Leaf

Lucky Brand Jeans

Lucky Brand Jeans

B&Q

B&Q

3 Suisses

3 Suisses

Like.com

Like.com

Spread Shirt

Spread Shirt

Walmart

Walmart

Rampage

Rampage

mydeco

mydeco

For more design inspiration, please see:

Powered by Shutterstock

About Steven Snell

Stephen Snell is the owner and editor of Vandelay Design.Connect with Stephen on google+

  • Shanna

    Aug 5th

    oooh nice. I need to do something like this on a wordpress site.

  • Victoria Web

    Aug 5th

    This is a brilliant post as i am currently embarking on my first e-commerce website. The successful multiple menus above are clear list style and categorized, using hierarchy and colours.

  • Sankar

    Aug 5th

    Awesome menu styles, Have to plan for one.

    Thanks
    Sankar

  • Web Design Manhattan

    Aug 5th

    Nice list! Thanks for the post!

  • SD

    Aug 5th

    How about the Ikea website menu?

    There are some good ideas in here. Thx :)

  • claudio

    Aug 5th

    Nice post,
    I suggest taking a look at Porsche site as well; if interested I rebuilt the whole menu with css + Jquery.

  • toongimp

    Aug 5th

    A few of these look clean and all but make site functionality terrible. I’ll use my common sense if I were you lot.

  • vjay

    Aug 5th

    ‘Mega Menus’ are the worst trend ever invented. If you feel the need to use a ‘Mega Menu’ go back to the drawing board and do an IA. This is a great post on what not to do.

  • Sam Logan

    Aug 6th

    Great examples of well structured and organised navigations. Sometimes as a designer it can be worrying when you are presented with a complicated site navigation, but it is also a fun challenge to try and organise it and present it in a pleasing and usable way.

  • Jerry Black

    Aug 6th

    have to agree with vjay. Most department store websites I have ever come across have used this ‘trend’ – it really is nothing new!
    It really is an example of what happens when Information Architecture gets left out of the design/development process.

    If you find yourself staring at a ‘mega menu’ at any stage in your design process you really need to rethink your strategy and go back to the drawing board.

    Good post … horrible ‘trend’ to be avoided at all costs!

  • Noel Wiggins

    Aug 6th

    What a tremendous collection of excellent navigation possibilities.

    This type of navigation seem to be clear and organized giving the visitor what they want when they want without having to dig too much…


    Thanks & Regards
    Noel from nopun.com
    a professional graphic design studio

  • Website Design Sydney

    Aug 7th

    Really great,

    Mega menus offer a good compromise between simple and expanding menus. They are easy to use and should suffer fewer accessibility problems. They look great and give designers more scope to express their artistic creativity!

  • NicoleB

    Aug 7th

    SD, I like the Ikea nav as well, simply because it pops the mega menu into the left nav. I like that better than overlaying the content on the page.

  • craig

    Aug 14th

    Well,

    All the whiners that go on about IA are missing the point where they talk about the ‘size’ of these menus. I can visit a department store and look at the store ‘menu’ which is very large at my local John Lewis.

    However, since the hierarchy, groupings, style, visibility of headings, font, contrast with background, size of text are all very good – it allows me to find the thing I’m looking for and get to the correct floor.

    Don’t complain about them not doing IA just because they have a big list – complain if the design of the list sucks. Big menus aren’t inherently bad – poorly designed ones are. Test stuff with users and do your research (card sorting, IA etc.) of course but make sure the fundamentals are there regardless of size of menu.

    C.

  • Martin Sanders

    Aug 20th

    Thanks, I was considering doing something similar for our client list.

  • ithemesdotnet

    Aug 20th

    Mega Menus are definitely on the rise. I think they are awesome!

  • candyfusion belt buckles

    Sep 9th

    great examples, will consider them in the future

  • web

    Sep 9th

    really cool stuff

  • hotmac

    Oct 1st

    Btw: RAMPAGE does not have any MMs anymore…

  • DJ FatSkank

    Nov 11th

    Don’t forget teh menus on http://www.fortnumandmason.com/ – especially the wine one…

  • Brad

    Dec 28th

    Sweet, we are implementing mega menus at my full time job in trying to unify all our websites into a portal type site. This is going to be handy for inspiration.

  • Bob

    Jan 22nd

    Pixels are finite + Navigation is a modal activity = show/hide navigation. Mega menus are scannable, yet they get out of the way. The best solution there is (for now).

  • Riga

    Feb 4th

    Marketing team in my company asked for one of this big menus. We did a mock-up in Flash and they gave the go ahead.

    We (developers+designers) spent one week to create a copy of it in jQuery. It look quite nice and elegant. Took Marketing team 20 min to decide did not like it. Their main complain, it was too intrusive, too bulky. Spent again 3 days making changes they requested and still did not like it.

    They decided to scrap it :(

    Riga

  • Anna Green

    Mar 4th

    Im an fan of a large menu especially for e commerce shops, without them i think it is too easy for visitors to miss the majority of what the sites sells. Designing them well is important and this is agreat list of examples for anyone who needs some inspiration.

  • Jason

    Mar 5th

    Mega menus shouldn’t be thought of as a type of menu, it’s a lack of a system. Give us a selection of well designed icons and/or intuitive sliders, not box that covers the entire screen every time my mouse rolls over a button.

  • Chris Ward

    Apr 1st

    I think mega menus are a good idea, it gives the user a quick and simple way to get from one place to another whilst keeping content drilling to around 2-3 clicks which aids usability.

    I think the Adidas site’s mega menu is clean and tidy

  • juliawan

    Apr 29th

    wao very awesome drop down menus ,how can do that like the menu? is there anyone can teach me about that??? it is very awesome to show drop down menus

  • Alan

    May 3rd

    Nice examples
    Don’t forget

    butik.dk
    expansys.com

  • Liminal Web Design Cornwall

    May 27th

    Impressive collection, really inspirational and very useful – Thanks

  • sheela

    Jun 8th

    very much useful

  • Mohammad Koubeissi

    Jun 17th

    not a fan of large menus…

  • brikola

    Jun 17th

    A mega drop down menu example (made with web menu software AllWebMenus) you might want to check out is:

    http://www.likno.com/examples.html?example=mega_dropdown_menu1

  • gigi | Wevio.com Web Design Company

    Jul 14th

    Wevio.com
    Best Website Company in New York City!

  • Web Design Leicester

    Jul 22nd

    Will be cool, if you can provide us links to tutorials making these menus

    Thanks
    Shovan

  • LV BAGS

    Jul 23rd

    Will be cool, if you can provide us links to tutorials making these menus

  • Naples Web Design

    Aug 20th

    What great menu design for all of those websites. They are really intended for a great, simple yet entertaining look. Are those kinds of website are difficult to load or not?

  • David

    Sep 7th

    They are very impressive. We are making the mega menu for our joomla templates ;)

    Thank you so much for great example.

  • Hire a web designer

    Sep 20th

    yes, its will give too many good menu examples.
    Jquery, javascripts menu is too easy .

    Thank you so much for great example.

  • Gary Cottam

    Sep 27th

    I love these examples of menus. Any body know of good tutorials out there?

  • inblues

    Oct 18th

    Thanks for the list. The menus are awesome but it have to be used in right place.

  • Website Facility

    Oct 20th

    This is really good, thank you very much for sharing.

  • halim

    Nov 3rd

    Hello here is good menu example for WordPress : http://www.premiumtemplate.org

  • laman web

    Nov 4th

    thanks for the collection…give me a new ideal for main navigation bar….

  • Freelance Web Deisgner

    Nov 15th

    Fantastic collection, thanks!

  • laura

    Nov 16th

    i’m looking for a vertical example, like walmart, does anyone knokn any other site???

  • Nimesh Chheda

    Dec 1st

    Nic 1 ;)

  • airless paint sprayer

    Dec 7th

    very nice design.
    thanks for sharing.

  • Beats by Dre

    Dec 15th

    I could only WISH I could do any of these. So much color! These models are beautiful

  • adsl fpt

    Jan 25th

    Very nice menu design but building that menu maybe cost me an entire day of working however thank you for your share.

  • Website Design Australia

    Feb 14th

    This site is really interesting. You bring up some great points about your article… .. Thanks for the great information about website design.. It is my first time here in this site so good job…

  • Clare Radomskij

    Mar 2nd

    Some great designs worth considering for future as our range grows. BBT Clothing

  • Internet Marketing Westchester

    Mar 25th

    I’ve been thinking of creating one of these menu’s. Thanks for the examples. It helps me a lot. Now I just need to find a tool that will help me create them.

  • VicTheme

    Mar 27th

    We have created a simple Drupal module for formatting Drupal menu into a megamenu style. To review this module : http://victheme.com/product/drupal-mega-menu-module

  • Web Design Company India

    Apr 11th

    nice menu. The menus are awesome, nice Design.

  • Managed SEO

    Apr 11th

    One of the best examples of this that I have seen is on the National Geographic website. Vjay and Jerry Black – this is an exceptionally effective way to get users to deeper links and highlight featured content without needing to click down and down through some ridiculous hierarchy.

  • soere

    Apr 20th

    Great article and your blog template is so cool. Is this template free or not? If so, Where could i download this template? if not, how much does it cost? Thanks a lot!

  • Web Design Professionals

    Apr 20th

    Hi Nice post

    Thanks for the post

  • gaul

    Apr 21st

    Thanks for your marvelous posting! I certainly enjoyed reading it, you’re a great author.I will be sure to bookmark your blog and definitely will come back very soon. I want to encourage you to definitely continue your great writing, have a nice afternoon!

  • JMCEquipment

    Apr 27th

    Great post, all of these sites are very user friendly and have a sleek design to them, def have to use some of these for my upcoming sites.

  • lunettes

    May 10th

    They look great and give designers more scope to express their artistic creativity!!!

  • Alfonzo Carco

    May 19th

    Greetings! I know this is kinda off topic but I was wondering which blog platform are you using for this website? I’m getting sick and tired of WordPress because I’ve had problems with hackers and I’m looking at options for another platform. I would be fantastic if you could point me in the direction of a good platform.

  • y8

    May 21st

    Thank you for give very good informations. Your web is coolI am impressed by the information that you have on this blog. It shows how well you understand this subject. Bookmarked this page, will come back for more. You, my friend, ROCK! I found just the information I already searched everywhere and just couldn’t find. What a perfect site. Like this website your website is one of my new favs.I like this info shown and it has given me some sort of commitment to have success for some reason, so thank you

  • Infrared Home Diagnosis

    May 30th

    Nice post, some good examples, I personally don’t like them as it takes an absolute age to navigate through the darn things!

  • play suits for women

    Jun 1st

    hands so it’s refreshing to come accross blogs such as yours. Keep up the good work.

  • Chris

    Jun 10th

    Great list of sites/menus. This is now bookmarked!

  • Kelly@ Local business listing

    Jun 16th

    The mega menus look pretty cool. Yeah, I’ve seen a lot of new sites having mega menus and you’re right, this is the trend going on right now. The list at the top are pretty awesome, love the designs and they look pretty fresh and current.

  • vkwave

    Jun 21st

    Impressive. Thanks for sharing
    I am going to choose one of them. :)

  • Diseases & Treatments

    Jun 23rd

    Woo nice collection top site with MEGA menu, helpful for the freshers to start with. I decided to implement one in my site, thanks a lot.

  • Web Design Company India

    Jun 26th

    Nice Collection.
    Thanks

  • Cartier Love

    Jul 24th

    just good

  • camilla

    Jul 27th

    good collection, thanks!

  • Neoteny

    Jul 28th

    Nice collection. The mega menus look pretty good. It shows how well you understand this subject. One of the best examples of this that I have seen is on the National Geographic website. I’ve been thinking of creating one of these menu’s. Thanks for the examples. Hope you to share me more about this cool collection.

  • Leave a Comment

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