3 ms·
Tell HN: You can differentiate hovers on visited and unvisited links
If you specify a slightly lighter or darker link color on hover, and also give different colors to links that have been visited (a usability win), I just want to let you know that you can (and should) also style the hover effect on visited links differently.
a:link { color: (blue); }
a:visited { color: (violet); }
a:link:hover { color: (lighter blue); }
a:visited:hover { color: (lighter violet); }
Same goes for :focus (treat this like :hover) and :active.
The only browser that gets confused is IE6, which isn’t so popular anymore; the fix, if you care, is to repeat your :link:hover style without :link, after your :visited:hover style is declared. (This is because IE6 erroneously ignores multiple classes and pseudoclasses on the same element in selectors.)
- nck4222 16y agoIt's cool, but is this really a usability issue? I don't think a user is going to see a violet link, realize they've visited it, then hover over it and still need another indication that they've visited it.
- alanh 16y agoIt can be jarring for (say) a purple link to turn blue. And if you were absent-mindingly mousing around (people do this) and then look at the link under your cursor, you could get “lied to” that it’s an unvisited link. Biggest deal? No. Easy fix? Yes. (Especially with Sass, where lighten(@visited_color, 3) makes it trivial…)