The Psychology of Color in Web DesignPublished in Design
Web design needs to do several things at once. It must look good. It must make sure the navigation of the website is clear. It must hold an internet user’s attention for as long as possible. And it must gently lead the user down the conversion funnel, quietly urging the user to do whatever action the site owners have as the goal of the site.
Because web design needs to have an influence over people’s behaviour, more and more designers have been looking to the psychology of color to help them create websites. They can play on cultural references to suggest trust, urgency or mystery to the target audience.
Read on to find out which colors are associated with which feelings. Please note, cultural differences can also have a big impact on these details.
Red is a stimulating, exciting color. It is associated with passion, power and sometimes anger. It can be used for warnings or to show danger, but it can also suggest strength, determination and boldness.
Warmer reds, like brick or maroon, and strong and comforting – good for sites that want to suggest the lasting qualities of a brick wall. Brighter reds, like true red or tomato, are great for youthful websites that want to suggest energy and eagerness to leap before they look.
Pink is associated very strongly with youthful femininity. It is playful and brings to mind bubble gum and innocence.
It is ideal for websites that hearken back to olden days or that target a particularly feminine audience.
Orange is a more balanced and less overwhelming colour than red. Vibrant, energetic, friendly and inviting, it is ideal for designs that need movement and energy.
Websites that want to showcase their creativity often choose orange because it is unique and exciting, but it still has the comfort of a warm color.
Yellow is often considered the most energising color. From the earliest ages, people learn to associate yellow with the sun, so it becomes associated with warmth and happiness. That makes bright yellow perfect for sites designed for children, as it grabs their attention.
More subtle shades of yellow have more complex associations. Darker shades can suggest antiquity, suggesting yellowed parchment. Because of that, it can also be associated with wisdom and curiosity. It therefore is great for sites that want to demonstrate a sense of authority and intelligence.
Green is strongly associated with plant leaves and subsequently has lots of positive associations. It can give users feelings of calm, rejuvenation, affluence and optimism.
Darker shades are more linked to money, so sites that want to suggest affluence, growth and stability often use those shades. Lighter shades are more associated with spring and growth, so websites that want to reflect relaxation, freshness and honesty often use lighter shades.
Green is also directly associated with the environmental movement, so sites that aim to broadcast ethical standards often use green.
Blue calls to mind dependability, trustworthiness and security. It is also calming and has an element of spirituality about it.
Most corporate and business websites use dark blues to call to mind their experience, success and reliability. Light blues are best for friendly, open websites, like social media sites.
Purple has long been associated with nobility, so it is no surprise that dark shades of purple imply wealth and luxury. Lighter shades suggest fields of lavender and are associated with spring and romance.
Websites that look mysterious yet elegant use dark purples. Those sites that opt for lighter shades will speak to people looking for romantic items or ideas.
Black, White, and Gray
Black, white and grey are usually background colors, allowing brighter colors to make the real impact. Still, they call to mind their own associations.
Black suggests power, modernity and sophistication, while white suggests cleanliness, simplicity and innocence. These competing associations play off of each other as nicely as the colors themselves do, making black and white designs especially strong.
Grey is a neutral color. When used well, it is associated with tradition, sombreness and calmness. When used badly, however, it can cause a design to lack energy.
All of these colors are best for websites that want to call to mind tradition and seriousness, like news sites.
Browns, which include creams and tans, are often used for textured backgrounds. Backgrounds that mimic paper, fabric or stone are usually brown, and as such, browns give a site a sense of wholesomeness and cosiness.
Creams are calm, elegant and pure, making them a great background color for a website that wants to imply a sense of tradition. Tans are conservative and bring to mind piety. They can be dull, but they can also be reassuring, which makes them ideal for a site that doesn’t want to be too bold or outrageous. Dark brown feels wholesome and reliable, like a loaf of bread. It is associated with warmth and comfort. Sites that want to demonstrate experience and reassurance often use brown.
Colors can create a very specific mood or impression on a website. If a site’s color gives the wrong impression, it can result in high bounce rates, as the site will suggest inexperience, unprofessionalism or even untrustworthiness. If the impression is the right one, it lets users know that the site is trustworthy and that it ‘gets’ its niche. Little wonder, then, that the psychology of color will remain a major concern for web designers.
About the Author:
This is a guest post contributed by Neeru from Print Express. Neeru works in marketing and design. She likes sharing her knowledge of web and graphic design.
Series on Color Inspiration:
You may also be interested in our showcase series on color in web design: