1. Web Design Principles II: Web Colors & Typography References Designing Web Graphics. 3 by Lynda Weinman The Non-Designer’s Web Book by Williams and Tollett From http://www.ctpub.com/archive/020401/feature1.html

2. Before the Next class: Visit these Web sites and read some!!  http://usability.gov/guidelines/ http://usability.gov/guidelines/  http://usableweb.com/ http://usableweb.com/  http://info.med.yale.edu/caim/manual/index.html http://info.med.yale.edu/caim/manual/index.html

3. Check these http://www.mundidesign.com/webct/ http://www.alistapart.com/stories/color/color2. html (just this one page) http://www.alistapart.com/stories/color/color2. html http://msdn.microsoft.com/library/default.asp? url=/library/en- us/dnhess/html/hess08142000.asp (just this one page) http://msdn.microsoft.com/library/default.asp? url=/library/en- us/dnhess/html/hess08142000.asp

4. Color Terminology Spectrum: All the possible colors in a color space, such as RGB or CMYK Hue: A color within the spectrum Value: the range from light to dark Saturation: the intensity of a color  Muted: very little saturation (Pastel colors)

5. Color Wheels Primary colors on screen: RGB Picture from http://www.users.talstar.com/iwa/member/presentations/colors/

6. Recommended color hue combinations Complementary Opposite ends of the color wheel http://www.vantech.net/ Split Complementary  one off from the opposite color Web Designing with colors (http://www.users.talstar.com/iwa/member/presentations/c olors/index.html, not available)http://www.users.talstar.com/iwa/member/presentations/c olors/index.html

7. Analogous Close colors on the wheel Triad colors  three colors that are equidistant on the color wheel.

8. Recommended color hue combinations (continued) Cool colors Warm colors Monochromatic: Try different saturation (or value) with the same color http://www.thetech.org/exhibits/online/color/saturation/ http://library.thinkquest.org/50065/art/effact.html

9. Color examples http://evolt.org/index.html  Use a combination of analogous color http://www.lacountyarts.org  Use the many different hues, but similar value of colors http://www.napastyle.com/

10. Web Typography Sans serif vs. Serif The default font in most browsers is a serif typeface: Times Roman or Times New Roman Sans serif needs the FONT FACE tag Monospace vs. Proportional

11. Typography on the Web http://www.efuse.com/Design/web_fonts_basi cs.html http://www.efuse.com/Design/web_fonts_basi cs.html  http://www.will- harris.com/webtype/mistake__1.html http://www.will- harris.com/webtype/mistake__1.html http://counterspace.motivo.com/ http://www.rsub.com/typographic/ http://www.microsoft.com/typography/default. asp http://www.microsoft.com/typography/default. asp

12. Considerations for typography Web is a full of information  Viewers are skimming  Try to hold viewers’ attention  Try to bring out the important ideas Break up blocks into more digestible portions  Paragraphs  Bold or italics  Hypertext

13. FONT FACE Tags Users much have the font you use  http://www.microsoft.com/typography/fontpack/def ault.htm http://www.microsoft.com/typography/fontpack/def ault.htm  Win95 (and up), G3 (and Up) and IMac include these fonts type the text Verdana & Georgia Fonts look larger on PCs than do on Macs

14. Graphic-based Typography Make your title or headers as graphic files Font sites  http://www.adobe.com/type/ http://www.adobe.com/type/  http://www.bitstream.com/index.html http://www.bitstream.com/index.html  http://www.letterror.com/ http://www.letterror.com/  http://www.execpc.com/~adw/ http://www.execpc.com/~adw/ Handwriting Fonts

15. PDF Files It shouldn’t not be used as an HTML substitute. http://www.designsbymark.com

16. Metaphor Does it help the target audience to understand better about your Web Site? http://www.ecomulch.com/ http://www.igougo.com/home.html

17. Your challenge for the FireWorks Can you make this using Fireworks? http://www.will-harris.com/index.html