Principles of Design: Color

Why Color Is Where It's At

We chose to begin our design process by selecting a color scheme for our blog. Color is incredibly important because it will influence most (if not all) of the other decisions you will make about logo design, layout, and so forth. This is because colors can lead the eye to certain parts of the page, make elements advance or recede towards the background, or make elements appear larger or smaller. Consider the following:

•  Lots of white or soft, light colors can give the illusion of space.

•  Warm colors tend to stand out, whereas cool colors tend to stand back.

• Saturated (ragingly bright) colors catch the eye, so you should use one of them to emphasize a single point

Selecting a Mood

Color schemes also are important in creating an overall mood for your site. In considering mood, keep in mind the audience you are trying to reach and the product or message you are trying to promote. For color scheme ideas, look to the professionals: Nordstrom is an upscale outfit and so they use a simple, formal black and white color scheme. Anthropologie has a vintage clothing theme going, so they use washed out colors and playfully bright highlights to express a mixture of romantic nostalgia and fun. Don't feel like you have to come up with a completely original color scheme- go with what has already been shown to work!

Here are some examples of webpages that really create a mood with color:

More Hazards More Heroes
 This is the webpage for a folk musical group based out of Nashville. They have selected a complementary color scheme of turquoise blue and orange. Notice how the interactive parts of the page (the "play" and "download" buttons) are graphically rendered in warm colors, whereas the static parts of the page, such as titles, are in cooler shades. The muted brown tones in the background echo the laid-back, simple acoustic music that the group plays.


Brunet Garcia

These people do a lot of marketing, so their website is very graphics heavy. The front page employs a high contrast monochromatic color scheme, which is bold and attention-grabbing, just what marketing is supposed to do! Once again, the interactive element, a movie, has a bright red mark to draw the attention. The monochromatic scheme seems simple, but it is a good choice because their other pages have graphics brimming with color, and the layout should not distract from these images.


Decode
Here is another design agency with a beautiful website. They have employed a triadic color scheme, using brown, fuchsia, and sea green. Notice how large blocks of color that are merely decorative (i.e. in the background) are understated, whereas the tiny hyperlinks are bright pink! These unlikely colors give the site a youthful, modern vibe, but are slightly muted so that they avoid recalling a 6 yr-old girl's bedroom. Chocolate is a great color because it can add a subtle tone of seriousness to its more outgoing neighbors. In this case, it is replacing orange as the third element in a triad.

You don't have to have a bunch of flashy graphics to make good use of color on your website. Basic shapes can be just as striking and often very appropriate. If you are interested in adding your own photographs to your design, check out our blog posts on photography- anyone can take artful, beautiful photos with a little practice, and it doesn't require thousands of dollars of equipment, either!