It’s easy for designers to overlook navigation menus.

There’s a couple of standard layouts we’ll reach for every time, telling ourselves, ‘that’s what users expect.’ And it’s true that sticking with what works makes better sense than reaching for novelty for its own sake, and that we do we have to design with user expectations in mind.

But when header navigation menus are the primary way users navigate a website, shouldn’t we look again and see if we can improve ours? Users won’t see any of our other design swag if they can’t even get off the homepage, after all.

I’m not advocating simply stealing one of these. But I am suggesting taking a lesson from them and building on their ideas, to create header menus that are actually better than the norm.

With that in mind, here are seven of the best innovative header menus you’ll see on the web today.

1: Reiss

Reiss is a clothing business based in the UK. Their multi-option dropdown menu is familiar if you’ve ever bought clothes online.

But unlike the vast majority of ecommerce businesses, Reiss uses images right in the menu drop-down.

Instead of having to read a text description, click through on the basis of that alone, and only then be confronted with an image of the product you’re considering, a visitor to Reiss can simply see items immediately.

We know that users are strongly influenced by ecommerce images. They’re a major selling factor. So doesn’t it make sense to introduce them as early in the customer journey as possible?

Disappointingly, though, they don’t carry that innovative approach over to their mobile site, where the menu is a standard text menu from a hamburger in the top left corner.

Maybe that’s because Reiss doesn’t sell much on mobile – but we know ecommerce buyer journeys often start on mobile, so if you’re thinking of borrowing this menu idea, try to find a way to implement it equally well on the small screen.

2: Ruya

Ruya’s navigation befits an agency that prides itself on design. The homepage header image is a map of the journey through the website as a big graphic; rather than reading text, users can select a place on the map to visit.

This is a nice touch because it replicates play – many users will be familiar with video games that feature interactive maps like this one.

For cautious users who don’t want to try the new-style interactive animated menu, there’s a traditional hamburger menu at the top.

This menu layout comes with some great upsides. It’s intuitive, not because it’s generic but because the idea is familiar and makes sense. It’s impressive: after you see it, you won’t forget the agency’s name. Is their interactive menu a form of content marketing? I’d say so.

But it comes with some problems too. It slows the page down. The effect is less than you’d expect, but if your computer or your internet connection isn’t at least pretty fast, you won’t get much out of it besides frustration. And implementing it means significant custom code has to be written for the homepage – that’s a lot of work to put into a design idea that you don’t know will pay off.

On mobile, sadly, Ruya’s stylish, original menu is reduced to a static background image.

It’s still visible, and it still looks good. But it doesn’t function as a menu. Assessed as a header image, it looks kind of busy, messy and – well, inferior in many ways to other choices.

If your customers usually come with superfast broadband and you can spare the dev hours as well as the design effort to create something like this, though, it might be the thing to put you ahead of the competition. But again, considering that mobile is actually the first screen now, shouldn’t you make sure your creativity actually gets seen by the majority of your visitors?

3: Mashable

Giganto menus are popular among content-focused sites. The reason is obvious: sites like this simply have more pages. (Mashable.com has 256,000 pages. Really!) And users naturally want the newest stuff, categorized. In an era where the newspaper and the magazine have both had their functions usurped by algorithmically-curated newsfeeds rich in pictures, ads and video, a magazine site really needs more than a dry table of contents.

This move is more forward-looking than it might seem. When tech magazines like Wired first moved online, they kept a magazine publishing schedule, remaking the site every week like a new issue. When they realized users only visited when they had new content, they switched to continuous publication.

The issue then was a publishing schedule built for the paper magazine. On the web you can publish in increments, and everyone now does. But for magazine sites, header menus don’t have to mimic the contents pages of actual magazines. Unconstrained by ink and paper, header menus can be dynamic, colorful, intriguing and informative – an asset in their own right, and still help you find what you want.

Sadly, just like so many others on this list, Mashable’s mobile menu is much less interesting. The screen-filling meba menu of the desktop site becomes a stack of tiles on mobile:

4: Monopo

Monopo go a step further than most brands would dare in making their menu center stage. Initially their homepage has a standard header menu. Click on an item, though, and you’ll be taken to a menu that fills the screen. There are images for menu items, with animations that hold attention and pull the viewer in. Select a subcategory and the illustrated menu becomes scrollable, letting you move down the page and see more without having to click. It’s menu as experience, as feature, not a grudging afterthought.

On mobile, the menu looks much more ordinary. There’s a classic top-right hamburger, a drop box front and center, and then the user scrolls down the screen past clickable images.

It’s a layout that’s actually more familiar from blogs than the main part of a website, but still not as new and intriguing as the desktop menu. What it does have going for it it that it’s very visual, intuitive to use, and even in its mobile version the carefully selected images convey a sense of the agency’s approach.

What it doesn’t offer, though, is an innovative mobile menu experience. The images are great, but they’re still just a tile stack.

5: Paper Television

We’ve looked at sites that put their menus right where users can’t miss them, focusing on creating a user experience that lets visitors take control of how they navigate the site right from the get-go.

But Paper Television is one of a growing number of sites to take the opposite approach and go for a globally hidden menu. The Paper Television menu is a top corner hamburger. Doesn’t that stop users from finding their way around?

In theory, it’s good design to have a menu that’s unmissable and in a standard, recognizable location. But for many mobile users, a hamburger is standard and recognizable. Throw in the fact that Paper Television’s traffic goes mostly to its homepage:

And consider the fact that landing pages convert far better when menu items are removed – sometimes as much as 100% better. If their homepage is essentially a landing page, shouldn’t Paper Television remove visible navigation as much as possible while keeping the ability to navigate the site for those who actually want it?

Furthermore, their homepage is almost identical on mobile – just slightly different dimensions.

A really mobile-first experience should go beyond just designing for mobile display, and look at designing for mobile users’ expectations and habits.

An always-hidden menu, a consequence of the reduced real estate on a mobile screen, makes perfect sense in this context, so we might be seeing more of them down the line!

Conclusion

There’s a range of different menu styles on display here, from menus that take over the site and fill the screen to menus that hide themselves away. The most important thing about all these menus is that they start with trying to give the user something fresh and different – they’re trying to take some of the most valuable real estate on a website and turn it into something more than just a row of five to seven clickable options.

Where many of them fall down is on mobile, where the interesting, stylish creations their designers put on their desktop sites tend to give way to same-old, same-old scrolling cards. What can we do about that? Let us know in the comments below – and go make your menus awesome!