Visual Design: Color and TypographyIt’s Elementary http://pbskids.org/sesame/Color and TypographyColor BasicsThe Color Wheel http://www.creativeglazes.com/colorwheel.htmWhite Space?Perceptions of Color216 Web “Safe” Colors http://www.websitetips.com/color/colourchart.htmlColor in Web PagesTypographyMore TypographyEven More TypographyTypography on the WebRules for Typography (Carter, 2002, p.151-p.161)Rules for Typography (Carter, 2002, p.151-p.161)Color + TypographyResourcesResourcesVisual Design:Color and TypographyAmaris VigilI385TDr. TurnbullIt’s Elementary http://pbskids.org/sesame/Color and Typography •Focus • Communication of InformationColor Basics Hue - another word for color Primary hues red, yellow, blueSaturation – intensity of color Value – lightness/ brightness added to a hueThe Color Wheelhttp://www.creativeglazes.com/colorwheel.htmWhite Space? •White space a.k.a negative space•Direct attention to critical regionsEx. http://www.girlshop.com& http://www.cabedge.comPerceptions of Color Cultural Significance Ex. East India - pale pink - feminine Japan - pastels - men and women India – white – death216 Web “Safe” Colors http://www.websitetips.com/color/colourchart.htmlColor in Web Pages •Links and Navigationhttp://www.amazon.com http://www.basinstreet.netTypographyMore Typography Categories or Font Classification – ex serif, sans serif, script, fancy Families – Arial, Arial Black, Arial Narrow Type Form Weight Width PostureEven More TypographyLeading and K e r n i n gJustification Justification JustificationLine LengthLine Length Line Length Line LengthTypography on the Web •Headers, tabs, advertising, links •http://www.wddg.com/v.X.html•http://www.toolband.com/tour/index.html•http://www.ucla.eduRules for Typography (Carter, 2002, p.151-p.161) •Be mindful not to use too many different typefaces at any one time. •Text set in all capital letter severely retards reading. Use upper-and lower-case letter for optimum readability. •For optimum readability, use a flush left, ragged right type alignment.Rules for Typography (Carter, 2002, p.151-p.161) •Clearly indicate paragraphs, but be careful not to upset the integrity and visual consistency of the text. • When working with type and color, ensure that sufficient contrast exists between type and its backgroundColor + Typography •Contrast - most important–strong contrasts of hue, value and saturation •First Read - overall first impression –make or breakResources Baxley, Bob. (2003). Making the Web Work: Designing Effective Web Applications. USA. New Riders Publishing.Carter, Rob. (2002). Digital Color and Type. Hong Kong. Printing Express.Holzchlang, Molly. (2003). Integrated Web Design: Building the New Breed of Designer and Developer. USA. New Riders Publishing.Leary, M., Hale, D. & Devigal, A. (1997). Web Designer’s Guide to Typography. Indianapolis, Indiana. Hayden Books.Mullet, Kevin, and Sano, Darrell. (1995). Designing Visual Interfaces: Communication Oriented Techniques. USA. Sun Microsystems.ResourcesPBS.org. (2003). Freedom: A history of the U.S. Retrieved on February 18,2003 from the PBS web site: http://www.pbs.org/wnet/historyofus/tools/browser13b.html.Pring, Robert. (2002). www.colour: Effective Use of Colour for Web Page Design. London, U. K. Cassell & Co.Reader’s Digest. (2001). 1,001 Computer Hints and Tips: An A-toZ Guide to Making the Most of Your Computer and the Internet. Pleasantville, New York. Reader’s Digest Association, Inc.Van Duyne, D. K., Landay, J.A., & Hong, J.I. (2002). The Design of Sites. New York, NY.
View Full Document
Unlocking...