| home / authoring / graphics / color / nondesigners / chap2 / 1 | [previous] [next] |
|
Successful colors schemes online are chosen to support the goals of a site, be they to strengthen branding, increase sales, or maintain readership. An intelligent color scheme not only looks good, but also creates a feeling in the audience. If you choose a scheme that does not support your goals, then you have fallen short of the potential of your site.
Color can assist in achieving goals by suggesting and atmosphere that visitors can identify with. For example, a site selling baby products could use vibrant scheme that parents would appreciate as a bright and positive influence, while an art gallery could employ a black background that presented an impression of sophistication and luxury.
While there is more to be considered than making an attractive site, knowing how to create a harmonious color scheme is a strong start. Harmonious color schemes are derived systematically from the basic color wheel of tertiary colors. For the purposes of this grounding, they are of four types: monochromatic, analogous, complementary, and triadic. Using each, it is best to aim for a selection of three or four distinct hues, coupled with neutrals.
Monochromatic color schemes are derived from a single base color, and extended using its shades and tints (that is, a color modified by the addition of black and white). Consider, for example, a saturated green (RGB {0,255,0}). The swatches each show the pure hue in the center, with white being added to the right, and black to the left. In each case, the core hue remains identical.
|
Monochromatic swatches:
|
As you can see from the wheel above, by altering the value of this pure hue we can create colors that cleanly support the original.
|
In Photoshop, changing the value next to the H in the color picker can alter hues. Adjusting the brightness is done using the value alongside the B. The S signifies the saturation of your color. The latter two values are measured as a percentage, while the hue is measured in degrees, positioning the hue on a color wheel. |
|
Screenshot: victoriassecret.com
This site bases its scheme around a feminine pink. The monochromatic scheme avoids detracting from the key, full-color photographs that sell the product. |
|
Screenshot: evolt.org
Here, the monochromatic scheme keeps the focus on the content within the site. |
A monochromatic color scheme is often considered for sites where content is of extreme importance, or when the opinions presented are of a moderate nature. It can give a site a clean and classic look, but also provides excellent opportunities to let full color photographs dominate. Monochromatic schemes are often appropriate for serious political and business sites such as those of some banks where instilling customer confidence in their experience. They are also highly suited to fashion sites where the understated monochromatic scheme supports the branding, but nevertheless allows the photographical elements to provide a focus.
| home / authoring / graphics / color / nondesigners / chap2 / 1 | [previous] [next] |
| ||||||||||||||||||||
Created: December 2, 2002
Revised: December 2, 2002
URL: http://webreference.com/authoring/languages/html/definitive/1/3.html