:hover’s days are numbered. It has little time left in this world.
I am serious.
Here are the main reasons why:
It doesn’t exist on touch devices
It isn’t really accessible
It often creates frustrating interactions
Touch Devices
I said touch devices, not mobile, for a reason. Touch devices are expanding out of our phones and into our environment at an increasing rate. They are also expanding into our laptops and desktops. So saying your "target market" is desktop doesn’t mean you can use hover.
Because that guy on a Dell Inspiron that he paid $650 for is also going to struggle with them when he touches your website with his fingers. He might switch back to his touchpad... but he also might just leave frustrated he can’t figure out how to open your menu.
Accessibility
Keyboard users don’t get hover. They get active but not hover. That’s a big deal. Screen readers also aren’t the best with faking hover if they do it at all. They are great with active though.
Frustrating Interactions
Just think about nested hover state menus. There is a reason desktop applications require you to click on at least that first level of menus. Because accidentally moving your mouse off of the menu you just opened shouldn’t close it.
This could have landed under accessibility as well. Imagine for a moment browsing your site with a hand that has a tremor. Think about how hard your menu would be for me if my hand shook.
UX Movement has some nice images and discussion around "hover tunnels" and why they are a huge problem for users.
death to hover
So let’s get rid of hover. It doesn’t actually make anything better and it makes lots of things worse. It is a "clever" interaction not a good one.
Top comments (2)
Don't they also get focus?
But overall I agree with your sentiment. Hover will probably never go away entirely but it's certainly decreasing in importance.
Yeah they do get :focus, which can be a reasonable approximation for :hover for keyboard users.