291518 - Color Picker is Not Accessible

Status: NEW

(Toolkit :: UI Widgets, defect, P3)

Description

[Jerry Baker]

The color picker in Firefox's preferences is impossible to use as a colorblind
person. There are no tooltips to tell me what color each square is, not is there
any indication on the taskbar or anywhere else. It literally makes it impossible
to select a given color.

Comment 1

[Jerry Baker]

Attachment: Palette with simulated colorblindness

This is how the Firefox color picker looks to 1 out of every 12 males.

Comment 2

[(not reading, please use [e-mail] instead)]

in addition to being inaccessible for those with color blindess, it's really inaccessible to screen readers, according to Chris Piper.

to fix this, I think we have some tooltips (or hidden text) for each color.

if we have it, "red", "green", etc is better than hex.

Note, if we don't have these strings in 2.0.0.2 already, we will have to wait until fx 3 to fix this, as we are past the l10n freeze.

but we might have them, I'll have to look.

Comment 3

[(not reading, please use [e-mail] instead)]

For where the fix would go, see http://lxr.mozilla.org/seamonkey/source/toolkit/content/widgets/colorpicker.xml

For a place to start to match hex to english names for colors, see http://lxr.mozilla.org/seamonkey/source/gfx/public/nsColorNameList.h and http://en.wikipedia.org/wiki/Web_colors

axel, can you comment on the localization issue?  I'm pretty sure we'll need to localize all the color names, even though they are not localized when used as HTML colors.

Comment 4

[Axel Hecht [:Pike]]

I'd expect a more suitable way for us to choose colors, that degrades better for visually impaired users. As right now, I wouldn't know what behavior one would expect, really.

Or to put it the other way around, devil's advocate, what's the value of reading out 70 colornames to blind people? Or to colorblind people?

Comment 5

[(not reading, please use [e-mail] instead)]

axel, the screen reader will only ready out the focused color square as they use the arrow keys to move around.

if we used tooltips, that could be of value to the colorblind.

Comment 6

[Axel Hecht [:Pike]]

That doesn't really show the value of reading "Medium slate blue" or "Medium sea green" to someone that can't tell the two apart.
That's likely going to get worse once you localize those, too, as you'd be running into translations of those which are totally non-standardized. I'm sure those color names are a pain to localize, and won't be localized well, that is, without a whole lot of investigation in the a11y community in that area, which may have common translations that actually serve some purpose.

I'd be interested to learn why someone opening that dialog needs to tell colors apart that he can't visually tell apart. That'd enable us to actually serve that need.

On a different but related note, I just played with keyboard navigation in that widget, I could imagine there are a few colors where the frame doesn't contrast right from the color in all color-blindness-kinds.

For clarity, that attachment is for red-green-color blindness, right?

Comment 7

[Jerry Baker]

The only people who don't see any value in it are people who are not so impaired. Let's leave the speculation about whether it's good for us colorblind people to the people who are actual colorblind, k thnx.

Axel: What is your problem? You're asking why someone who can't see the difference between red and green has any business using the color picker? Are you really freakin' serious? Maybe my boss wants me to reply to his message in red. How do I do that without KNOWING WHAT COLOR IS RED???? 

Comment 8

[[e-mail]]

Out of interest, is the style of colour picker at http://neil.rashbrook.org/colours.xul any easier to use?

Comment 9

[Aaron Leventhal]

That's okay. But perhaps the best alternative interface is simply a combo box with an alphabetically sorted a list of basic color names. That allows my to get to the color I want quickly (especially since incremental find is enabled in combos). If the color you want isn't listed, you can also manually set the RGB values.

Comment 10

[Axel Hecht [:Pike]]

I'm with Aaron here.

To clarify, I never said anything against "red", but I think that just pasting the SVG-induced colornames frenzy somewhere in our lcoalized files doesn't convince me.

Now on to "what's basic", I guess. Black, white, red, green, blue, definitely. Cyan, magenta, yellow are well defined globally, too.

Medium sea green, definitly not, I'd say. I'd made a cut after the 8 above, personally. The only issue I'd had would be that I never use #ff0000 when I want red, as that's a pain in the eye. Whether that's a good reason to offer an alternative color palette is something I'd prefer to see propals for.

Comments on the colorpicker: improve arrow key navigation; the mouse selection in the color area should continue when you move the mouse outside of the area with the button down, I was unable to graphically select red; in the text areas, block non-numbers on key down, or capture the events, I see 'a's popping up and disappearing when typing them in, at least on fx2/mac.

Comment 12

[Myk Melez [:myk] [@mykmelez]]

Not sure if it's in scope for this bug or should be a separate bug, but another way in which the picker is not accessible is that one cannot select a color using the keyboard for color pickers that are not |type="button"|.

Comment 13

[Myk Melez [:myk] [@mykmelez]]

(In reply to comment #12)
> Not sure if it's in scope for this bug or should be a separate bug, but another
> way in which the picker is not accessible is that one cannot select a color
> using the keyboard for color pickers that are not |type="button"|.

I have filed this as separate bug 421868.