The Significance of ColorOakenDoor.doc

《The Significance of ColorOakenDoor.doc》由会员分享，可在线阅读，更多相关《The Significance of ColorOakenDoor.doc（12页珍藏版）》请在三一办公上搜索。

1、Making Color Choices for Web sitesBibliography:The following information was gathered through Web and book research. It was then edited into the current color guide (Making Color Choices for Web sites).Table of ContentsCOLOR3ABSORPTION AND REFLECTION4YOUR EYES PERCEPTION4COLOR MODELS AND MANAGEMENT4

2、Additive Color5Subtractive Color5THE SIGNIFICANCE OF COLOR7Physiological Reactions8The Symbolism of Color9CHOOSING EFFECTIVE COLOR SCHEMES9CONSIDERING COLOR BLINDNESS10APPENDIX A12ColorOne of the nagging questions on every (good) Web designers mind today is, What color choices should I make when put

3、ting together my Web site. There are the conservative-minded who stick to black text on a white background; this is a solid concept for delivering no-frills information in a usable manner. Remember the term usable when reading through the rest of this document; usability is key and everything else i

4、s secondary, but usability doesnt always equal minimalism. The more artistic-minded Web designers and many existing and potential clients looking to make their Web sites unique and memorable tend toward more robust color choices and layout. In complex Web sites that use varying levels of intricate p

5、rogramming (animation, Javascript, Java, Perl, etc.) that need to draw attention on a page full of color and still maintain the usability of finite elements, there must be distinguishing color choices. What color is, how it is created, and how we as humans view it is a centuries-old debate that can,

6、 to this day, break down into a vehement religious argument. Socrates postulated that fire originating from the eye combined with an objects intrinsic whiteness to produce color. Isaac Newton explored the true relationship between color and light in the 17th century, demonstrating that color did not

7、 reside in objects themselves but was rather a product of light, and that white light could be reconstructed by combining all of the individual wavelengths in the visible light spectrum. These wavelengths corresponded to seven individual colors: red, orange, yellow, green, blue, indigo, and violet.T

8、he visible light spectrum isolated by Newton in his experiments makes up a small portion of the electromagnetic spectrum that ranges from low frequency, long wavelength regions (such as radio waves) to high frequency, short wavelength regions (such as X-rays). In between infrared and ultraviolet wav

9、es resides the visible light spectrum that includes the range of waves from 700nm (red) to 400nm (violet). While Newton proved that these individual wavelengths produced white light when combined, in actuality only three visible wavelengths are necessary to reconstitute white light: red, green, and

10、blue.The modern scientific study of color harmony and the evocative properties of color yield information that influences the work of fine artists, designers, and advertising executives. This guide to color theory sheds light on some of the more enigmatic aspects of the effective use of color on the

11、 Web, and it illustrates techniques that you can use to reveal color harmonies and harness the power of color symbols on Web sites. How humans perceive color depends on the interplay of three elements: The nature of light. The reflective properties of an object. The ways that our retina and visual c

12、ortex process light waves. Regardless of what medium we work in (paint, print, or the Web) our ability to effectively use color depends on these processes.Absorption and ReflectionWhen light waves strike an object in nature, the object can transmit, absorb, or reflect various individual light waves.

13、 Depending on the nature of the object and its atomic structure, it might reflect green light while absorbing the other wavelengths. The retina and visual cortex process this reflected light to produce our perception of color.When artists and designers reproduce color on canvas or paper, they mimic

14、this process by using pigments that absorb certain light waves while reflecting others. For instance, to produce green, we use pigments that absorb red and blue wavelengths. This process forms the basis of the color models used in both painting and print media.Your Eyes PerceptionOur ability to proc

15、ess light waves, whether reflected off of an object or emitted from a light source, depends on the retina of the human eye and the visual cortex of the brain. The retina contains three receptors, or cones, that respond to certain light wave frequencies. Red cones respond to low frequency waves, gree

