The Elements of Design - Texture and TypographyPresentation Transcript
The Elementsof DesignTexture and Typography
Lesson Overview In this lesson, you will: Explore the use of texture in Web design Explore the use of typography in Web design
Guiding Question Does the style of text used in a publication convey emotion?
Texture Texture is the use of certain design techniques to create the illusion of depth or three dimensions on a flat surface Can be achieved through the use of: Lines Shadows Color to highlight
Using Lines for Texture Lines can be used to create texture by showing details in objects. Examples: Detail lines in hand-drawn images Veins on leaves Grain lines on a piece of wood Hair or fur on an animal Illusion that object is not flat
Using Shadows to CreateTexture Make an object appear to be raised off the surface By adding a shadow to text or other object, the designer is trying to create an illusion. Can be added to: Text Buttons Image outlines
Using Texture as a Background Texture can also be added to the background of a Web site Can add visual appeal Can be distracting if used incorrectly When using a textured background, designers should place elements, such as text and objects, inside a solid colored shape
Typography Refers to the design of the fonts used on a page Involves choices of: Style Emphasis Size Color
Style Font style is a description of how the letters in the font are shaped The commonly used styles are: Serif, and Sans-Serif
Style Serif font Small strokes at the end of letters Useful in printed material Example: Times New Roman Sans-serif font Drops the strokes at the end of letters Useful in electronic material Example: Arial
Style Decorative Script Font: Apple Chancery Historic or elegant look Difficult to read in longer portions of text Symbol Font: Webdings (Webdings) Symbols for letters or words Secret codes Mr. Hahn is cool!
EmphasisA way to call attention to a word or a portion of your text is by using emphasis You need to be consistent in your use within the site. Examples: Bold Italics Color
Size Measured by points 8 pt 12 pt Point = 1/72 inch 20 pt Sizes for Web design 12 points or 14 points 36 pt 10 points or lower: 48 pt hard to read 16 points or higher: 60pt used for headings
Typography Sends a Message Some styles communicate an emotion or a feeling Decorative – historic or elegant Capital Letters – ANGER OR SHOUTING
Lesson Review Howdoes the use of texture and typography apply to Web design?