Friday, November 6, 2009

How the Use of Colours is Important For Web Design

By Adriana Noton

Unless you have a natural eye for design or studied art and graphic design in school, deciding which colours to use in Web design can prove to be very difficult. You may think that the colours displayed on any given Web page are irrelevant to your users or message, but the contrary is true. If you're having a hard time believing that, ask yourself the following:

- What colours do you associate with hot or cold? - What colours do you associate with happiness? - What colours do you associate with hot or cold?

Just as certain colours have the ability to evoke emotions or sensations in the real world, they also have the ability to do so on the Web. The colours you choose to use on any given Web page have the ability to communicate. Using them wisely and carefully can pay off, while using the wrong colours can be very detrimental to your message.

Usability Some of the information contained here may seem like common sense, but it is important to mention it anyway. For example, when choosing background and text colours, you must make sure there is enough contrast between the two that text will be readable. In terms of colour, another usability factor is text links. The standard on the Web is to use the colour blue to denote links. Because users are accustomed to this pattern, it is helpful to stick to it.

Symbolism When choosing the actual colours that you will use in your website design, it is important to consider your target audience. Using colour to communicate will only work if you understand your user and his or her perceptions. This may be a little more complicated if you have an international audience. If this is the case, you may be better off sticking with neutral tones. Below is a list of colours and some widely accepted associations. Consider your users and ask yourself if they would identify with any of the below associations in a way that would be advantageous to your message.

- Red: passion, fire, desire, strength, heat, leadership, drama, intensity - Pink: femininity, romance, sweetness, affection, peace, passivity - Orange: warmth, energy, flamboyance, friendliness, joy, vibrancy - Yellow: light, cheer, imagination, cooperation, optimism, brightness - Green: earth, healing, money, abundance, nature, growth, youth - Blue: communication, wisdom, protection, calm, loyalty, tranquility - Purple: influence, self-assurance, psyche, wealth, extravagance, majesty

Web Colour Synchronization Once you are on board with the importance of colour to your Web design, you will want to make sure all users see the same (or nearly the same) colours across all browsers. Because everyone who views your page will be using a different browser, operating system, monitor and ambient light, it is impossible to ensure the same colour experience for all users. There are, however, some simple guidelines that can minimize this problem. These include:

1. Use simple colours instead of complex ones. Simple colours have duplicated numbers in the hexadecimal triplet. These colours have less variation from user to user.

2. Use only a few colours. The smaller the amount of colours used, the smaller the chances of everything looking all wrong for any given user or group of users.

3. When in doubt, refer to the "browser safe palette" (just Google it). Though it is not foolproof, it has wider support than colours not contained therein.

About the Author:

No comments: