WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: using glows for contrast

for

From: glen walker
Date: Mar 13, 2019 10:45AM

If you look close, the page doesn't fail under axe. In the upper left of
the results, there's an "all issues" dropdown (to the left of the 'i' info
icon). If the dropdown is set to "all issues", it's going to show
violations, needs review, and best practices and your contrast issue will
be listed. If you change the dropdown to "violations", then you won't see
a contrast issue. The "needs review" shows the contrast issue because it
says it doesn't know if it's a true contrast issue.

I'm not sure if all contrast issues fall under "needs review" for axe. I
tried a simple case with:

<a href="#" style="color:white">hello</a>

<div style="color:white">
<a href="#" style="color:white">there</a>
</div>

<div style="background-color:white">
<a href="#" style="color:white">world</a>
</div>

and all links came under "needs review". Because there are lots of tricks
you can do in CSS to make the contrast ok, axe probably isn't checking the
CSS and just says you need to manually check it. If you look at the axe
plugin page (both chrome and firefox), the #3 item in the description says:

3. It has zero false positives (bugs notwithstanding)

So axe is going to lean on the side of caution and not flag it as an issue
and say you should manually check it.

And since it doesn't fail under axe, it won't fail under Lighthouse
either. Although if you look at the Lighthouse report under "passed
audits", it says all color contrast is satisfactory, which doesn't seem
right.