The Psychology of Color in Web Design

Persons engaged in website design, here’s a scoop for you! Would you just like to know that by understanding the basics of cognitive psychology around color and patterns, we could further improve our Web design!

Designing a Web site does not only concentrate on making web pages of a certain site interesting and impressive. This skill and talent must also be used to ensure the user-friendliness of a certain site and must strive to reach the widest range of users possible.

So what’s this about psychology? It simply implies that by understanding the capabilities of the human eye, we can produce Website designs that are more user-friendly. Being user-friendly means that our website design will not only cater for normal sighted Internet users but also to those partially sighted, blind or estimated 8-10% of men with red-green colour blindness.

If you don’t know anything about vision and colorblindness and their reaction to various designs, then you must start learning now! 'Normal' vision is subject to huge variances. Even the size of elements will affect an individual user's perception of colour. The colours and the intensity of shades you choose to use in your Website design will be discerned differently by every individual who visits your Website.

Inconsistencies in color patterns are affected by changes in the ambient lighting levels. It’s like changes in your hair color depending on the amount of lighting it was exposed. Some people even see blue colors in some objects like clothing wherein others do not perceive. These persons just happen to have more blue sensitive cones (photosensitive cells which convert light energy into nerve impulses) in their retina. They seem to view the world with 'blue-tinted spectacles'. As a web desinger, you have to be aware that these conditions are the reasons why your perception of your Web design may be different to other people and certainly are not the same with everyone else's.

The key aspect to contemplate to achieve accessibility, aside from impaired vision, is by being aware that your design might be manipulated by assistive technology. Screen readers or magnifiers are examples of this. They are software the physically disabled employ to enhance their experience of user interfaces. Some Web users can only read a certain combination such as yellow text on a black background, which allows no room for greyscale.

In order to have good legibility for users with certain visual difficulties and impairments, strong contrast can be a main ingredient in your design. Test the effectivity of this by manipulating screenshots of your design in a program like Adobe Photoshop. Try converting the image to greyscale then make the screenshot monochrome to see how it might be viewed using the most extreme visual manipulation -- do this by increasing the contrast level to +100. This is a particularly useful approximation of difficulties colour blind users may experience in discerning one colour or shade from another.