These help bring unity, allow consistent navigation across multiple pages and are a handy place to present alerts and a search bar.
They’re also much tidier and take up less space than the traditional layout of having a large logo at the top of the page with navigation options beneath.
This practice can end up filling a large proportion of a homepage, which leads to further problems of how to adapt the navigation when exploring other parts of the site.
Here are 11 neater examples…
Let’s start with the most obvious, Facebook’s permanent thin strip of blue where it houses alerts, a search bar and other navigation options no matter where on the platform you go.
The Guardian
The long-promised revamp of The Guardian’s website will involve a permanent upper menu bar neatly housing navigation, search and all of its subdomains.
As it’s a responsive design, this shrinks down based on the screen size, reallocating pages within the hamburger menu.
Inbox
Gmail’s new email app keeps its navigation simple and icon-based, with a high priority on search over email folders.
Flickr
The photo-sharing platform keeps everything tidy with simple drop-down menus that open when you hover over them.
Mashable
Mashable maintains its categories here and also highlights its social channels. There’s also a great long-form search box that appears when hovering – it manages not to take up too much room and feels entirely organic to the menu.
Booking.com
This menu is more for presenting alerts, and perhaps a super-navigation bar isn’t ever going to serve a travel site particularly well as there’s so much search criteria needed, but it’s great for community admin and providing access to your favourites list.
Apple
Possibly the only ecommerce site featured here. Apple uses its menu to specifically guide people towards product homepages and the search button opens up nicely within the bar.
PayPal
Access all of PayPal’s key features from its newly designed navigation menu, featuring search and alert notifications.
Social seems to be one of the key places to find good examples of super-navigation. Twitter has recently moved its ‘create tweet’ button up to here too.
Marketing Week
Our sister publication Marketing Week has undergone a recent overhaul and now features this simple menu which stays pinned to the top of your screen as you scroll up and down the page.
Econsultancy
Finally it would be remiss of me not to mention our own website overhaul and its navigation bar, featuring a super-powerful search tool and giant mega-navs.
Now this is still a work in progress, and you can read all about the redesign process here in Econsultancy’s new responsive design, so please do tell us what you think.
Comments