ThePacielloGroup / CCAe

The Colour Contrast Analyser (CCA) helps you determine the legibility of text and the contrast of visual elements, such as graphical controls and visual indicators.
http://www.paciellogroup.com/resources/contrastanalyser/
GNU General Public License v3.0
479 stars 108 forks source link

Add check for max color contrast of black on white #73

Open vizionsinmotion opened 6 years ago

vizionsinmotion commented 6 years ago

Any possibility of adding a check to help id and avoid the max color contrast combination of black/dark text on white background?

https://accessibility.digital.gov/visual-design/color-and-contrast https://irlen.com/what-is-irlen-syndrome/

patrickhlauke commented 6 years ago

is there an actual recommended maximum contrast? is there any normative reference anywhere?

vizionsinmotion commented 6 years ago

There is no actual max contrast recommendation that I know of but both black text on white background and white on black both have the max luminosity ratio of 21.0:1.

Having black text on white can cause words to jumble, invert, float, shimmer, blur, or disappear (along with migraines) for those with Irlen syndrome, light sensitivity, Dyslexia, etc. but white/light text on black/dark background tempers the effects while meeting contrast for those with color perception issues. So the request is for a check for black on white to help designers/dev realize (and hopefully avoid) the impact.

patrickhlauke commented 6 years ago

we can certainly consider adding a warning, but it needs to be a useful and ideally generally accepted maximum. we could check just for the maximum of 21:1, but should that just show for 21:1 exactly? what if it's #000001 on #fffffe? is that acceptable or not, as it's just a shade below 21:1? in short, it'd be good to have a certain (ideally backed up by some research) threshold, beyond just triggering for that combination (i'd also doubt that designers will check pure black on white / vice versa for contrast ratio, as they'll know that's the maximum possible contrast - these checkers are generally used when there's already a hunch/doubt on the part of a designer if a contrast is too low; and, to be clear, CCA is a manual check tool, it is not simply pointed at a page and then identifies any particular color combinations - users have to actively enter/choose colors, after which they get shown the contrast ratio)

vizionsinmotion commented 6 years ago

Yes, an assumption is for testing on all A11Y elements as standard/best practice even as cursory for elements expected to pass. Ideally, they begin to learn about the other end of the spectrum and the warning would be very helpful to build that awareness.

FYI - # 000001 on # FFFFFE still appears as 21.0:1 because it is not enough of a difference to drop below 21. Since the level of impact varies and differs for black on white vs white on black, it is not as easy to determine a "line in the sand" value here if other than 21.0:1 for black on white.

Can do some additional research but this could take a little time.

vizionsinmotion commented 6 years ago

Some supporting guidance from W3C:

https://www.w3.org/WAI/test-evaluate/preliminary/#contrast https://www.w3.org/TR/low-vision-needs/#brightness-and-color https://www.w3.org/TR/low-vision-needs/#text-contrast https://www.w3.org/TR/low-vision-needs/#light-sensitivity