skip to content

Chapter 5: Color


Contents of Book Chapter

  • Color Theory
  • Defining Colors for the Web
  • Choosing a Color Scheme
  • Color and Accessibility

Resources

  • Hexagon palette.
  • Installing the VisiBone palette.
  • Color for Websites, by Molly Holzschlag. East Sussex, U.K.: Rockport Publishers, 2003.
  • Web Designer’s Guide to Color, by Mordy Golding and Dave White. Indianapolis, Indiana: Hayden Books, 1997. An excellent discussion of color theory. 
  • Color Harmony for the Web, by Cailin Boyle. Gloucester, MA: Rockport Publishers, 2001. Overview of color theory followed by hundreds of RGB color schemes grouped by mood. One book from an entire series of “Color Harmony” books, all of which are excellent for someone having difficulty coming up with color schemes, but many of them display only CMKY color codes.
  • www.color, by Roger Pring. New York: Watson-Guptill Publications, 2000. More about color theory, with approximately 2/3 of the book devoted to analyzing the color and graphics on existing web sites.
  • Color Index, by Jim Krause. Cincinnati, Ohio: HOW Design Books, 2002. “Over 1100 Color Combinations, CMYK and RGB Formulas, For Print and Web Media.” Again, these colors are grouped by mood.
  • Color: The Best Work from the Web, by Jeff Carlson, Toby Malina, and Glenn Fleishman. Gloucester, Massachusetts: Rockport Publishers, 1999. The book is a gallery chock-full of examples of real web sites that have used color effectively.
  • Pantone Guide to Communicating with Color, Leatrice Eiseman. Sarasota, Florida: Grafix Press, 2000.
  • https://addons.mozilla.org/firefox/60/ : Add-on toolbar for Firefox, including grayscale viewer.
  • http://www.visionaustralia.org.au/info.aspx?page=614 : Add-on toolbar for Internet Explorer, including grayscale viewer.
  • www.adobe.com : an ever-changing series of articles plus tool explanations.
  • http://dir.yahoo.com/Arts/Design_Arts/Graphic_Design/
    Web_Page_Design_and_Layout/Color_Information/
    : a bibliography of other sites with color resources.
  • http://www.visibone.com : the Visibone palette, a color picker utility, and articles on color. Also a source for beautiful posters, mouse pads, and pocket charts showing the web-safe palette (but no mugs, as yet!).

back to top...

Exercises
(mouseover answer boxes to reveal answers)

Check Your Reading Comprehension

  • Choose all of the following that are true neutral hues:
    • #FFCCCC
    • #FFFFFF
    • #AAAAAA
    • #636363
    • #223452
    • #000000
  • A fully saturated hue (choose one):
    • is formed by mixing the three primary colors.
    • looks wet.
    • is formed by mixing a hue with gray.
    • is formed by mixing a hue with white.
    • is a hue at full-strength, unadulterated by white, black, or its complement.
  • Value is (choose one):
    • the lightness or darkness of a color.
    • how appropriate a color is for the intended audience.
    • a hue mixed with gray.
    • a hue mixed with black.
  • A tint is (choose one):
    • a hue mixed with white.
    • a hue mixed with black.
    • a hue mixed with gray or the hue’s complementary hue.
    • a hue mixed with the hue next to it on the color wheel.
  • A shade is (choose one):
    • a hue mixed with white.
    • a hue mixed with black.
    • a hue mixed with gray or the hue’s complementary hue.
    • a hue mixed with the hue next to it on the color wheel.
  • A tone is (choose one):
    • a hue mixed with white.
    • a hue mixed with black.
    • a hue mixed with gray or the hue’s complementary hue.
    • a hue mixed with the hue next to it on the color wheel.
  • Computer screens display colors based upon (choose all that apply):
    • subtractive color mode.
    • additive color mode.
    • RGB colors.
    • CMYK colors.
    • projected light.
    • reflected light.
  • The primary colors for subtractive color mode are (choose one):
    • red, green, blue
    • red, yellow, and blue
    • orange, green, and purple 
    • yellow, magenta, cyan
  • The secondary colors for additive color mode are
    • red, green, blue
    • red, yellow, and blue
    • orange, green, and purple 
    • yellow, magenta, cyan
  • Choose the web-safe color(s) from the following list:
    • #CC99FF
    • #363636
    • #999999
    • #BBCCDD
  • A cue that tells the visitor that something is a link is termed a(n)
  • affordance.

  • Give the HTML color code for each of the following:
  • List the four color attributes that can be used to provide contrast.
    • Hue
    • Value
    • Saturation
    • Temperature
  • Answer the questions about the provided color schemes.
  • Color Scheme A
    • Color scheme?
      triad
    • For #666699:
      • Predominant hue?
        blue
      • Fully saturated, tint, shade, or tone?
        tone
    • For #FF6666: 
      • Predominant hue?
        red
      • Fully saturated, tint, shade, or tone? 
        tint
    • For #FFFF00:                
    Color Scheme B
    • Color scheme?
      triad
    • For #990000:
      • Predominant hue?
        red
      • Fully saturated, tint, shade, or tone?
        shade
    • For #AAAAFF: 
      • Predominant hue?
        blue
      • Fully saturated, tint, shade, or tone? 
        tint
    • For #FFFFAA:                
      • Predominant hue?
        yellow
      • Fully saturated, tint, shade, or tone? 
        tint
    Color Scheme C
    Color Scheme D
    Color Scheme E
    Color Scheme F

back to top...

Critical Thinking Exercises (long answer)

Use vocabulary and concepts from the text to answer the following questions. Provide examples to document your explanation.


| Home | General | 1: Introduction | 2: Site Analysis | 3: Navigation |
| 4:Layout | 5: Color | 6: Graphics | 7: Typography | 8: Forms |