Skip to main content

Navigation

Navigation

When you descend into a menu, it shows the item in question, its siblings, and its children, plus the site root.

This lets users drill down without losing a sense of place, while still keeping the number of items on the visible menu at a reasonable level.

If we had this:

Home

  1. Major Thing 1
    1. Subset 1.1
    2. Subset 1.2
      1. Subset 1.2.1
      2. Subset 1.2.2
    3. Subset 1.3
      1. Subset 1.3.1
      2. Subset 1.3.2
      3. Subset 1.3.3
  2. Major Thing 2
    1. Subset 2.1
      1. Subset 2.1.1
      2. Subset 2.1.2
    2. Subset 2.2
    3. Subset 2.3
      1. Subset 2.3.1
      2. Subset 2.3.2
  3. Major Thing 3

Then the menu would normally look like this:

  • Home
  • Major Thing 1
  • Major Thing 2
  • Major Thing 3

But when you click on Major Thing 2, it’d change to this:

  • Home
  • Major Thing 1
  • Major Thing 2
    • Subset 2.1
    • Subset 2.2
    • Subset 2.3
  • Major Thing 3

(The selected item, its siblings, its children, and the site root.)

If I picked Subset 2.1, then, I’d get something like this:

  • Home
    • Major Thing 2
      • Subset 2.1
        • Subset 2.1.1
        • Subset 2.1.2
      • Subset 2.2
      • Subset 2.3

 

(The selected item, its immediate parent, its siblings, its children, and the site root.)

The menu almost works like the breadcrumbs, except it shows you the other items at the same level as what you’re on.

expand_less