Back to kaikkonendesign.fi

Why Websites Are White

The majority of websites have a bright background. Why is that? Because it resembles printed paper? Maybe. This post focuses on another reason, one that’s been verified in research—user motivation.

This post is based on a part of my Bachelor’s thesis, The Role of Online Store Atmospherics in Consumer Behavior [pdf].

Utilitarian Motivation

Utility is defined as the quality or condition of being useful, and utilitarian motivation refers to seeking utility. Every time you use a calculator, you probably have an utilitarian motivation.

Research shows that consumers with an utilitarian motivation find a low-arousal environment more pleasurable than a high arousal environment. The degree of arousal refers to how exciting the environment is to our senses. In simpler English, users motivated by utility want an unexciting environment.

For example, Google's websites and applications are based primarily on white. They aren’t very exciting or arousing to our senses. But what if they switched the background color to red? My guess is that you wouldn’t be as comfortable using them. The color red causes a non-conditioned physiological reaction, increasing your heart and respiratory rate. This reaction is something we humans are born with.

Google Search

On the other end of the color wavelength spectrum, blue has the opposite effect. It decreases your heart and respiratory rate. It’s no wonder why most business’s logos and websites make extensive use of blue's relaxing effect.

However, the greatest effect on relaxation comes from brightness. The optimal color for relaxation has a blue hue, low saturation (a grayer blue, that is) and high brightness. A color with these characteristics is pictured below. [Note: relaxation here does not refer to pleasure, it refers to a positive low-arousal state.]

Optimizing for relaxation has the additional benefit of a sense of swiftness. Relaxation makes time seem to go faster, and tension, such as one caused by the color red, will make it seem to go slower when waiting on something such as loading a website. Creating this sense of swiftness makes people more likely to recommend your site.

Hedonistic Motivation

Hedonism is defined as the pursue of pleasure, especially the pleasure of our senses. Consumers with hedonistic motivations find a high-arousal environment more pleasurable than a low-arousal one. In simpler English, users motivated by pleasure prefer an exciting environment.

Take nightclubs for example. Flashing lights, pounding music and intoxicating beverages. It is truly designed for a hedonistic experience.

From what I've experienced, nightclubs tend to have websites with dark colour schemes. Dark websites are said to facilitate elegance better than their bright counterparts. Perhaps Mercedes Benz' website is dark because of that:

Mercedes Benz website

But what if you were the manager of a Mercedes dealership, and had to order new cars to your store each week? You would probably prefer an interface that is low-arousal, enabling you to order those products effectively without any distracting stimuli.

Summary

We’ve established a pretty strict rule: bright, blueish and low-arousal color schemes for utility websites, and colorful, high-arousal color schemes for hedonistic sites.

However, the division between an utilitarian and hedonistic motivation might not be so clear-cut. For example, is Facebook for hedonistic or utilitarian tasks? Reading status updates and viewing other people’s profiles might entertain you while the message and events sections might serve a more useful purpose. It definitely has a pretty low-arousal design.

So while the dichotomy between utilitarian and hedonistic doesn’t apply to every situation, you should now have a good idea whether to go for a low or high arousal color scheme.

If you liked this article, you should follow me on Twitter: @tommikaikkonen