The Web Design Checklist: Choosing the Color Palette

This is the first post in the Web Design Checklist series.

Our world is dominated by color. Because of its omnipresence, psychologists have debated the impact that color has on the mind and the emotional state. And there is an impact. Everyone has their subjective associations to certain colors—someone may find the color red to convey anger or danger, while another person may think of love and passion when they see the same color.

Color, in some cases, can be simultaneously simple and complex. When you’re designing your website, color is worth a consideration. And though choosing the color palette can be frustrating, the job of the designer should be kept uncomplicated.  The designer, needless to say, shouldn’t take a psychoanalytic approach with each color choice, nor should they lazily select colors. When designing a website (whether you hire a designer or you’re doing it yourself), color should be viewed as a means towards an end. Designers need to think about the various functions that color has within the site. Those functions could be product/brand related, demographics-driven, or basic design practices.

Contrast 101

Contrast is one of the most basic practices in web design. If you are designing a website through the context of usability, then contrast is essential.  It is a very basic mistake, but you still see websites that have a poor color palette, with no consideration for contrast. This makes the site illegible and a pain to actually read. This will almost guarantee a high volume of visitors bouncing from your site. The background should be a different color than the text. The background and the foreground (the text) should never blend in. You have to consider the possibility of having vision-impaired visitors, so you should be looking to make your website as accessible as possible.

Use color wisely

Limit the amount of colors you use. If you use too many colors, you will risk having too many things going on at once, and it may turn off your visitors. Unless you are purposely aiming for a loud, obnoxious color scheme as part of your brand, keep the variety of colors to a minimum. Too many colors will damage the aesthetics of the site.

Use color to create brand synergy

You want a synergy across all marketing platforms. This means that you should try to keep the same color scheme that you used on, say, your print design materials for your website. This makes your brand memorable for your web visitors. The color scheme should be consistent on every page of the website, and it should also correlate with the colors of your logo or any other graphic design that you may have.

Don’t be afraid of whitespace

Using whitespace is one of the most proven ways to reduce the clutter of a website, grab a visitor’s attention, and get that visitor to complete an action that you want them to take. Whitespace is any part of the page that is left unmarked and “empty”. Meaning that the space is free of any images, text, links, or patterns. Whitespace, contrary to its name, does not necessarily have to be the color white, it just has to meet the criteria of being empty and unmarked.

Whitespace is potent because it helps to guide the visitors’ eyes to where you want them to go. If you go to the Google homepage, you will see that it is mostly whitespace. This is intentional, as Google wants your eyes to hit the search bar. If someone visits the Google homepage, they will feel compelled to hover over the search bar and click on it.

Whitespace can be useful for landing pages or checkout pages. If you want someone to hit that “purchase” button, try adding more whitespace to the page. Relentlessly remove the clutter. Use the whitespace to highlight your call-to-actions.

Decide what colors work best for your market

If you create a website for children’s toys, you should use a color scheme that is relevant to the lighthearted emotions that children may have. The color scheme should be light, playful. It’s just a matter of knowing your demographics.

A jewelry store should have a different color scheme than a gun store. Or a website that is geared for young men will most likely have a different color scheme than one that is for women of the same age group.

This is not to say that you should buy into generalizations or random ideas about your demographics. We’re saying that the color of your website should set the mood. If, for example, the demographics for your site lean toward young, modern professionals, you may want a sleek, sophisticated color scheme that they will respond to.

The only way to know what color scheme works for your website is to test it out and see what sticks. With the tips in this article, you should have a good headstart.