0

We've got a design with a primary navigation menu that uses dropdowns when hovering over the links. We have two options:

  • Disable the primary links and mirror them in the dropdown so the user doesn't miss the link.
  • Keep the primary links clickable without a mirror in the dropdown. (The concern here is that they won't realize it is a link)
  • Clicking the primary links will bring up the dropdown which will include the primary link on top

What are your thoughts?

  • 2
    Related post - ux.stackexchange.com/questions/16217/… – JonW Jul 12 '13 at 15:39
  • I usually vote for the first item. That also allows easier touch-device interactions (disable the main link for touch since there is no hover) – DA01 Jul 12 '13 at 16:25
  • 1
    I abhor dropdown anythings. When GUI's were first introduced we had dropdown menu's and pulldown menu's, the difference being that dropdowns dropped on hover and pulldowns dropped on click. Very early on GUI's settled on pulldowns. I really don't understand why websites/apps are re-visiting all this. Dropdowns are interruptive and cover other information. Menu's and the like should simply not appear until requested. And nowadays there's touch devices as well, that don't even support hover. – Marjan Venema Jul 13 '13 at 10:25
1

It seems simpler than that though. It just depends on the content you have and potentially the amount of content within sections and how it should be grouped. The top nav item should be a category that contains the sub-nav items. If it makes sense to have a landing page for that category, then allow users to click it and land there, and the sub-nav links can go to more targeted pages.

Plenty of sites do this. The first examples I can think of are https://www.wgbh.org/ and https://www.boston.com/. Boston.com interestingly nicely uses a horizontal nav selector under the main item, which them becomes the persistent sub-nav for the section.

If it doesn't make sense to have a landing page for the whole category for whatever reason, just have it be a target to trigger the menu, and clicking that top category item won't do anything.

Many ecommerce sites work this way... https://www.target.com/ and https://www.gap.com/ are two quick examples I could find. You'll notice both of them have "mega menus" to further organize their massive amounts of content.

Both are acceptable behaviors depending on the amount of content and if the grouping makes sense.

It is also worth noting that some sites - like https://www.amazon.com/ - have moved away from ANY real main nav in favor of a much larger triggerable menu and relying on search as the primary interface. This works really well for them, with so bloody much content you'd have to drill for hours with a strict top-down hierarchy!

If you don't know how you should be grouping your content, card sorts and tree tests can help you figure out how things might go together in the minds of your users.

1

It is rather confusing to see same menu item in a dropdown menu. A primary menu used as category (group) name while submenu actually are actions. In this approach a primary menu items have more general names which serve as navigation.

An example from desktop world is modified Calculator menu.
desktop menu

Primary Edit is cue for a user and brings appropriate expectation of submenu, but what is Edit in submenu?

An example from web is eBay menu.
web menu
Primary menu items have submenus on hover and they are links at the same time. My eBay and Summary are the links to same page. But as the names are different they are not confusing for a user.

So the option is to make primary menu both link (good if javascript doesn't work) and dropdown activator. The first item od dropdown menu is the same link as primary item but the name is different which is more closer to action than to category name.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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