Is removing a link underline on hover not WCAG compliant?

Question

I'm trying to find a definitive answer to this accessibility question. If I set the underline on all links by default...

a {
    text-decoration: underline;
}

...and remove the underline on hover...

a:hover {
    text-decoration: none;
}

...is this no longer WCAG 2.0 compliant?

There's a bit of gray area with the W3C's Success Criterion. Per "Failure of Success Criterion 1.4.1 due to creating links that are not visually evident without color vision":

Link underlines or some other non-color visual distinction are required (when the links are discernible to those with color vision).

We know that a link with default styling that doesn't include an underline fails the success criterion even if the underline is applied on hover. Because as stated above, "other non-color visual distinction are required". Is the same true in reverse?

I've seen a few accessibility tools (e.g., SiteImprove) flag the lack of underline on hover even when it's present for default styling. Does anyone know definitively what the answer is?

Answer 1

I am afraid you are unlikely to find a definitive "you can do that" or "can't do that".

However in this scenario where the link is identifiable in text without hovering due to the underline, I cannot think of any success criterion you would fail by removing that underline on hover.

I am making the assumption that there is a visible focus indicator if some focuses links of course.

I am also assuming that you don't change the cursor behaviour and there will be a cursor: pointer when you hover the links.

Bear in mind that you don't have to underline links. You just have to make them visually identifiable with something other than just colour.

This could be making the text bold, italicised, larger etc.

If you are at all worried then making them bold as well as underlined (or even just bold when hovered and remove the underline on hover) would make sure the link will always have some visual distinction in all states.

The only other thing to consider...link state can be identified by colour alone (visited and active for example) so I would consider hover to just be another state.

The only other final "argument" I have is that of expected functionality. It is one of the largest aspects of accessibility. Would a user expect the underline to be removed on hover? Could that cause confusion or unsettle someone with an anxiety disorder?

I would say it is fine but that might be one for user testing to get a definitive answer!

I am aware this answer has ended up as "opinion", but it is at least educated opinion and the short answer is "it passes WCAG given the information provided"...I just wanted to explain some considerations I would have if I were assessing this for accessibility.