The colours you choose lay the foundation for your online image so it's important to choose carefully.
Web design sounds fancy. Yet, like all elements of conversion rate optimisation, building a website is more about construction than design. The colours you choose lay the foundation for your online image so it's important to choose carefully. Using colour psychology not only helps you look good, it can help attract the right kind of customer to your website and increase conversions.
Colour psychology is the study of how people are affected by colour. You can test how powerful colours are just by thinking of some of the biggest brands in the world. What colour do they use? You'll recall it instantly for Coca-Cola, FedEx, Nike, and Facebook. You also know Coca-Cola is pillar-box red, not burgundy. FedEx is a rich purple, not lilac. And Facebook is a muted blue, not sky blue or sapphire.
Now think about how those brands make you feel. It's common knowledge that red represents a 'bold' attitude and pink points to products for women. But do you know that purple divides people by gender? Women are drawn to it and men are not. These findings reveal how people might react to your website.
Site visitors take just 50 milliseconds to make a judgement about your brand and colour plays a key part in this. No doubt you're already familiar with some of the basic assumptions of colour psychology:
The thing that makes colour psychology so interesting is that, despite the trends, everybody is different. People can become obsessive over a particular colour. Just the sight of it can stoke an old memory — good or bad. It's this reaction to a colour trigger that you can test in conversion rate optimisation:
The last time you read about complementary colours might have been in school.
If you remember, these are the colours opposite one another on the colour wheel: red and green, blue and orange, yellow and purple. The colour wheel has been around since 1666. It was invented by Sir Isaac Newton and used by Claude Monet. Ever since then we've trusted that these pairings are pleasing on the eye.
More modern depictions of the colour wheel show twelve colours, which make up the RYB (Red-Yellow-Blue) colour chart. For web design, you can pick three colours that sit next to each other on the wheel because they'll always hang nicely together. Or draw the corners of a triangle, rectangle, or square shape evenly within the wheel; the corners pinpoint the selection of colours. These will always work well together because they're part of the same tried-and-tested RYB chart.
Research by the University of Loyola in Maryland suggests that sticking to the same palette of colours on your website can increase brand recognition by up to 80%.
If you don't want to mix colours, add black, white or grey to just one colour to create a different hue:
A selection of different tints, shades, and tones of your chosen colour can form a colour palette too.
Think about the conversion elements on your website. All the thought that goes into the headline, the description, the navigation, the images, and the button placement.
Do you give the same amount of thought to the colour of these key areas? Is it clear to your viewer what they should click on next?
In the EE example below, they highlight the headline and the button with a flash of yellow.
To keep colours balanced, not garish, use this design tactic:
Think about the colour you use to showcase headings, navigation, buttons, and hyperlinks.
Most websites have a plain background and lots of white space because it makes the text easier to read. Breaking convention with yellow text on a grey background may feel rebellious, but is it a smart move if nobody can read it? If your message is lost, your sale is lost too.
Get to know what each colour means and it could give you an advantage in your optimisation strategy. Your next test could reveal something unexpected that turns a poorly performing page around.
What works for one website won't work for another. Not all women like pinks and purples and some people love brown. Test it in your niche to avoid a flop—like Heinz, who famously tried and failed to launch a green version of their tomato ketchup. Parents didn't respond well to the conflict of colour. Kids didn't like it either because they associate green with vegetables and food they don't favour.
When VegasSlotsOnline.com changed a "Sign up here!" button from green to yellow, they saw a 175% increase in conversions. Conversion optimisation is all about human behaviour and this brand knows their customer well. Because of that they were able to test what they thought might be most successful:
"Psychological effects of colour do matter. In our case, we chose two colours, both of which produced convincing arguments for their use. Our test likely would not have been fruitful if we had used white or black buttons. Our niche’s characteristics were paramount to our colour selection."
Will colour psychology testing work for you? If you work in conversion, you know there's only one way to find out: Test it. Find out if choosing one colour over another changes the way people behave on your website. It might just result in more click-throughs and more sales.
Let us know how you get on in comments. How do you use colour psychology in conversion rate optimisation?