Colblindor » Web

We are colorblind.com

Daniel Flück — Sat, 12 Sep 2009 19:47:14 +0000

Tom van Beveren from the Netherlands put together a very comprehensive site on all sorts of stuff people should know, if they want to build/design a website which doesn’t exclude colorblind visitors. Because almost 5% of all people are suffering from some form of color vision deficiency, this is something every web publisher should care about.

The site We are colorblind.com includes a lot of very interesting topics related to color blindness on the web. It is structured as follows:

Patterns for the Color Blind: A list of very useful patterns you can follow while you’re designing your web content. If you follow those patterns, colorblind people will definitely find their way around on your page.

Quick Tips: This section provides supportive information for all the patterns from the above mentioned list. If you dig into the quick tips you’ll learn more on how color blind people see the world and how you can use this information.

Color vision and web Tools: Hopefully this is an ever growing list of great tools to help you while you are building your web site or just on your way through the web.

Good and bad online Examples: The examples section gives a good overview of good solutions, which help people with color vision deficiency. The list also includes bad examples; web sites unusable by color blind visitors.

If you think about building a new web page, redesign your site or get your online content ready for colorblind visitors, make sure you visit wearecolorblind.com and follow the tips and patterns provided by Tom.

Tom: Really great work! Thanks.

Colorblind Unaware Colorchoice

Daniel Flück — Wed, 25 Apr 2007 20:04:59 +0000

As I switched my domain to www.colblindor.com a few weeks ago, I lost my Google PageRank. While waiting for the next PageRank update I came across the LousigerBlick blog and had quite some problems deciphering it. This is definitely a good example of a colorblind unaware colorchoice.

Below you can see an actual screenshot of its design. Because of my almost red-blindness I have great difficulties in reading the normal text which is in a dark gray tone (is that right?). Links and titles which are white are no problem to distinguish from the background color, but when hovering over the links in a first glance they look like as if they would disappear as they are also turning gray.

Before you release your design ask yourself if you did a color blindness check, used a colorblind web page filter or made a color contrast analysis. There are many tools available to check your choice of colors; don’t wait; do it now if you didn’t do it before.

Designing with Colors

Daniel Flück — Wed, 01 Nov 2006 20:07:52 +0000

Designing your weblog or homepage is already quite a challenge. When suffering from color blindness this gets an even bigger task.

Mark Boulton started the series Five Simple Steps to designing with color where he digs into color theory and tries to give some hints how to design your web page using colors correctly.

For me, as one of the colorblind individuals among us, already the first part includes the bottom line: Begin with Gray. When I designed Colblindor I had in mind to show what it means to be colorblind and therefore I worked with colors. But when I think about this now it could be even better starting with gray tones – and maybe even stick to them. This would make it definitely readable to all the colorblind visitors and I wouldn’t have the problem not to see it like others see it.

Maybe this will be the next big thing to do: Go back to basics. But maybe Mark shows us some more interesting tips in the next steps so I’ll stick around to see what I can do to make my weblog more readable to all visitors.

Colorcell – The Most Beautiful Color Combinations

Daniel Flück — Mon, 12 Jun 2006 08:35:14 +0000

my living cell

Colorcell wants to find the most beautiful color combinations. I came across this project today through Picto’s entry about The terrible fashion curse. He talks about a wardrobe of a colorblind and how four colors are enough to choose from. Colorcell.org is about choosing the nicest color combination made out of four colors.

What can you do:

Create a new colorcell out of four colors.
Choose your favourite colorcell in the so called livingspace which can hold at most 100 living cells.
Kill your cell, which is also called the suicide option.

If you select a cell the fitness of this cell is increased. Based on the fitness a cell will live longer in the livingspace. But take care, if a cell gets selected to often it will die because of overfeeding.

Every day there is a whole process going on in the livingspace. Cells are aging, some are dying and get burried in the cell cemetery and some cells, most likely the ones with a higher fitness, can crossover and give birth to a new cell.

This project is running since 25th March 2002 and there is a whole load of statistics to look at. If you want to compete with my cell, go to colorcell and create your own most beautiful color combination.

Direct link to the Colorcell Project.

Color Charts

Daniel Flück — Wed, 10 May 2006 09:36:50 +0000

You found a color which you would like to use on your web site but don’t know if it is purple or blue? Or this picture shows some nice details, but are they just brown or shiny red?

For somebody affected by color blindness colors can often not be named like a fork or a spoon but usually are guessed. So you are never sure if it is brown, green or red, you just guess and let yourself be overruled by somebody who knows it better.

What to do if you would like to know the names? In nature it is impossible as long as there are no special glasses which can label the colors you see… But on computers, where colors are always built up from values it is easy to label them. Unfortunately it is not often used and color names associated to the color values like RGB are a rare commodity.

The people behind the Colorblind web site at Telodo Bend did a great job. It offers a comprehensive list of colors with heximal and decimal values and most import including the according color names. The following charts are offered:

So if you want to build a new web site and would like to use some special colors, this is a great resource to check for specific color names and their corresponding color values.