2

I was reading this article about tips & tricks for Bootstrap 3 and it has a trick for a hover dropdown (so you don't have to click before a menu pops up).

Should I enable this? Is it generally found annoying or something else?

  • 1
    How would people on a tablet activate it? Or what about people who use a PC but don't use a mouse and only use it keyboard? – JonW Sep 28 '14 at 13:01
  • 2
    FYI, the technical terms are 'drop-down' (those that open on hover) and 'pull-down' (those that open on click). – SNag Sep 28 '14 at 14:25
  • 1
    If you end up using hovers, please please please put in a bit of a delay on the hover so your menus don't pop up when you pass over them on your way to someplace else on the page. – Ken Mohnkern Sep 28 '14 at 15:45
  • Some (Many) users find Hover Menus annoying - triggering on the way to somewhere (Browser button perhaps?) - obscuring Content. Can Hover Menus be disabled in the Browser ? – Jules Dec 20 '17 at 18:19
2

Depends a lot on which kind of thing you work on.

For example if it is primarilly targeted on mobile, do not enable dropdowns on hover. On the other hand, in case your thing is a desktop application and you have a strong reason (like complexity, lack of mobile users, speed of use, enough hit area in design etc. ) - go for it.

  • It's a client area for a hosting company. – William Edwards Sep 28 '14 at 14:18
  • +1 for asking for the benefits of this technical solution. If there is no benefit, then drop it. – FrankL Sep 29 '14 at 8:43
1

When taking a Mobile First approach, your navigation would be determined by your product being used on a phone. If this is the case, drop downs would be a poor choice. Not only do hover States not exist in mobile, but they increase complexity (typically unnecessarily). This scales to desktop where ideally you would share the same navigation hierarchy -without drop downs.

If you're looking at strictly desktop, hover effects are still very valid, and could be a useful tool. However, if in the future there is potential for mobility, it still might be prudent to look at other, simpler navigation options.

Finally, if a client is requesting complex navigation systems, it's our duty as UXD to inform them of the potential pitfalls of such choices, and help guide them in a more paired-down direction.

0

If you're creating for desktop, it's ok to enable it. Just don't forget to add a little delay on it so the user's screen don't start showing lists nonstop on passing the mouse fast, that can be annoying.

  • Why is it OK to do this on desktop? – JonW Sep 29 '14 at 6:08
  • Using a fair delay seems ok to me. Since user stops the mouse on that option for a little bit it's like expecting something to happen. Without delay the hover menu can hide information from the website and become annoying. – Carbon Sep 29 '14 at 12:25
  • OK that's fine for people with a mouse plugged into their machine. What about everyone else? – JonW Sep 29 '14 at 12:28
  • You got a point there JonW, desktops without mouses/trackpads, I didn't think about those. Thanks for reminding me that. But what devices could they use instead? – Carbon Sep 29 '14 at 12:35
  • 2
    That is part of the point. If someone only uses a keyboard there is no way for them to trigger a hover state. So for that reason I don't think that is is OK to enable hover on desktop (or any device). – JonW Sep 29 '14 at 14:03
0

There's an option to keep both. Some users will find it very useful to have a hover feature, especially on a desktop.

While for the others, mainly the touch screen users - You can make the following adjustments in your CSS: https://stackoverflow.com/questions/2851663/how-do-i-simulate-a-hover-with-a-touch-in-touch-enabled-browsers

0

You can use it if you make sure touch enabled users can still use it.

Also, make sure the page won't reload when users try to enable the hover drop down with a click. I've seen some examples where users tried to click which caused the page to reload and resulted in no drop down.

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.