From "warm" to "cool", the temperature of a color effects the way your site is perceived.
All hues fall into two groups based on their perceived color temperature, or their associations with coolness or warmth from our world.
"Cool" colors are blue, aqua, and violetwater and air elements. "Warm" colors are yellow, orange, red, and brownearth and fire elements. Warm and cool color theory states that warm colors tend to pop forward, cool colors tend to recede.
|Warm color on a cool background
||Cool color on a warm background|
Achromatic colorsthat is, white, gray, and blackmay become warm or cool when they have a slight hint of a chromatic color.
|Warm black (reddish tint)
||Cool black (bluish tint)|
|Note: The capabilities of your monitor will determine whether these colors appear the same or different.|
The colors you choose can affect the mood, tone and message of your Web site. Which of the following lines makes you sit up and take notice?
|Sale! Visit NOW!!!
Sale! Visit NOW!!!
Which of these two is more calm and peaceful and better matches the message?
|Summer breezes whisper in the trees ...
||Summer breezes whisper in the trees ... |
Experiment with warm and cool colors until you achieve the look you want.
The computer monitor on which your page is viewed can effect the perceived temperature of colors. By adjusting the "white point" setting for the monitor, the entire display can appear warmer or cooler; lower value setting are warmer while higher ones produce a cooler effect.
|White point = D50
||White point = 6500
||White point = 9300|
Color packs a lot of non-verbal communicationthe addition of a color can subtly change the meaning of a design element and how it is perceived.
Color is a powerful design element that draws attention to the layout. Because color is also a powerful communicator of nonverbal information it can either work for or against the content.
As you design your page, consider the symbolism of color as seriously as the contrast and harmony of colors on the page. Many colors have qualities associated with them because of their natural occurrence or cultural usage. For example:
We commonly associate green with plants, and therefor environmental awareness.
We also associate green with money, the color of our US dollar bills and with green, the color that means GO on the stoplights (there's that implied cultural meaning raising its head!) |
Blue is the color of the sky and the sea, and has associations of depth and stability. These qualities make blue a popular color in logos of large companies. |
Red is the color of blood, so we associate it with the heart as well as violence. Or as the color that means STOP.
But, red is also popular color for country flags and professional sports teams.
And in some cultures, red is the color celebration and associated with marriage or a new year.|
Make sure you give color selections careful consideration and don't just rely on personal preference(hey, not every one might respond as you do to your favorite bright orange and lime green!) or trends (is it really appropriate for every corporate logo to be blue and green or does that just mark is as turn-of-century design?).
Color packs a lot of non-verbal communicationbut don't make too many assumptions. Much of the symbolism is loaded with cultural interpretationsand your pure white dove could be seen as a white dove of death!
Some common associations of color in United States culture are:
||passion, strength, energy, love
||blood, war, danger, aggression |
||nature, spring, fertility, environment
||inexperience, envy, misfortune|
||sun, summer, gold, optimism
||illness, cowardice, hazard,|
||sky, sea, stability, calm, unity
||depression, conservatism, obscenity|
||snow, purity, innocence, peace
||cold, clinical, sterility|
||intelligence, dignity, maturity
||shadow, boredom, concrete|
||power, formality, depth, style
||fear, evil, anonymity, death|
The color needs to match the message and image and it needs to translate into all the cultures that will be using the site. If the color's associations contradict the content, the Web site may communicate in unintended ways. If you think cultural differences aren't a big deal, just remember that Chevy sold very few Novas in Spanish speaking counties (no va means "no go"quite an unintended message!) The use of color is full of symbolismif you are designing a site for multiple cultures, be extra careful of your color choices.
For example, white carnations signify death in Japan and green hats mean a man's wife is cheating on him in China. Maybe a green hat with a white carnation in the brim isn't such a good color choice for your company's product logo! Make sure you go beyond your self-contained experiences (whichever culture you belong to) and understand color from a global perspective.