Skip to content

24 ways to impress your friends

Vote down?

Jenn Lukas

Thanks for everyones thoughtful responses so far! I think my character count would have to jump up to 100,000 if I wanted to cover all caveats and awesomes about hovers, so appreciate everyone jumping in to share their knowledge as well! <3 internet community!

The points Patrick brought up on :focus not covering all of keyboard is super important! That word was actually supposed to be a link to Dave Rupert’s great guest article on eff yeah hovers covering where you can and can’t use :focus. I highly recommend everyone read his post

And that’s what happens when you only link one short word. #doh I’ll remember to link more words next time! I’ll ask the crew here to get that link back in the article.

Double @Patrick H. L.:
about aria-hidden:

note that this behavior has been removed in IE11 now.

Really? Dang. I thought that was just in the preview mode?

+++ thanks for answering Shane’s question!! #highfive

@Christian K: In part 3, the first example I show is actually an example of a bad hover pattern. Sorry if that was unclear! I am suggesting however, that the Twitter handle (in this case @jennlukas) is the most important part as that clearly conveys to readers that it is a link to Twitter. I don’t think the bio part is necessary content and can be omitted to both users just reading the screen with no hover and for touch users. The bio is unnecessary – unless of course this is a site for specifically Twitter bios, then you would probably need it! :) Content between devices and size doesn’t always have to be the same, it depends on the content.

@ Bob and Prisca: so glad you enjoyed it and can use it to help find solutions that fit your needs!!

Yay great conversations about hovers!