10

In a desktop application when you click a menu, you see all the options which reside within it, in a drop-down/pop-up list.

enter image description here

In many websites with a navigation menu which has sub-categories, I have seen that the title of the menu itself is a page (in addition to the sub-categories being pages too). Like in the example below, if you click 'Take action' you are taken to a page which has links and short descriptions to the sub-categories {Donates, Advocate, Host an event, Attend an event} and link to their respective pages. It is like introducing an extra step in between.

enter image description here

Deviantart, also does similar thing. When you click on a category on the home page, you're taken to the category page with results and then further options of filtering down. BUT, there it makes sense (to me), since the menu is being used as a filter of sorts.

The question: - Is this any sort of standard practice for websites which I am not yet aware of?

A few possible answers:

  • Adding the extra page gives the user more context (on the extra page) of what they will be getting into when they click on the sub-category. If so, why do we not do something like that in desktop applications? I think if the labels are clear enough, there should be no need for it.
  • Is the filter argument which I used for deviantart applicable to the website screen shot I have attached too?
  • Is it a sort of legacy feature from the days where people used menu's as direct URLs (i.e. there were no sub categories) and it sort of stuck on.

3 Answers 3

8

Desktop applications use the operating system's menuing system, and each operating system has associated with it guidelines and conventions about how menu's should be designed and function.

There are no established standards for menus on websites, consequently many if not most are usability failures. Websites with drop down menus that work well are the result of much resources applied to test and refine them (about Amazon's menu). Note that most experienced players on the web (google, Apple, etc.) avoid or minimize the use of drop down menus. Drop down menus are hard to avoid for complex apps like email, but for simpler things they often cause more problems than they solve.

5

For some sites it makes sense to have a root page for each category. Many of those sites will then have the menu item corresponding to the category link to the category root page.

This has been done for a long time already, but it is something that I would argue should be avoided. The main reason is that it only works well when using hover. And since hover is incompatible with touch devices, I would strongly recommend you not use hover interactions unless you are sure your site will only be used with non touch devices (not very likely anymore).

2
  • 1
    If I am not building separate site for mobile devices, does it make sense if I make the menu a standard desktop menu with click to open and see the item list? Also, a couter point, does it feel weird to click to expand a menu in a website?
    – rk.
    Commented Mar 29, 2013 at 17:21
  • Additionally, only using hover is bad for accessibility. A keyboard-only user will never "hover", though they may bring focus to a menu item. This can lead to more questions about what to do on focus + Enter, where to put the focus (first menu item or menu title), and how to indicate to a screen-reader that a header item is both a menu and a link.
    – elemjay19
    Commented Apr 22, 2013 at 21:25
4

The menus behave differently because they are organizing different things within different contexts.

A menu is a visual representation of a hierarchy of "things". What menus and menu items mean to the user, what action they trigger, and how a user "expects" them to behave is dependent upon the context.

Desktop Application

In the case of the desktop application, menus typically organize application functions/features and are within the context of the active window. Selecting an option from the menu will change the state of the current window.

As such, the root level menu items are abstract containers that group application functionality.

The menu in this context is navigation for actions.

Web Site

In contrast, a menu on a web site represents a hierarchy of "pages".

The navigation menu takes you to different "places" within a matrix of "locations" which means that the root items would correlate to a "place". It isn't just an abstract container, but represents something "real".

The menu in this context is navigation for things.

Because "View" in the first screenshot is an abstract concept that groups actions and "Take Action" is a pointer to a page, it follows that the menu would behave differently when the menu item is clicked since the contexts are different.

3
  • So is it appropriate to say that website menus are not actually menus, but are navigation tools (like we navigate folder and files on desktop) and should be represented in a different manner than just repurposing the desktop menu?
    – rk.
    Commented Mar 29, 2013 at 17:30
  • They are menus, all a menu is is a visual hierarchy. What meaning is given to that hierarchy is dependent upon the context. So I guess it is a semantic issue of whether "menu" has a definition that is independent of context. Added: an application menu is a navigation tool--you are navigating actions. Commented Mar 29, 2013 at 17:34
  • Granted that all menus are visual hierarchy, your interactions with them (and the context) are different in the application and website (Changing setting vs opening new page). Hence, my question, whether we should represent them separately.
    – rk.
    Commented Mar 29, 2013 at 17:37

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.