Using Colour on Your Website - Basics

Colours can have a significant effect on the success of your site. We all know the saying "You only get one chance to make a first impression" this is very true with your website. A site should be visually engaging and invite your visitors to explore. Clever use of colour is a great way to do this, but at the same time you don't want to make your website a multi-coloured assault on the eyes.

If your website is not pleasing to the eye, then visitors will leave very quickly. You've probably been in this situation before if you reach a website that is disorganised, hard to read, hard to navigate and causes eye fatigue you aren't going to stick around.

Ensuring that people engage with your site and stay long enough to view your content is very important.

In this guide we will cover some of the basics of using colours effectively. We also have a couple of other guides that take a deeper dive into the psychology of colours and how to choose your colour palette (scheme).

One of the most important factors when choosing colours is having a strong contrast, especially between your background and front elements (such as text and navigation). You want to ensure that visitors to your website can easily navigate around, and read all of your content without any problems.

Colours with a low contrast can cause difficulties, especially for anyone with poor or impaired vision. It is worth bearing in mind that approximately 2.7 million people in the UK alone are colour blind and low contrasts can make picking out images, navigation and text virtually impossible in this case.

If in doubt, a light background with dark text is usually a safe bet, as sometimes very bright colours that are contrasting can still be a little hard to read, and can eventually cause the reader eye strain. Regardless of how good your content is, people just won't take the time to consume it if it's too much like hard work.

Keeping your website clean and simple is a good idea. Although colour is a great way to make your website more exciting, and can be used to draw attention to certain sections, too much colour can have the adverse affect. If your website is full of colourful sections and links it's likely that visitors will not know what to focus on.

Many of the most aesthetically pleasing and successful sites tend to have a relatively small colour palette of around 3-5 colours. They will often incorporate a dominant colour to highlight the most important information, accent colours for secondary areas (such as sub headings) and a background colour that frames everything nicely. This careful and deliberate use of colour prompts interaction with the site.

Picking a colour palette or scheme makes it easier for you to maintain uniformity across all your pages, making the end user experience much smoother. If you have a coloured logo or any coloured branding incorporating this into your scheme is a great idea, as it reinforces brand recognition across your whole site.

As mentioned in the section above, picking a colour palette is a great idea and can create uniformity throughout your site, rather than a mish-mash of clashing pages. So let's take a look at some of the things to consider when choosing a palette:

• If you have a coloured logo, this is a very quick and simple way to pick your colours. If you look at some of the giant brands, such as Coca-Cola, their website is quite clearly influenced by the notorious red and white logo.

• What is your site promoting? Colours can be used to convey a message through their association and symbolism. A prime example would be using green if your site focuses on the environment or nature - the colour has an automatic association.

• Who are your target audience? It is worth considering that the colour you choose will evoke different responses from different people. For example, bold and bright colours would be great on a website for kids, where as calmer colours would be better for a more mature audience.

• What emotion do you want to provoke? Would you like a calm and tranquil feel, using perhaps blue or pastel tones? Or do you want to evoke excitement with red or warm colours?

• If a picture is the focal point of your site then it is a good idea to get your inspiration from the colours in the picture.

The most important factor is to ensure that your site is clear, easy to read and easy to navigate through.

You should also take reasonable steps in your colour and contrast choices to avoid excluding people with impaired vision. The Equality Act 2010 makes it illegal to discriminate against people with disabilities, therefore it could be deemed unlawful to have a website that is inaccessible to partially sighted users.

Don't be scared of black and white. Black does still tend to be standard text colour used by designers, except for links, headings and subheadings. White backgrounds are also great at creating a 'clean' feel and generally make things easier to see. Adding a splash of colour to highlight links, navigation and buy buttons can create a simple yet stunning and practical site.

So keep it simple, it's also a great idea to have a couple of friends or colleagues look at your site to see if there is anything that they come across.

Alternatively, if you are an RQS Website Builder user, we have added several colour schemes for your website that use a range of complimentary colours. These are designed to take some of the stress out of starting from scratch with pre-set colour palettes and strong contrasts taken care of. Your RQS site is fully customisable so you can use different schemes for your navigation, text and footer content as desired.

Freeola also offers a choice of affordable website design services. So if you would like some help with the design of your site, check out our Web Design page.