Home Categories Design Miscellaneous Tutorial

Choosing the Right Colors for Your Web Site

1.5/5.0 (2 votes total)

Adriana Iordan
March 30, 2007

Adriana Iordan
Adriana Iordan is a Web Marketing Manager at Avangate B.V. She has in depth knowledge of internet marketing services and website analysis applied to the software industry and e-commerce development. Avangate is a complete ecommerce provider for incorporating an easy to use and secure online payment system plus additional software marketing services and sales tools.
Adriana Iordan has written 2 articles for WebKnowHow.
View all articles by Adriana Iordan...

Do colors influence web site visitors?

Several years ago, having a web page (as a business or as an individual), was an indicator of prosperity, and required a certain amount of financial power. Nowadays, almost everybody has one. They are easy to create (thanks to instant web page generators), even if they are not always works of art.

The main problem resides primarily in choosing the right colors for the web site. It is not always easy to properly assort the background color with the text color. The readability of a page can be influenced negatively if the color contrast is badly chosen. The background of web pages is white by default, like a sheet of paper.

Colors for Web Site Visitors

Researchers agree that colors greatly influence the human psychic. Consequently, the color scheme that you use on your web site can entice the visitor to engage in the goal of your site (i.e. make a purchase or request your services) or leave it after the first few seconds. It is the human nature to yield to the concept according to which "the first impression counts".

Even if they are not aware of it, your visitors will be greatly influenced in their decision to keep browsing your site or to leave it because of the poor choosing of colors and other visual displayed elements. On a psychological level, they will respond to the stimuli offered by the web site.

When viewing a web page, people will get excited, happy or bored. All this depends on the color selection. You need to be aware of the audience to which you're addressing and make the right choices. Color is a great means of communications, and it is best to make sure that you are saying the right thing.

Here are a few tips that you should consider

  • Use a palette of colors found in nature. They are more pleasing than any of their artificial counterparts. Combine them in order to get the emotional response that you want to get from your visitors. Unnatural colors, such as bright greens, blues or reds usually cause eye fatigue and chase visitors (i.e. prospects) away
  • Create a strong contrast between a page's background and its text. The best combination for readability is black text on white background, but there are other excellent combinations also. Besides white, other effective web site background, colors are dark blue, gray and black.
  • Avoid pairing blue and red, or blue and yellow. Green text on red background or red text on green / blue background are also choices that you shouldn't make, because such combinations usually cause eye fatigue.
  • Select up to five (some say seven) different colors and use them consistently throughout the web site.
  • Avoid using the blue color for small texts and diagrams with thin lines. Apparently, the specialized eye receptors for blue are the least numerous.
  • Be aware that there are lots of people with color perception problems, so it might be quite difficult for them to perceive the message transmitted by your site the way you want them to.
  • While some colors are dull by themselves, such as black, or gray, their juxtaposition with, for example, orange, can create outstanding effects.
  • Use white spaces to balance the other colors from your site. It will make web pages easy on the eyes.
  • Make sure you always perform a readability test for your web site. Use different shades of one color and, above all, pay attention to the harmonization of the different colors you use.

Colors and People

Keep in mind that responses to colors vary according to factors such as gender, age, or cultural background. You need some serious market research in order to make your site appealing for the exact category you're targeting.

Old vs. Young People
People of different ages have different reactions to colors. People past a certain age will find web sites with more sober and restrained (and therefore relaxing to the eye) colors more attractive. Youngsters, on the other hand, will appreciate more vivid and brighter colors, in keeping with their general attitude. Make the distinction between mature and young audience by using the appropriate colors for each category.

Men vs. Women
People also have preferences according to their gender. Thus, men tend to prefer blue and orange to red and yellow, while women prefer red to blue and yellow to orange. Also, remember that it has been proven that women are able to perceive considerably more colors than men.

Nations and Colors
If your website addresses an audience larger than your country of origin, or it is meant to attract prospects from a specific country, invest some time in researching the specific meanings of colors. For example, while white is a symbol of purity in Western cultures, it stands for bad luck and unhappiness in China, Japan, and India. While very appreciated in Japan, pink is frowned upon in India and East-European countries, where it is regarded as a "non-manly color".

Purple is associated in certain Arabic cultures with prostitution (the same as red in the European and North-American cultures), and globally, it is generally associated with mysticism and beliefs that are not in keeping with the precepts of Islamism, Judaism and Christianity. Green, if used for the web site of a financial institution from the USA, will support the implication that the institution deals with the "almighty green dollar", but it may bear no such significance in a country where bills (paper money) are multiple-colored.

On the other hand, there is a globally accepted "safe" color: blue. It can be used for almost any kind of site, no matter its audience, location or goal. It would be therefore safe to say that blue is an international color. In order to avoid embarrassing (and even costly) issues, you have the option of mixing colors.

This can lead to a complete change of meanings, significances will be changed and negative implications will be at the very least diminished, if not eliminated altogether (e.g. red becomes more powerful when combined with white). It is up to you to obtain creative colors that will be internationally accepted, but you have to do your homework quite well.

Common Colors and Their Most Common Meanings

  • Red: energy, passion, excitement, power; also implies aggression, danger.
  • Blue: coolness, spirituality, freedom, patience, loyalty, peace, trustworthiness; can also imply sadness, depression.
  • Yellow: light, optimism, happiness, brightness, joy.
  • Green: life, naturalness, restfulness, health, wealth, prosperity; in certain contexts, can imply decay, toxicity.
  • Orange: friendliness, warmth, approachability, energy, playfulness, courage.
  • Violet: wisdom, sophistication, celebration.
  • White: purity, cleanliness, youth, freshness, peace.
  • Black: power, elegance, secrecy, mystery.
  • Gray: security, maturity, reliability.
  • Pink: romance a feminine color.
  • Brown: comfort, strength, stability, credibility.

Using Colors for Web Site Elements

It is a good thing to differentiate between the elements of your web site by using various colors. You can use colors for identification, grouping or emphasis. For example, groups of related web pages can be identified by some particular color scheme, thus making it easier for a visitor to identify their place in your web site's architecture.

Certain information that needs to be brought to the visitor's attention can be highlighted by means of color. This improves scanning and can help reduce visual fatigue.

An important factor in the development of a web site is the use of various colors for hyperlinks, in order to help users distinguish between pages they have already viewed and pages that they haven't visited yet.

Add commentAdd comment (Comments: 0)  



Related Resources

Other Resources