Using color ALONE as focus indicator

[aparnapasi]

I would like to request to add a "Failure" scenario to WCAG 2.0 SC 1.4.1 - use of color. Sometimes, we see scenarios where color is the only way to identify visual focus indicator. A Web site where visual focus indicator is being shown only using color which is very close to the color of non-focussed links. There is no other styling to showcase visual indication for focused links. This would be a failure because users would be unable to differentiate the focused links from the non-focused links. This failure would be parallel to https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/F73

[goodwitch]

I think this is a great suggestion. Example: when an image button is NOT in focus it is navy blue (#00437A) with white text. When that same image button is IN FOCUS it is dusty blue (#327AB6) with white text. There is NO other visual change for a focus indicator EXCEPT the background color of the button. So....just like we fail color of link text (where link text is not at least 3 to 1 against surrounding on link text AND there is no link indicator in default mode)....it is logical/parallel to fail this situation for a focus indicator that is only provided by color alone.

[alastc]

This in in progress at the moment. It isn't currently a failure as the 'visible' of focus-visible is not defined.

Also note that even good focus indicators are technically a change in color (e.g. the white background around a button is replaced by a dark-blue outline). What we're looking for is a change with good contrast (rather than just changing hue, or a very subtle change of color).

There is work on an SC for 2.2 to specifically tackle this issue, currently being drafted as an addition to focus-visible, but it might end up being a new SC.

Having a passing & failing technique is part of the drafting process (this time), so I'd like to close this issue.

If I've misunderstood, please comment or re-open the issue.

[johnfoliot]

There is work on an SC for 2.2 to specifically tackle this issue, currently being drafted as an addition to focus-visible, but it might end up being a new SC.

Until a decision is made on this point, re-opening this to ensure it is addressed. Thanks.

[aparnapasi]

In this case, I am referring to a scenario where only text color is changed and there is NO other change. I believe color is the only way of indication for letting users know the focusable element.

[awkawk]

@johnfoliot that is what the WCAG 2.2 label is for. We won't forget it but we don't want to leave issues open when there is no current resolution possible.

[mraccess77]

Interestingly we have a failure for links within blocks of text that rely on color alone to communicate they are links -- but we don't have a similar failure for focus indication -- likely because of the adjacentness. 3:1 contrast was determined to be sufficient way of communicating something without color. We don't fail links that use color alone if they are outside of a block of text. We had discussed creating a sufficient technique in WCAG 2.1 for this and then addressing this gap with a WCAG 2.2 SC. I agree it's a user issue because for many users with zoom you don't have a lot of controls in the visible viewport and trying to figure out which one is focused compared to the one that is not focused often requires tabbing on and off a control to figure out which is focused.

[alastc]

Hi @mraccess77, would you like to review the draft? It's in a google doc at the moment, if that isn't suitable I can copy to something else.

[mraccess77]

@alastc Sure, I could review the draft - thanks.

[Myndex]

...when an image button is NOT in focus it is navy blue (#00437A) with white text. When that same image button is IN FOCUS it is dusty blue (#327AB6) with white text. There is NO other visual change for a focus indicator EXCEPT the background color of the button. So....just like we fail color of link text (where link text is not at least 3 to 1 against surrounding on link text AND there is no link indicator in default mode)....it is logical/parallel to fail this situation for a focus indicator that is only provided by color alone.

Hi @goodwitch

Just FYI, the example you described is not "color alone", that is, what you described is not a "shift of hue with no shift in luminance" as there is a very definite shift in luminance.

IMO the term "color alone" is not well defined at the moment (I may have missed seeing it in an understanding?), but I suggest that "color alone" means "only hue but excluding luminance."

A shift in HUE by itself is a terrible differentiator for ALL vision types, impairment or not. And of course for some impairments HUE alone is unacceptable and should be prohibited as differentiator. In fact studies have shown that with binocular matched luminance, perceived differences of hue and saturation are substantially reduced. (2016 Detection of between-eye differences in color: Interactions with luminance. Ben J. Jennings; Frederick A. A. Kingdom)

This simply emphasizes relative luminance contrast as the "much more important" factor in detection/recognition. Luminance is about three times stronger than chrominance in terms of detection/differentiation. And it's useful to point out that luminance and chrominance are largely independent and not additive in terms of visual processing toward readability (Legge).

EXAMPLE:

The first three are are each three colors (BG, stroke, font) of very high HUE contrast, but essentially no luminance contrast. The last one is three colors with the exact same HUE (as per CIELAB-LCH) but very different luminance contrasts.

Out of curiosity I ran this through my CVD simulator:

The main thing to note here is how every type of color impairment responds differently, but all see the fourth "BetterChoice" correctly (except for the very rare and unfortunate blue cone monochromacy types, who are missing red/green so have an empty fovea and poor vision as a result — they need alternate accommodation, namely setting the monitor to a monochrome mode).

The last greyscale version demonstrates the lack of luminance contrast for the first three test strips. While there are many types of CVD, if you can make the lower right greyscale readable, then nearly all CVD types should be able to read it (blue cone monos needing to set their monitor to monochrome mode, and low vision problems notwithstanding).

SIDE NOTES: 1) Luminance contrast is processed very early in the visual cortex (V1) and while V1 does some color processing, color is generally considered to be processed later in V4, V4a and V8. The majority of neurons in V1 process contrast alone, or luminance & contrast together, with very few processing luminance by itself. The presence of the high density of contrast neurons so early in the vision processing chain indicate's its critical importance to the total human visual system. Growing consensus is that contrast sensitivity function (CSF) is a better measure of visual functionality than acuity. 2) Contrast perception, and by extension readability, is extremely context dependant, and interrelated to a much wider set of visual stimuli types than might be immediately apparent. luminance contrast in isolation is not particularly meaningful without the context of spatial frequency, which for us is a practical application of font weight, size, spacing. Ambient and local light adaptation, surround effects/simultaneous contrast, etc. all play important parts. 3) Many visual impairments reduce CSF, which shifts the CSF curve down and to the left, simultaneously requiring more luminance contrast relative to their elevated threshold, AND requiring lower spatial frequencies, which means thicker stroke widths (higher weight fonts), larger fonts, and increased letter & line spacing. This implies the extreme importance of the user being able to zoom text by a substantial amount without breaking content, and 200% isn't enough by far.

[alastc]

We have the proposed SC in the public draft: https://www.w3.org/TR/WCAG22/#focus-visible-enhanced

Closing this, please open new issues based on the draft text if needed.