According to science, colour has a significant influence on the human mind. So, the colour scheme in your website could make a user to abandon your site in just a few seconds, or accomplish what they needed on your site. But how do you choose the correct colour scheme for your website? Our web designers have compiled the following tips to help you.
Choose a dominant colour
Your website should have a dominant colour: the colour that people identify your brand with. For example, the fire engine red for Coca-Cola or the sky blue in Twitter. If you already have a logo, use the colour in your logo as the dominant colour on your website.
It is not all about using your dominant colour, but using in the right places, especially the places you want your visitors to focus on. Such places include the menu tabs, call to action buttons, highlighting relevant information, and titles and headlines.
Limit colour usage to three colours
Using too many colours makes the site look unprofessional. Many colours create an eye sore and could result in visitors skipping vital information on your website. Chromatic harmony is best achieved using three colours.
Employ the 60-30-10 colour rule in web design. According to the rule, use your dominant colour to cover 60% of the space. The secondary colour, which should visually contrast the dominant colour, should cover 30% of the space. An accent colour should cover 10% of the space. An accent colour should complement either the secondary or dominant colour.
Your target audience should help you choose the correct colour combinations. For instance, old people will prefer restrained colours while young people will prefer bright colours. Similarly, men and women will prefer different colour palettes. Men prefer bright colours, while women prefer soft colours. Also, men will tolerate achromatic colours (colours with no hue like black and white) compared to women.
If your target audience is outside Singapore, you will have to do more research on the meaning of certain colours in different cultures.
Contrast between background and text
To improve readability, always make sure there is a high contrast between the background and the text. Black text on white background is a perfect example of contrast. Other perfect combinations exist, like white text on a dark blue background. If you are not sure about contrast, consult your web design company.
9 Tips for Picking the Right Colour Scheme for a Website
Use the 60-30-10 Rule
The 60-30-10 rule states that three colours ought to be used in varying degrees, 60%, 30%, and 10%. The primary colour should cover approximately 60% of the website. It should be contrasted by 30% of a secondary colour for a striking effect.
The third colour ought to be used as an accent colour, used on only 10% of the website. The accent colour should complement either the primary or secondary colour.
Study How Colour Affects Emotion
Sever studies have established a connection to how colour affects emotions. The impact of colour can vary depending on the geographical location. This makes it essential that you invest in the right colour scheme for your website.
A colour emotion guide will help you know how different colours elicit different emotions. Here is a rundown of which colours evokes mixed emotions:
- Yellow provides feelings of optimism, warmth, and clarity
- Orange elicits confidence, friendliness, and cheerfulness
- Red shows that a brand is bold, youthful and brings excitement
- Purple shows that the brand is imaginative, creative, and wise
- Blue shows strength, dependability, and trust
- Green shows health, peace, and growth
- Chrome shows that the brand is calm, balanced, and neutral
Before settling on the colour for your website, ensure to test how your audience will respond to the colours. A/B testing methods is the best way to get feedback on the different colours used on the website.
Consider Business Goals
With that said your business goals ought to help you in choosing the right colour scheme for the website. For example, financial institutions, such as banks and insurance companies, often use blue. On the other hand, Restaurants and hotels red and orange, while luxury products are packaged in black.
Discount and coupon websites use bright colours, which create a sense of urgency. Using bright colours elicits a game-like appeal in the visitor. Most hotels incorporate white, black, green, and blue in their colour schemes. They also add warm colours to create a sense of relaxation, and luxury.
Use an Image for Inspiration
When adding images into your web design, ensure that you coordinate the colours between layout and the pictures. This will help in creating a unified design, and this will be a good source of inspiration. Most designers tend to borrow colour inspiration from images, especially from photographs.
The science behind this is that humans recognize colours by instinct. This will provide a strong connection to the end-user.
Leave Your Biases Behind
While you might want to include your favourite colours on the website, it will pay off if you let go of your biases. Picking the right colour scheme for a website needs to be based on psychology, and not personal preferences.
We have seen many businesses make this mistake. Going with your preferences could cost you potential sales with the chance to dilute your brand in the long run.
Use a Colour Wheel
You might have come across the colour wheel in art classes. Professional web designers use them all the time to pick the right colour scheme for a website. The trick here is to choose analogous colours, which are similar colours placed next to each other on the colour wheel. For example, you could pick blue and green, or red and orange.
You could also opt for complementary colours, which are colours on opposite side of the spectrum on the colour wheel. For example, you could consider purple and yellow or orange and green.
Leverage on Tools for Help
Picking the right colour scheme for a website could be problematic, but a tool such as Colourspire, makes the process easier. Colourspire gives a quick and easy way of testing different colour combinations.
With that said the best method of picking the right colour scheme for a website is to build the colour palette from a blank canvas. Tools such as ColoRotate, Adobe Kuler, Color Scheme Designer, and COLOURLovers will help expedite the process. With that said, the more colours you use, the harder it will be for you to establish a unified design.
Look At Competitor Websites
The chances are that various brands in an industry will use similar or varying colours. Check the colour scheme on at least three websites from your direct competitors. Look for the overarching patterns in their colour schemes to provide guidance.
Consider the following choices when picking the right colour scheme for a website:
- Create a similar colour scheme to those used in the industry
- Differentiate yourself from the pack by going the opposite direction
The second option is better, especially if you are looking to create a distinctive brand. In the instance where you have more than three colours, you could use shades or tints instead. For example, if you have a content-rich website, different shades of colour can help in separating the content.
This way, you will be able to have a unified colour scheme with the fourth or fifth colour. The shades and tints help to expand your colour options without clashing with the existing or preferred colour scheme.
Consider Different Colour Schemes
It is best if you considered different colour schemes before settling. Come up with between three and four colour schemes then compare them side-by-side. You could get the opinion of your colleagues, business partners, or website designers to know what works and what does not.
After this, use the elimination method to narrow down on the right colour scheme for the website.
When picking the right colour scheme for a website, ensure that you consider the colour psychology and not your preference. The above tips will help you settle on a colour scheme that resonates with your target audience and create the right emotion for them to take action.
Moreover, ensure to simplify the process by using the tools named above and more. They will save both time and effort. You could also use with professional help to take off the stress of picking the right colour scheme.
Contact us for professional web design services in Singapore. Our support team is on hand to provide you with a free and non-obligatory quote.
Visit the best design website and SEO agency for a fully optimized website. The bottom line is that; a good colour scheme creates a good first impression of your site and brand.