Compliant style / journal / hicksdesign

26/09/03

Compliant style

Joe Clarks’ Fawny blog talks about a category of web design he’s noticed and labelled “The International Compliant Style” (IC-Style). He describes this as being “employed, though not necessarily through conscious decision, by the majority of developers and designers who are committed to following official specifications”. He mentions stopdesign as an example of someone subverting the rules of the style, but I thought that mezzoblue would be an even more radical example. Hicksdesign is one the of the sites that Joe lists as following the rules of IC-Style.

Joe gives some explanations, but I have my own reasons for using the colours that I do. Perhaps I’ll share a little secret with you (and risk losing any client that ever visits this site). You see, I’m colourblind, and more specifically, I have problems distinguishing between blue and purple, and green and brown. This is called ‘red/green colourblind’. I can see tones, but hold up a blue square and purple square, and I’ll probably just see 2 blue squares (handy that you had some coloured squares lying around though).

To test for this, you’re made to look through a book of what looks like random colour dots. Your ability to see the numbers or letters within the dots tells you what colours you are affected by. These can be really frustrating, and leave you crying “No I can’t see anything – its just dots!!”. Many teachers would tell me that I’d drawn “a very nice picture of a green monkey”.

Over the years I have ‘taught myself colour’ through print design and the CMYK palette. I know that 50% cyan and 100% yellow makes green for example. I’ve always had people I could ask as well (my wife gets the brunt of it). There’s also common knowledge. For instance, I know that grass is supposed to be green, therefore when I look at grass I say “hmm… green!”. However, in summer when grass dries up and goes brown, I actually see it as light green. Any concerned clients reading this might now need to reassure themselves that I have a double life as a wildlife illustrator, so I can get by.

What does make life hard are the tiny colour swatches in apps like Photoshop, Dreamweaver etc. When small, and all placed together in one large block, its very hard for me to distinguish colours. I now have a large printed(!) chart, with a good range of hex colours with the colours labelled. Choosing colours can still be a bit of ‘process’ though, and thats my reason for using grey a lot!

Technorati Tags Tags: design.colourblindness, webstandards

Comments | RSS

Comments are now closed, but you can still have a jolly time reading what others have left:

Scott Johnson said 1843 days ago:

Jon, you never cease to amaze me. For someone who is colorblind, you put together some excellent colorschemes. And your illustration skills are right up there, too.

Egor Kloos said 1843 days ago:

Being color blind is actually quite common among designers. I know a at least three designers that have some deficiency in the normal color range. All three are pretty damn good designers. The lack of color has made them more proficient with the colors they can differentiate from. In fact I know that their ability to differentiate between color tones is enhanced. So to refer to it as a deficiency is misleading. Those with 'normal' vision should take note. Colors are more precious and meaningful and we shouldn't take them for granted.

Scrivs said 1843 days ago:

This site...made by you...who is colorblind? Amazing!

Carp said 1843 days ago:

That's amazing. Cheerio, old chap, and all that stuff.

Dave S. said 1842 days ago:

Interesting timing on all of this. I just had dinner with Joe yesterday, and it turns out my site has been used as a case study during a WAI work session, specifically because of my blue text on blue background colour scheme.

The important thing is not so much the colour scheme you use - that can be rather formulaic and still look good (and I highly, highly, highly recommend the totally bitchin' colour wheel/selector by Pixy for this - finding it saved me $40 on a colour book I was getting ready to buy).

The important thing is, however, contrast. Grey text on a white BG is less legible than black text; coloured text stripped of its colour ends up being grey-ish.

Conversely, red text carries a lighter perceived tonal value than blue - for people who see it. If you match equal intensity/saturation blue and red side by side, the red will naturally appear lighter. But that only holds true for those without deficiencies.

For maximum clarity, the best bet is to push your aesthetic taste to the back seat and make text as dark as possible, while keeping your background as light as possible. Black on white is the ideal, but there's a wide range of dark tones on lighter that are of slightly lesser contrast, but still perfectly legible. Even those with colour deficiencies will see a dimly-lit pixel as dark in tone, simply because the light isn't there to make it anything else. Colour-blindness doesn't equate to tonal-deafness (to use an inept metaphor)

Since my original mezzoblue design I've darkened the text twice, to the point where the only further step I could take would be going all black. I'm not going to do this. I'm satisfied that the contrast is sufficient, and if it's not, hey, one can always turn the stylesheets off.

(Jon - I'm seeing a wild horizontal scrollbar on your site in Safari, just fyi. Also, your illustrations are top-class. Colour me [insanely] jealous.)

Jon Hicks said 1842 days ago:

OK, quite a lot to reply on here:

Egor:
You make some very good points, although I never referred colourblindness as a deficiency. I merely wanted to highlight why I tend to use the colours I do, and that the whole process for me can be difficult.

Dave:
Thanks for the Pixy colour wheel link - that's so going to help me out choosing complimentary colours.

I agree about the contrast. Originally I used #666 for body text on this site, but that was the hex colour of the beast, so its now a darker #333. This works for me - would you consider it not legible enough? I'm just trying to gauge whether you were talking generally, or about this site in particular?

I didn't take Joes article to be criticism in any way, merely that there is a bit of uniformity going on in designers interested in web standards. As I pointed out - I can see tones perfectly well (I think!), its the choosing of colour schemes that I find difficult. This extends to other areas of my life - choosing clothes that don't clash for example.

As for the horizontal scroll thing - tell me about it. I think its caused by the new way I'm centering the main block. It doesn't happen in any other browser fortunately. Sadly, I've just not had time recently to sort it out.

Dave S. said 1842 days ago:

Jon - I was speaking generally, sorry for any confusion. #333 works fine - you've got more contrast with that on white than I do with my blues, at any rate.

I can't speak for Joe, but I think you're right - I'm pretty sure his article was meant to be more expository than accusatory.

Jon Hicks said 1842 days ago:

Thanks for clearing that up Dave!

Alex said 1840 days ago:

Well, whaddaya know. I'm also slightly red/green colorblind, so I feel ya.

And I can still choose my own colors too ;)

#10

Rich said 1839 days ago:

Jon,

Interesting post on the issues of colour blindness as a designer. I have exactly the symptoms as you and I deal with them in similar ways in my job - namely using tools to help me pick colours that people other than me think work together.

With respect to the term 'deficiency', I tend to describe myself as colour deficient rather than colour blind - it was a term introduced to me by my optician and I've used it ever since, as 'colour blind' simply isn't true.

#11

Jon Hicks said 1839 days ago:

This is great. Since 'coming out' I've found just how common colourblindness is amongst designers. Thanks to everyone who has taken the time to let me know.

Thanks for your comments Rich. You're right, 'Colour Defiecient' is a more accurate phrase, as colourblindess suggests seeing in only black and white (athough my Great Grandad was black/white colourblind, goodness knows what that looked like!).

Pixys colour wheel is such a help, but the best way for me is still to check with a human.