16、n cones respond to middle frequency waves, and blue cones respond to high frequency waves. These cones are not binary but rather act as channels that transmit levels of stimulation to the visual cortex, which processes the sum of these signals to produce the perceived color.In order to produce the d

17、esired color, artists and designers must either add or subtract light waves, so that only certain light waves are reflected to the receptors. Whether you add or subtract light depends on the medium in which you are working. Color Models and ManagementWhen designers deal with color, they usually rely

18、 on one of two color models: the additive color model, in which individual color waves combine to form white light, or the subtractive color model, in which pigments are used to subtract light waves. Both the traditional artists palette and the CMYK systems are subtractive color models. On the Web,

19、where we deal with light projection rather than light reflecting off of objects, we use an additive color model called RGB.Additive ColorIn the natural world, the light waves that reach our retina are reflected off of objects, but there are other ways to produce color. Stage lights, for example, pro

20、duce color by projecting white light through colored filters. Computer monitors also use projected light, but in that case the light is produced when electron guns are fired against a phosphor screen. These guns fire electrons in three colors: red, green, and blue. Using only these three colors, mon

21、itors can produce a full spectrum. This is known as the RGB color system.Within the RGB system, designers can also produce a color spectrum by amalgamating these three primary colors. Combining two of the primary colors generates three secondary colors: cyan, magenta, and yellow. As previously noted

22、, adding all three primary colors together produces white light. Thus, an RGB value of 255,255,255 produces white, as seen in the center of the previous graphic. The complete absence of the three primary colors (RGB: 0,0,0) produces black.Subtractive ColorThe inverse of the RGB model is the CMYK mod

23、el, in which light waves are subtracted to produce the desired color. Since the color of an object is derived from reflected light waves, this system uses three primary colors that each absorbs red, green, or blue light. For instance, if you subtract red light, the remaining green and blue waves pro

24、duce cyan. The pigment used to subtract red light and reflect green and blue appears cyan. Similarly, print designers use magenta to absorb a percentage of green light and yellow to absorb a percentage of blue lightAt this point, it should be apparent that the primary colors of the CYMK model are th

25、e secondary colors of the RGB model, and vice versa. Moreover, if red, green, and blue light combine to produce white light, it stands to reason that cyan, yellow, and magenta pigments should combine to create black, since they should absorb all of the light waves. However, due to the limitations of

26、 the pigments and the printing system, the full combination of cyan, yellow, and magenta doesnt quite absorb all light. In practice, its necessary to add black (the K in the CMYK model) to the system.Color HarmonyOne of the most challenging aspects of visual design is developing effective color harm

27、onies that strike a balance between monotony and overstimulation. One place to begin exploring balanced and engaging color relationships is a color wheel-a representation of the hues available in a color model.Each color model contains three primary colors from which all other colors are derived. In

28、 traditional color theory, the three primary colors are blue, red, and yellow. In the RGB color model, the primary colors are red, green, and blue. Any two primary colors combine to produce a secondary color. Tertiary colors are derived from either a combination of a primary and a secondary color or

29、 from a combination of two secondary colors. We use color wheels to present all of these colors in a logically arranged sequence. As you can see from the illustrations below, an RGB color wheel (right) differs significantly from the traditional artists color wheel (left): Color wheels expose relatio

30、nships between colors that can be used to achieve both balance and contrast. The wheels include a number of full-intensity (saturated) hues as well as a variety of tints, tones, and shades, which are less saturated versions of the hue that include more white, gray, or black, respectively. While comb

31、inations of pure hues create dynamic color harmonies, you can design more subtle and subdued harmonies by using less saturated colors that are closer in value-that is, colors with similar degrees of lightness or darkness. Some common color harmonies include:Monochromatic: A monochromatic color set,

32、as it sounds, uses a single hue but with varying tints and shades. Used correctly, this scheme can give a Web site a nice, clean look.Analogous: Colors that are side-by-side or very near each other on a color wheel. A grouping of three is shown to the left, but choosing four contiguous colors along

