I have two options for a dropdown but I'm not sure which one is the best from an usability standpoint. In option (A) there is a explicit "Our services" link which goes to a page with general information about the services. In option (B) this link is in the root element.
I don't like option (B) since it doesn't seem clear to me that the hand pointer that appears when hovering "Services ▼" is because there is a link or because it's a dropdown menu.
The client prefers (B) as they don't have to think of a name for the link, if they choose (A) they will have the root element "Services ▼" and then it would be redundant/ugly to put a "Services" item…
Is there a prefered way for doing this? I always can do a mix of A+B having the link to Our Services page in both the root element and the child item. In either case I should make "About ▼" dropdown consistent with the solution for "Services ▼".
Thanks!
Answer
There is a background issue here which is: Should the sub-menu open on click or on hover?
If you choose to display it on click, it is clear that you can only use OptionA (ServiceA, ServiceB, ..., All services). This works consistently for both touch and no-touch devices.
If you choose to display it on hover, some conflicts arise:
Will the user know that the sub-menu opens on hover? You might argue that as it opens fast the user understands there is no need for click, but there is still a chance he will click the root element.
Will the user know that the sub-menu closes when he "mouse leaves"? This one is more tricky because I can guess some users might click in the root element to close the sub-menu and happen to be redirected.
The only situation in which clicking the root element should redirect is when there is no sub-menu (so the root element is a link).
I would stick with click. In any of the two cases (click or hover) I would use OptionA (ServiceA, ServiceB, ..., All services).
No comments:
Post a Comment