ilikescience / category-colors

MIT License
148 stars 15 forks source link

Some Comments #1

Closed Myndex closed 2 years ago

Myndex commented 2 years ago

Hi Mathew @ilikescience

Impressive that you dove in and did this in a month.

You mention you wanted comments so here are some:

Comments on blog post

From your blog post:

WCAG 2.2 dictates that non-text elements like chart bars or lines should have a color contrast ratio of at least 3:1 with adjacent colors.

FWIW, I started WCAG thread #695 about three years ago, pointing out that WCAG 2 contrast math, methods, and guidelines are not fit for purpose. I am now an invited expert of teh W3 AGWG, and working on WCAG 3, and invented the APCA.

For more on this, and links to my articles that discuss color accessibility, visit my git catalog

There are lots of colors that have a 3:1 contrast ratio with 1 other color ...But for something like a stacked bar chart, pie chart, or a multi-line chart,....Finding just three colors with a 3:1 contrast ratio to each other is extremely challenging. Anything beyond three colors is essentially impossible.

Yes, it is essentially impossible. And as it happens, the SC demanding 3:1 for non-text elements is not supported by scientific consensus. Contrast is more about spatial frequency than about luminance contrast.

It’s important to note that WCAG is only concerned with color contrast

WCAG 2 contrast math/method as used in 1.4.3 1.4.6 and 1.4.11 are not concerned about color contrast, they are concerned about luminance contrast, that is, the achromatic lightness/darkness/brightness, and not hue/chroma.

We should make the distinction between achromatic luminance, which is processed first in V1 of the visual cortex, and "color" meaning hue/chroma/saturation, which is processed later (V4, V8...)

the relative brightness of colors depends highly on whether or not you have colorblindness

This is a myth and misunderstanding. Those with color vision deficiency (inaccurately referred to as color blind) have normal contrast sensitivity of luminance (lightness/darkness/brightness), particularly the most common type, deutan. This is because the L and M cone types substantially overlap, and in fact, both the L and M cones peak response is in green.

The exception here is for the protan and the color red, for which they are insensitive to. In terms of an sRGB monitor, a protanopia will see the the red primary about 35% to 50% darker. As a result, they have a contrast deficit that is specific to red against black. But in the case of red against a lighter color, the protan has improved contrast. I discuss this in "What's Red and Black and Also Not Read?".

The way people perceive the amount of contrast between two colors varies greatly depending on the biology of their eyes and brains.

This is true, but "varies greatly" really only applies to impairments. Standard vision does not vary "greatly". (Though to be sure it does vary).

The perception of contrast It is dependent on: spatial frequency, eye adaptation level, stimulus relative to to global adaptation, near adaptation, and local adaptation, The stimulus perceptual lightness difference to the adjacent stimulus, the cognitive aspects of perception, the type and variety of ocular impairment, retinal impairment, neurological impairment...

Lots of things, but then also, there is the importance of separating color, as in hue, from luminance, as in lightness/darkness.

Fine details are carried by the luminance channel (such as text)

Color (hue/chroma) is at a third of the resolution as luminance, and a third the strength, in terms of contrasts, and is not additive to luminance contrasts, and color operates mainly at loser spatial frequencies.

An upshot here for DataViz: a very thin slice of a pie chart need very high luminance contrast, while a large area of pie can have a much lower luminance contrast, but does better in distinguishability and coding with hue/sat contrasts.

Readability vs Distinguishability

Readability of text requires good luminance contrast, not color contrast.

Distinguishability of larger form/shape does better with hue/chroma contrasts — with some exceptions for those that are color insensitive.

I have a Brettel—based CVD simulator that also includes a Brettel "inspired" achromatic simulation:

Myndex CVD Simulator

CIEDE2000, LAB, LMS

So, CIEDE2000 is a difference method using CIELAB, which uses the "wrong Kries" transform into LMS space. And Brettel of course transits into LMS space and degrades one of the cone fundamentals.

Some more current models are CIECAM16, JzAzBz, OKLab...

Code Comments

1) Severity

I see what you're doing with the "severity" factor to attempt to derive anomalous simulations, though I think you might want to look at

G. Machado, M. Oliveira, and L. Fernandes (2006)
A Physiologically-based Model for Simulation of Color Vision Deficiency
IEEE Transactions on Visualization and Computer Graphics ( Volume: 15 , Issue: 6 , Nov.-Dec. 2009 )
researchgate.net/publication/38015459...2009

and also

H Fukuda1, S Hara, K Asakawa1, H Ishikawa1, M Noshiro1, M Katuya (2015)
Computer Simulation of Color Confusion for Dichromats in Video Device Gamut under Proportionality Law
IPSJ Transactions on Computer Vision and Applications Vol.7 41–49 (May 2015)
[researchgate.net/publication/275968970_Computer_Simulation...w] (https://www.researchgate.net/publication/275968970_Computer_Simulation_of_Color_Confusion_for_Dichromats_in_Video_Device_Gamut_under_Proportionality_Law)

2) Wrong Coefficients

// Adjusted from the hcirn code
function monochrome_with_severity(srgb, severity) {
    var z = Math.round(srgb[0] * 0.299 + srgb[1] * 0.587 + srgb[2] * 0.114);
    var r =.....

These are not the coefficients for sRGB. 0.299, 0.587, 0.114 are from the obsolete YIQ NTSC space, though still used for some YCC spaces, they are incorrect for sRGB, which are 0.2126, 0.7152, 0.0722, but also:

3) Wrong Achromatopsia

I've seen a lot of these sims use a straight luminance to all three channels and call it achromatopsia, but this is not correct.

At the Myndex CVD Simulator I have a Blue Cone Monochromat simulation inspired by Brettel—imagine if you took a deutan sim and then removed the L cone response. Importantly, BCM has even less perception of red than a protan — but in applying RGB coefficients to find standard vision luminance, there is no degrading for the missing L and M responses.

THAT SAID

There is nothing you can do to design for BCM and also accomodate other vision types. But BCM it is also extremely rare, and co-morbid with low vision and photophobia, and as a result needs assistive technology (thus is not considered part of the needs matrix for author-defined visual contrast).

ilikescience commented 2 years ago

Thank you for all these comments, they are really thoughtful. I agree with the whole lot - there's definitely some improvements to make.

As for your comments about the severity, wrong coefficients, and wrong achromatopsia — it might be worth putting in a pull request on https://github.com/MaPePeR/jsColorblindSimulator/blob/master/brettel_colorblind_simulation.js, as this is where those coefficients came from.

I appreciate your close reading!

Myndex commented 2 years ago

Hi Mathew @ilikescience

As for your comments about the severity, wrong coefficients, and wrong achromatopsia — it might be worth putting in a pull request on https://github.com/MaPePeR/jsColorblindSimulator/blob/master/brettel_colorblind_simulation.js, as this is where those coefficients came from.

Thanks you for letting me know, I'll look into that!