The Desktop Web Application I'm working on has vertical navigation with a primary nav and secondary nav. The secondary nav displays sub tabs from the primary nav.

The user has the option to collapse the secondary nav if they choose to do so. I'm unsure of whether it should open back up when the user navigates to a new primary nav option if they have explicitly collapsed the secondary nav on their current page.

Quick Mockup of what I'm talking about

Edit for more Context: The reason we want to give the user the option to collapse is due to many users working in smaller sizes with tables that are quite complex and often have many columns of critical information.

  • 2
    Difficult to give a meaningful answer, apart from "it depends ..." please describe in more detail, a mock-up would help a lot.
    – Garik
    Dec 13, 2017 at 21:23
  • 1
    Does clicking the primary navigation take them to a page within the subnav, or is it a page all on its own? Is this a single-page app, or does the whole page reload as they navigate? Dec 13, 2017 at 21:28
  • @Garik I've added a mockup to show what I'm talking about. Dec 13, 2017 at 23:24
  • 1
    Do "Title"-s have any other function besides revealing sub navigation?
    – Garik
    Dec 13, 2017 at 23:34
  • 1
    Keep it simple. Remove the collapse button from the secondary nav, and just let the primary nav toggle the show/hide of secondary nav!
    – SNag
    Dec 14, 2017 at 7:14

3 Answers 3


It depends on the workflow.

Do your users usually need that secondary navigation when they navigate to a new top level page? If so, it will probably be helpful to pop it open each time, even if they have to manually collapse it again.

Are the contents of the secondary nav accessible in some other way from the top level pages? If so, leave it collapsed if the user chooses to collapse it.

The answers to these questions should be apparent after interviewing or observing a few of your users.

You could also test dynamically collapsing the secondary nav when the user selects something from it. That way, it opens when they select a top level page, then collapses again when they select a second level page.


As per my vision,

Firstly : if the primary navbar is active all time then it will affect to the contains of the page.

and Secondly : the secondary navigate option is too much close to the title... may be it will give confuse result when the user tap over here

so i have a better option made for you in bellow image, hope it will work for you enter image description here

I represented all the things (secondary nav contains) in tabs.

  • It's a bit unclear from your description, but I'm guessing the nav is only shown when pressing the burger icon, otherwise completely hissen? This is only a good solution if the secondary nav should be shown at all time, otherwise it takes up way to much space. It also depends on how many options the primary nav has.
    – Anders
    Dec 14, 2017 at 8:39
  • Also your example is a device, Matthews seems to be for a computer screen, that makes a difference also.
    – Anders
    Dec 14, 2017 at 8:41
  • @Sushant Kumar Pradhan Sorry if it wasn't clear at first but this is for a desktop web application. Dec 14, 2017 at 17:16

There's no need to have a collapsable secondary navigation. It makes it confusing and adds multiple steps to its use. If you have an actual content page under the primary navigation, then the solution you picked isn't going to work well with a secondary navigation. Normally you use this kind of navigation when you want users to pick choices to narrow down to the deepest level. For example how it's used:

Example BBC Good Food

BBC Good Food example Second level BBC Good Food

Pages with no additional levels are visually shown to have their path 'ending' on the current level (no chevron). Usually if there's both a primary navigation page AND a secondary navigation page, you'll opt for a (mega)dropdown menu for desktop and a solution similar to the one above for mobile, or you don't show secondary navigation until someone is already on the primary navigation page.

  • Sorry that this wasn't clear but this is a desktop application with content that can take up a lot of space hence why my thought was to collapse here. Dec 14, 2017 at 17:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.