Color blindness: Are you aware of it? Do you design for it?

Question

I'm curious whether many of us who do design or take design decisions have ever heard of this problem.

I'm aware there are dangerous color combinations, like green + red. This is probably one of the most popular cases of color blindness. If you have green text on a red background and vice versa some people won't see anything.

I've also seen in practice that green text on a blue background was not seen by one guy.

What other color compositions should be avoided, and how often these cases are to be expected?

Let us make some ranging by encounter probability who has the numbers.

Addition: I've just remembered one very bad example that causes problems to just about everyone - blue text on a black background. It's unreadable for all intents and purposes. Never could understand what could possibly compel a web master to use this color combination...

Answer 1

I allways test my pages in http://www.vischeck.com/vischeck/vischeckURL.php to make sure I havent chosen really bad colors. Or this one http://colorfilter.wickline.org/

Answer 2

My direct boss is colorblind, so yes we take this into account. ;-).

Answer 3

I think it must be pretty common, and developers who do not take it into account are doomed to lock out a surprisingly high proportion of their customers. In my workplace, out of around 30 people in the R&D department, 2 are colour blind to some degree, and one is of restricted vision - he needs to use the windows "High Contrast" colour scheme to get any work done. A good test is to run your app in the various high contrast schemes. If you haven't done it I can pretty much guarantee it will be unreadable. You need to be able to handle schemes like this for better accessibility.

Answer 4

In Windows you can query the system for the System Colors. I allways use them.

You can test your app, using high contrast screen settings, if all is readable I suppose it's ok.

The article that opened my eyes to this is here: http://msdn.microsoft.com/en-us/library/bb263953.aspx

Answer 5

Yes, definitely need to consider it in any case where you are using colours to identify and/or demark things.

Classic case is traffic light style indicators which are generally red, yellow and green. Red/Green colour-blindness is quite common. If you are creating apps that need to comply with accessibility legislation you have to take this, and a host of other things, into consideration.

The government of Quebec in Canada recognise this to the extent that their actual traffic lights are different shapes as well as different colours. Makes sense really.

Answer 6

I've done some work for US gov departments who are bound by section 508, so it does come up.

Red/Green is by far the most common form, but others exist (notably blue/yellow and monochromatic) so in general the important thing is to maintain high levels of contrast.

Answer 7

Apart from green + red, another relatively common type of color blindness is blue and yellow.

We take color blindness into consideration when creating our games. One game we designed (Arcade Lines) features colored balls you have to align in same-colored rows. We tried to account for color blindness by offering a special skin for color-blind people which not only has different colors, but also different shapes (one shape for each color).

Answer 8

Websites should cater for everyone, whether they're colour blind, deaf or whatever.

The Royal Institute for the Blind in the UK has some interesting articles on web designing for partially sited people; link text

Including colour-contrast link text

and the use of colour to convey information link text

Answer 9

I can suggest you this website. It has a colors scheme selector and in the bottom right part of it there is a drop down menu used to switch between common eye related problems and changing scheme accordingly

Answer 10

I'm color blind myself, of the green-red type, so yes, I take this into account :)

Do follow the design guidelines mentioned in the websites others have linked to. But there are some ideas I'd like to stress:

• Hardcoding any colours may not be a great idea. Configurable and skinnable are good.
• In particular, hardcoding indicators to "the red one = bad, the green one = good", may not be a good idea.
• And, hardcoding the same indicator to "when it's green it's good, when it's red it's bad" IS definitely a bad idea.

(Is the battery charged?)

Answer 11

Actually I've never though of this. However thinking back now I can't remember any cases where my applications would have depended on color either. Text is nearly always white or black (though red or green are sometimes used), and background colors are pretty pale, mostly just for some eye-candy, not information. I'll keep this in mind now though. It's not that hard do get a webpage to be kinda-high-contrast. :)

Answer 12

Red-green may be the most common, but not the only type of colour deficiency.

In general, your user interface should still be visible and usable when viewed as grayscale or sepia tones. Text and backgrounds must have a high level of contrast to allow distinguishable shapes purely by tones and not colour.

Visual elements that involve colour and not unique art/icons can be accompanied by text to give more detail descriptions on what they represent.

Answer 13

Color Oracle is a great tool that simulates different types of color blindness. You can run your app/website, and run this app -- it will give you a good idea of how color blind users will interpret your creation.

http://colororacle.cartography.ch/

Answer 14

I found out this the hard way when I told my colleague to press the red button.. when he said "which one?" I thought he was just being dim, so I told him again.. then he told me he was colour blind and I was the one feeling stupid.

He works for the railways now, writing signalling software. Good job the red light is always the one on top :)

So do you have to take colour blindness into account? Possibly not, just like you don't design your screens for large font support too, but you should if you want to do a truly good job instead of a mostly acceptable one.

Answer 15

I once wrote an in-house application that featured a scatterplot with different series distinguished by color. My primary user turned out to be color-blind (red-green, I think), so I supplemented the color with variation in symbols.