You never get a second chance to make a first impression. This goes for your website, too. And, on the web, visitors make up their minds about whether to stay on your site or not in as little as 1/20 of a second!
One of the features of a site that can make or break it in the eyes of a visitor is the color palette. And, when designing for the web, less is more. Too many colors can be extremely overwhelming. A prime example of this is DP Graph‘s website.
I like a good rainbow now and then but, wow, this is a lot. It’s unfortunate, too, because they seem to have some great software to offer. Sadly, that message gets lost among all the color (and movement; the background and featured graphic image are also animated).
By contrast, Creative Spark, Inc., out of the UK has a color palette that’s not too busy. This shot of their Contact page is a great example of how just a few simple colors can make a bold impact on the viewer.
So, where do you start when designing for a client? Often, your client will already have a logo but no idea what color palette to work with. In this case, and assuming that their logo has at least a few colors in it, start by pulling colors directly from it to use throughout the site.
In order to do that, try one of the great tools out there on the web that are specifically designed to create color palettes. My personal favorite is Adobe Kuler. Not only does it have thousands upon thousands of palettes to choose from, it’s free and you can also upload an image (in this case, your client’s logo) and create a color palette directly from the colors it already contains.
But, what if your client’s logo is limited in color choices? What if it’s black and white? What if they don’t even have a logo? Don’t worry; you still have options.
First, work with what you’ve got. If you’re client’s logo only has one or two colors, start there. Don’t go diving off into the great unknown with a color palette that won’t even match what they’ve already got going on. Consider creating a palette that includes different tones of the single color that the logo contains. Imavex does a terrific job of this.
Second, it’s time to start talking with your client. What is their business all about? Who is their demographic? What message(s) are they trying to impart to the visitors of their site? What colors are in the palette of their competitor?
The type of business your client is in can be a natural guiding force for choosing colors. Say, for example, your client is a distributor of rose bushes. The colors that roses naturally come in can point you in the direction of a palette that customers will instantly associate with the business. Using a color like bright turquoise just wouldn’t fit here, and visitors will feel that oddity when visiting such a site without even knowing why.
When it comes to demographic, color can be an important factor if your client serves primarily one gender or another. Studies have shown that men prefer darker, bolder colors, whereas women prefer softer tints and lighter colors.
What about the message or mission statement your client may be trying to project? Remember that, traditionally, different colors can convey different feelings or emotions. There are a tremendous number of websites that address color and meaning. Remember, though, these are traditional meanings. You don’t have to follow them but they should at least be taken into consideration.
Given the nature of your client’s business, you may need to take their competitor into consideration, too. If your client’s product will sit next to his competitor’s on a retail shelf, you certainly don’t want to use a color palette that mimics the other guy. Instead, choose colors that will set the product, and the company, apart as different and unique.
Finally, don’t go crazy with too many colors and be consistent. Too many colors can be overwhelming. Limit yourself to no more than four. And be consistent throughout your client’s site. There’s nothing more confusing than having elements changing colors as one navigates throughout a website.