Mega-menus are a mainstay of desktop ecommerce.

Five years ago, we published a post dissecting 26 of these menus, back when they were relatively novel.

In 2014, we revisited the topic, seeing that full-width menus with a greater number of products and featured images were en vogue.

So, what of 2016? Let’s have a look.

Argos

2016 might not look much different to 2014 but in the example tab below there are 82 categories now where there were only 53 in 2014. There’s also an additional way to shop (by room).

This increase is a trend for many ecommerce sites, comparing 2016 to 2014.

As a commenter on our 2014 post rightly points out, surfacing more products, creating specific journeys, is intended to serve the customer as soon as they arrive.

..clear signs of the proliferation of content items that, over time, the managers of a site feel compelled to try and shove under the noses of their customers at the earliest conceivable point.

More and more shopping journeys, of ever greater specific focus, start on the primary nav.

2014

mega menu argos

2016

argos menu 2016

Marks & Spencer

The M&S menu now appears even more mega, partly because it has got rid of the secondary menu (in black in the 2014 image), using only one dropdown.

M&S doubtless wanted to avoid confusion in navigation by surfacing all relevant subcategories in just one rollover. This approach definitely adds clarity, even if it makes for more reading.

2014

mega menu m&s

2016

marks and spencer 2016 menu

Lakeland

Lakeland has vastly increased the number of items/categories in its mega-menu, adding a secondary menu in each main category to create the extra space needed.

Offers are given more room to breathe on the right hand side of the menu, being much bigger in size and picked out with colour.

Note how the little thumbnail images have disappeared from subcategories, making everything better aligned and easier to read.

2014

lakelenad menu

2016

lakeland menu 2016

B&Q

Unlike M&S, B&Q has made more of its secondary menu. In 2014, a secondary menu did exist, but was limited to five departments. In 2016, the secondary menu in the shop tab has expanded significantly.

It’s notable here that B&Q has removed colour (no orange text or bullets) and bold subheaders, again trying to add clarity to the menu and make it easier to scan.

There are also a greater number of tabs on the main menu in 2016, bringing in new content, as well as ‘My account’.

In 2016, the room iconography on the left hand side is another addition intended to make things easier to scan, highlighting the links to room category pages.

2014

b&q menu 2014

2016

mega menu b&q

Novatech

Novatech’s website redesign has changed some of the menu listings and style, though not dramatically.

One of the interesting UX additions is a large, red button to ‘View all’ in a category.

This seems like a good option for retailers who fear that a mega-menu may intimidate some browsers.

2014

novatech menu 2014

2016

novatech menu 2016

Jigsaw

Jigsaw has changed the titles of its main tabs, notably including one of the more popular product categories – shoes.

The fashion in 2016 web design seems to be consistent text colour, as red text has been removed from Jigsaw’s menu.

Yet again, significantly more items make it into the menu, along with an added subcategory of ‘Collections’, giving users new startpoints from which to browse.

Note the dropdown menu is now full-width, to include preview images.

2014

jigsaw menu

2016

jigsaw menu

Monsoon

In the last two years, Monsoon has gone full-width with its menu, giving ‘offers’ their own tab and making the subcategories easier to pick out.

2014

monsoon menu

2016

monsoon menu 2016

Selfridges

In 2016, Selfridges has added three extra tabs in the menu and the subcategories have been allowed to spread out.

This reduces the height of the menu and making it easier to take in, particularly on widescreen laptops.

2014

selfridges menu 2014

2016

selfridges menu 2016

MyProtein

Interestingly, MyProtein is one of the few sites to have reduced the items in its menu, as shown in the ‘Your goals’ example below.

Partly, this may be because this area of the site is content-led and letting users enter the content in the middle may be undesirable or confusing.

Certainly, the reduced menus for content-led ecommerce distracts less from the product listings in ‘Our range’ (also seen below).

2014

myprotein

2016

myrpotein menu 2016

The product listings in ‘Our range’.

our range myprotein

Blacks

Some of the category titles have changed in the Blacks menu, but not much else.

I thought I’d include a shot of the brands menu, now featuring colourful logos, which perhaps stand out more than the too-cool-for-school greyscale of 2014.

2014

blacks menu 2014

2016

brands menu blacks

Wiggle

Wiggle has had a makeover, with only black text and links, and no bullet points. 

2014

wiggle menu 2014

2016

wiggle menu 2016

La Redoute

La Redoute has added a secondary menu in order to add a whole host of subcategories.

2014

la redoute menu 2014

2016

la redoute menu 2016

Conclusion

In general, mega-menus on desktop are even more mega in 2016 than they were in 2014.

The aesthetics of mega-menus seem to focus on clarity, with more room for text and more consistent formatting. Colours have generally disappeared, as have bullet points.

Menus are still somewhat horses for courses, particularly when it comes to secondary menus and imagery but, call me naive, it seems like ecommerce UX is maturing and I wouldn’t expect to see much change when we review mega-menus in 2018.