ColorBlindness Site Checker

[SyrenSong]

Very few people think in terms of testing for color blindness when designing websites. But there are several forms of color blindness out there and you could be designing them right out of the picture by your color choices when designing a website.

At www.vischeck.com (http://www.vischeck.com/), you can test your site online for various forms of colorblindness and see the results for yourself.

It's a pretty cool concept and a real eye-opener for some designs!

Syren

[mrbuyout]

Syren this was a REAL eye-opener!!! One of the things I was so concerned about was appearence,since a great deal of the value in trading cards is HOW THEY LOOK! I did find two examples of washed color on my Front page!!!
Thanks to your post I will see if that can be corrected!!!
Thank you again!!!

[SyrenSong]

Glad you found the site as helpful as I have. I didn't realize there were several types of color blindness. I knew about red-green and that was it. Boy, was I surprised!

Syren

[mrbuyout]

I was in the same frame of mind!!I didn"t know there were sveral types either!My mistake! MAJOR mistake
Am talking with designers now to correct this quickly

[Webnauts]

Maybe you would like to have a look at this tool here too:

http://colorfilter.wickline.org/

Buy the way some stuff worth to read:

http://more.btexact.com/people/rigdence/colours/colours.pdf

http://www.toledo-bend.com/colorblind/Ishihara.html

[Webnauts]

Here some more links...

Testing Tools and more:

1. Considering the Color Blind Design Evaluation: http://newmanservices.com/colorblind/default.asp
2. Colour Contrast Analyser: http://www.juicystudio.com/services/colourcontrast.asp
3. Colour Picker and Tester: http://www.tesspub.com/colours.html
4. Color Metric Converter: http://colorpro.com/info/tools/convert.htm
5. Colour transformations - Decimal: http://more.btexact.com/people/rigdence/colours/colours1.html
6. Colours confused with neutrals (Hex): http://more.btexact.com/people/rigdence/colours/neutrals_hex.html

[SyrenSong]

Thanks for all the additional links and info, Webnauts!

That's great stuff. :)

[Webnauts]

Another cool tool: http://www.pixy.cz/apps/barvy/index-en.html

[weegillis]

Very insightful (punn intended). Thanks for posting these resources. It is reassuring to know that our site is moving toward 'universal clarity' when it comes to color choice.

One question, though: Is there a pencil and paper algorithm to help calculate percentage differences in
1. brightness
2. contrast
3. RGB values
just by using the color values? My method to date has always relied on a visual assessment with no clear way of knowing.

[Webnauts]

Hi Weegillis!

I guess below is what you want?

"Color brightness is determined by the following formula:
((Red value X 299) + (Green value X 587) + (Blue value X 114)) / 1000
Note: This algorithm is taken from a formula for converting RGB values to YIQ values. This brightness value gives a perceived brightness for a color.

Color difference is determined by the following formula:
(maximum (Red value 1, Red value 2) - minimum (Red value 1, Red value 2)) + (maximum (Green value 1, Green value 2) - minimum (Green value 1, Green value 2)) + (maximum (Blue value 1, Blue value 2) - minimum (Blue value 1, Blue value 2))

The rage for color brightness difference is 125. The range for color difference is 500."

[weegillis]

Yes indeed, Webnauts. Just the ticket. Thank you for posting this.