Vertical or Horizontal Menus?
And why?
Horizontal menus look great but you are limited to how many items you can have due to page width. And I know you want more than ten – am I right?
Plus how does your site look on mobile – where you simply can’t use “horizontal menus”?
These days, most websites are about 1000-1200px wide. You can fit around 7 items in your top menu without it looking too crowded. You can use sub-menus or dreaded mega-menus beneath main menu items, but strictly speaking – this means that you have hidden options for the user. This is a little similar to the 2000AD navigation horror . . .
Mystery Meat Navigation
Ever been served a plate of meat by your grandmother but have no idea what it is (and you’re too afraid to ask). Even after eating it?
That’s “mystery meat.” Mystery meat navigation was a term coined by Steve Krug in his 1999 book “Don’t Make me Think.” Linked pictures which lead – who knows where? – are what’s called mystery meat navigation. You’ll also get funny looks from famous website usability experts like Jakob Neilsen if you use images or icons for navigation. In most cases the client has final say, but try to avoid mysterious icons or images which link to – I dunno – your About Website Development page.
Sidebar or Vertical Navigation
Sidebar (or vertical navigation) menus allow you to have many menu items. That’s great right? Not only can I have the usual About Us, but I can also include my download page and my sports page and my . . .
STOP! No. It’s not great.
Adding pages to a site with a vertical menu structure is easy, but – like mega-menus – viewers are offered too much choice. Which can lead to no choice at all.
Horizontal Navigation
There’s plenty of space vertically – so why not just add items there?
I like to give a user no more than 6 top-menu choices.
Users can dig down through the sub-navigation structure (again, I stick to only about 5 options here if we are using dropdown menus) to find more information if they really need it.
Other advantages with Horizontal Menus
- You are ruthlessly forced to focus on 6 main navigation topics
- You are ruthlessly forced to limits sub-nav items to around 6, too
- Everybody knows where they live.
- They don’t disappear below the fold.
- At a glance, users know where they are
- You don’t “lose” your user.
- Nobody has to “think”.
- Users are corralled into making 1 of 6 choices
In a world where the average site visit is 3 seconds, it’s good to get your message across as quickly as you can. You don’t want juicy content linked low down on a front page (say, below your slider). It’s great if users can see your (main) links at a glance.
You quickly attract relevant people to your site while not frustrating those who didn’t want the information and who now feel (because of your exhaustive menu) they have to work to find it.
People don’t like too much choice. Just checkout the 100g tuna variety tins on a Coles (or Woolies) supermarket shelf. Mango salsa, red curry, spicy tomato? I don’t know about you – but all that choice just makes me want to buy pink salmon!
In other words, don’t link to everything in your site right off the bat. It’s just confusing.
Clear navigation menus are a rarity on the web, so keep it simple. You can reveal new elements as the user digs down through the site hierarchy.
The post Vertical Vs. Horizontal Menus appeared first on Geoffrey Website Design & Development.