33、the color wheel can also work well.Complementary: Colors appearing across from one another on a color wheel. These color combinations offer the maximum amount of contrast but can be overstimulating if used extensively. These are called complementary colors because, when used together, they seem to m

34、ake each other brighter and more vividSplit-complementary: One hue plus the two colors on either side of its complement. Split-complement harmony provides less contrast than straight complements.Triad: Three colors that are equidistant on a color wheel. This is the simplest approach to choosing colo

35、rs. Simply imagine (or use) an equilateral triangle floating above a color wheel. Each color at the vertices is a usable color. In total, there are four possible triads that can be derived from the color wheel. See the color wheel in Appendix A. You can print it out (using a color printer of course)

36、 and begin drawing equilateral triangle points or vertices on the wheel. Repeat for each of the 4 possible triads.Now were ready to start mixing things up a bit, what with the triads and the complementary colors and all. For example, you could combine two complementary pairs together, called a doubl

37、e complement. Something like yellow and purple, blue and orange. Another iteration of glorious color would be an alternate complement, where you combine a triad with the complement to one of the triadic hues. Green, reddish-purple, red, and orange for instance. You can also have a split complement t

38、hat uses three colors, a hue and the two adjacent to its complement.Finally, in the combination category, you can have a tetrad, an example of which is shown next, where you combine four colors that are directly across from each other. Here you would be using a primary, a secondary, and two tertiary

39、 colors.Tetrad: Two pairs of complementary colors.When exploring color harmonies, its often useful to begin with pure hues, then experiment with various tints, tones, and shades. You can then test the visual effect of a particular color combination by using a wireframe diagram. Remember that the imp

40、ortance of contrast doesnt end with designing for impact; it can also help or hinder readability. The Significance of ColorWhile examining the scientific nature of color and the aesthetic considerations of color harmony, weve seen that perception plays a large part in the effective use of color. Bey

41、ond the mechanics of perception and the recognition of balanced color palettes lies the intangible, visceral reaction that humans have to color. Colors evoke strong physiological and emotional responses both positive and negative. When you develop your color palette, make sure that the colors you se

42、lect elicit the appropriate response.Physiological ReactionsAlthough there has not been a great deal of conclusive evidence linking colors to specific responses, research suggests that certain colors do evoke physical responses. Red, for instance, is a very stimulating color and has been shown to pr

43、oduce increased heart and respiratory rates. Thus, red works as an excellent attention grabber and accent but could easily overstimulate when used as a background color. Similarly, yellow also demands attention, but since it is highly reflective, it creates eye fatigue and aggravation. On the other

44、hand, the color blue has a relaxing effect on the nervous system, and some studies have shown that it increases productivity when used as a background color. However, dont use blue in your color scheme if your product is food-related, as blue is a natural appetite suppressant.The Symbolism of ColorT

45、he symbolic meaning associated with colors sometimes has precedent in nature. For instance, the color of the sky or the sun creates certain fairly universal associations. However, the underlying meaning that we derive from most colors is based on cultural-specific elements-politics, religion, mythol

46、ogy, and other shared social structures-that may shift over time and across geographical boundaries. Be careful when designing and marketing sites specifically for audiences outside of your cultural reference, since a color that has a positive connotation in one culture may have a negative connotati

47、on in another. In addition, most colors have both positive and negative associations. You can emphasize certain meanings over others by using variations of value and saturation, or by using colors that combine two hues.Common Color Connotations in Western Culture: Red: passion, romance, fire, violen

48、ce, aggression. Red means stop or signals warning or forbidden actions in many cultures. Purple: creativity, mystery, royalty, mysticism, rarity. Purple is associated with death in some cultures. Blue: loyalty, security, conservatism, tranquility, coldness, sadness. Green: nature, fertility, growth,

49、 envy. In North American cultures, green means go, is associated with environmental awareness, and is often linked to fiscal matters. Yellow: brightness, illumination, illness, cowardice. Black: power, sophistication, contemporary style, death, morbidity, evil. White: purity, innocence, cleanliness, truth, peace, coldness, sterility. White is also the color of death in Chinese cult