How to deal with multilevel menus

Question

I trying to design a horisontal menu that sometimes will go three levels down. The thing that drive me crazy is to know if I should show all the levels.

For example:

About us, Products, Contact

• Product category 1, Product category 2, Product category 3

  • Sub category 1, Sub category 2, Sub category 3

    • Selected Product page

On Apple.com, IBM.com or GE.com they usually skip the second level. And from a design point of view it looks good but unless there isn't a breadcrumb menu somewhere there is no way to know where you are in the structure.

How do you generally deal with the connection between global and local navigation?

Answer 1

By "unfancy multi-level horizontal menu" I hope you mean something like example one

not example two .

There's nothing wrong with putting primary and secondary in the nav and jumping the user to the product landing page for further drill-down.

Ikea ( http://www.ikea.com/ca/en/ ) does a pretty good job of displaying all their products several different ways -- old skool index page (all products), by category and sub-category and even by function or interest area. Although why their primary nav doesn't highlight to indicate position is beyond me.

Answer 2

Generally, I only show how deep the navigation goes once a user makes a decision (i.e., clicks a link). If they click a global navigation link, it takes them to that section and they might see a local navigation for that section. If they click a local navigation link, they'll be taken to that page and then they'll see the local-local navigation for that sub-section. And so on.

I like this approach because it lightens the cognitive load on the user. They don't have to scan through all the levels of navigation at once; they get it as they move deeper.

However, using what Jakob Nielson calls "Mega Drop Down Menus" are a solid alternative (assuming they are designed properly). These show all the levels in a navigation in a big 'ole drop down.

Here's an example: http://prototype.php.net/

But there are some possible pitfalls using mega drop down menus.