1. Fall 2009

2. Unit 2. Development Module 8: Typography & Design

3. Key Terms Typography – The art of letterform Instructional Typography – using letters, words, and passages of text to communicate instructional messages Typeface – Formal definition of alphabetical and numerical characters that are unified by consistent visual properties; type is synonymous with typeface Font – A computer-generated typeface for a specific point size; recent interpretation to mean typeface Type Family – The complete array of typeface; e.g., Arial, Times New Roman, Comic Sans Serif, etc. Text – The main body of written or printed material; excludes footnotes, appendices, display elements, etc. Legibility – Degree of ease of reading short segments (bursts) of text Readability – Degree of ease of reading long passages/sections of text Module 8. Type and Typography3

4. The Power of Type Create chunks of information to facilitate comprehension, understanding od directions, procedures, etc. Complex type can express emotion, enhance a message Type has organizational and communicative power Facilitates contrast, alignment, repetition, and proximity Module 8. Type and Typography4

5. Classifications of Type Classifications of type/fonts is based upon the characteristics of the anatomy of each Type is classified into six groups: 1.Black Letter 2.Roman 3.Square Serif 4.Sans Serif 5.Script 6.Decorative Module 8. Type and Typography5

6. Classifications of Type: Black Letter One of the oldest type faces Limited application in instruction Primarily used for decoration D rop-cap letters Old Century Module 8. Type and Typography 6

7. Classifications of Type: Roman - Old Style, Modern, Transitional Old Style –Considered easy to read –Widely used in instructional materials –Tapered and slanted serifs, inclined counters –Garamond, Times New Roman Modern –Striking in appearance, difficult to read in large quantities of text –Perpendicular serifs, upright counters, high contrast between lines –Bondini Transitional –Very readable –Share characteristics with Old Style and Modern –Centaur Module 8. Type and Typography7

8. Classifications of Type: Square Serif Similar to Roman typefaces Widely used in educational materials; highly readable Frequently used in children’s books Often darker than others (contrast) –Century –Georgia (web) Module 8. Type and Typography8

9. Classifications of Type: Sans Serif Literally means “without serifs” Considered by some to be more legible for computer-based instruction & presentation than serif types Frequently used as headings in all types of instructional materials –Franklin Gothic –Trebuchet (screen display) –Verdana (screen display) Module 8. Type and Typography9

10. Classifications of Type: Script Limited application in instructional materials: difficult to read in text Used to designate different voice Certificates, designate historical periods, ornamentation Cursive –Brush Script –Lucida calligraphy –Freestyle Script Module 8. Type and Typography10

11. Classifications of Type: Decorative - Symbol Image based typeface – symbols and Dingbats –Qwerty –Menagerie Dingbats –Webdings –Wingdings 1 & 2 –  (Wingdings 3) Module 8. Type and Typography11

12. Classifications of Type: Decorative - Display Used for title, headings, other display purposes Too tiring for lengthy text Create mood, act as metaphors, attract attention –Snap ITC –Curlz –Jokerman –Ravie Module 8. Type and Typography12

13. How do you know what is best? The “It depends…” Rule The learner The content The task The environment Other elements in the visual Your skills and abilities in graphics and design Module 8. Type and Typography13

14. How do you know what is best? Serif typefaces tend to be recognized as having high readability Sans serif typefaces are typically viewed as being clear and legible Research is inconclusive A bold sans serif typeface used in conjunction with a lighter font provides excellent contrast; facilitates “chunking” Module 8. Type and Typography14

15. Attributes of Type Ascender – part rising above body Descender – part falling below body Caps height – uppercase letter measured from baseline Ascender height – height of tallest part of letter X-height – height of lower case letter without ascender or descender; the taller the x-height, easier to read (Georgia) Bowl – portion of a letter that encloses a counter Serif – wings Baseline – does not include descenders Cross stroke – horizontal stroke crossing a vertical stroke of a letter Module 8. Type and Typography15

16. Attributes of Type, cont’d. Counter – enclosed or partially enclosed portion of a type character; width –Readability increases as width of counter increases Leading – vertical space between lines of text; a.k.a. line spacing in some computer programs –Increase leading to increase interest, attention Kerning – horizontal space between individual letters or characters in a word –Used mostly with type sizes 30 points and higher –Improves appearance of headings, titles –Can enhance readability –Makes things “fit” better Module 8. Type and Typography16

17. Type and Layout Alignment: left justified, centered, right justified, justified Line Length –dependent upon font, font size, page size, direction, leading –Palm width = 4-5” –Break line according to logic/content, not formula Type Size –36 points = ½ inch; 72 points = 1 inch –X-height and counter size can affect appearance of font even when point size is equal –12 point recommended for print and computer-based instruction –6x6 Rule: projected slide/transparency should have no more than 6 lines of text and no more than 6 words per line –Computer screen – view it from 6 feet @ 100% –For every 10 feet, increase typeface ½ inch Module 8. Type and Typography17

18. Cueing and Typography Change type to signal a change in the text to the reader: colors ALL CAPS bold or italic or underlining Size K e r n i n g Leading Module 8. Type and Typography18

19. Resources and Activities Resources: Fonts for Teachers http://www.fonts4teachers.com/ http://www.fonts4teachers.com/ Assignments: 1.Communicating with Typography 2.Using guidelines provided, create a document that illustrates the variety of possibilities for using typography, layout, design, and other features of Microsoft Word. Module 8. Type and Typography19