“I’m not sure about that blue. Do you have a more ‘corporate’ blue? I’ve heard that blue inspires trust.”

Designers hear this sort of comment myriad times throughout their career, and it’s rarely a good conversation. Often the client isn’t even asking for a specific color change, but rather, a color palette that’s similar to sites that resonate with their personal tastes or articles they’ve read about the “meaning of colors”—the theory that blue paired with tan will look much more corporate than a blue paired with florescent orange is one example. Unfortunately, even base colors can be interpreted different ways, as is noted on the Microsoft Office site:

Colors and their common connotations in Western culture

Color Meanings

Frequently, it’s the way colors interact together that make it difficult to create a strong palette for the web. Once he or she decides on a primary color—whether that be corporate blue or royal blue—how does a designer extrapolate that out into a full palette that accounts for the many different places a color might be used on a site?

An easy, expedient and free way to quickly generate a color palette is to use one of the many online tools available:
HSL Color Schemer
ColourLovers’ Palettes
Adobe Kuler
Color Palette Generator

So how does a designer determine which of the thousands of pre-existing palettes to use? Or what combination are actually worthwhile? One empirical, helpful trick is to refer to the contrast / luminosity of the colors in combination.

Color decisions need to consider contrast because contrast is key to usability. It’s also the most powerful visual information – before hue and saturation – and therefore best capable of guiding attention. Furthermore, it’s much more effective to counteract color deficiency confusion by testing for contrast, than trying to choose the “right” color hue.

Luminosity

http://www.lighthouse.org/accessibility/design/accessible-print-design/effective-color-contrast

In other words, hue and saturation are not necessarily the most important part of creating a palette. How the colors interact with each other is just as important, if not more important.

That’s because people find edges first. The human eye is geared to recognize changes in contrast/luminosity first, before recognizing actual colors. One way to help determine the best choice out of many is to simply desaturate the image and examine the difference in contrast between the colors.

Desaturated

This simple process makes choosing an effective palette much more simple. You’ll note in the color example above, the text in the “not as effective” panels seems jumpy and more difficult to read than the panels above them.

In most cases, the goal of good design is readability and usability. In certain cases, however, it could be advantageous to actually use weakly-contrasting colors to force the user/reader to slow down and digest the content. Of course, this idea is sometimes difficult to sell to a client because it does, in fact, look strange.

The avatars we use on MIX Online is another example of using similarly-valued colors to produce a jarring effect. This forces the user to pay more attention to the image, and sets it apart from the the rest of the content in a very particular way. Below is an example using my avatar and demonstrating the results of desaturating the image.

Avatars

A real-world example would be going to ColourLovers to pick out a color palette based on the color #0099ff. Below are three nice random palettes to consider.

Three Palettes

If we desaturate the colors, we get a different understanding of how they relate to each other.

Desaturated Palettes

In the case above, we see that “Automan” has three colors that are of very similar luminosity, making them difficult to use together without causing optical confusion. “Island Mist” is even more even in the luminosity, so it could be very difficult to use these colors together in any extended capacity.

Of course, just because a palette has more levels of contrast in doesn’t necessarily make it a better choice over another. It does, however, help with a sometimes-difficult decision by giving the designer and client empirical information to lean on.

Each person sees color a little differently and has his own tastes. As time progresses and I work on more projects, it becomes evident that clients and designers will often defer to their personal tastes with “creative” decisions such as color. Sometimes, though, getting even the most basic data can help inform a designer’s decision… and can offer a good explanation of why you chose *that* blue, which is just corporate enough.

Read the Opinion now on MIX Online