typography beginning l.
Skip this Video
Loading SlideShow in 5 Seconds..
Typography Beginning PowerPoint Presentation
Download Presentation
Typography Beginning

Loading in 2 Seconds...

  share
play fullscreen
1 / 58
Download Presentation

Typography Beginning - PowerPoint PPT Presentation

jana
317 Views
Download Presentation

Typography Beginning

- - - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

  1. Typography Beginning Some essentials for CSS typography And more

  2. Font History

  3. Type faces written to imitate written script • At the beginning of the era of movable type, manuscript books were the real thing, and printed books were imitations

  4. The Gottingen Model Book c. 1450

  5. Gutenberg • 42-line Bible 1455

  6. creation story

  7. Humanist or Roman fonts • An imitation of the script supposed to be used by humanist scribes • Italic or Cursive fonts • Griffo created the most famous in imitation of cancelleresca corsiva, or cursive writing of the papal chancery • Gothic or Textualis or Blackletter fonts • Imitation of gothic script (Gutenberg Bible)

  8. Early history of printing • First 300 years after 1450 • Oldstyle fonts • Serif fonts

  9. Humanist (Venetian) • the first Roman type faces that appeared in Venice in 1470 Nicholas Jenson (1420-1480)

  10. Humanist • Strong, bracketed serifs • letters are in general wide and heavy in colour • characteristic letters are the wide lower case e with a diagonal bar to the eye • a square full point or period

  11. Humanist (Venetian)

  12. Garalde (Old Style) • designed by such masters as • Claude Garamond (French) • Aldus Manutius (Venetian) • include some of the most popular Roman styles in use today Claude Garamond c.1480–1561

  13. Garalde • rounded serifs • moderate contrast between strokes • letters are open, rounded and very readable • thick strokes of curved letters are off-balanced • angle of stress less acute than Humanist types

  14. Garalde (Old Style)

  15. Transitional • eighteenth century (a time of transition) • type designers relied on mathematical or scientific principles to create new letterforms John Baskerville 1706–1775

  16. Transitional • rounded serifs • less formal than Modern (Didone), but more formal than Garalde • comparable to both Garalde and Modern • curved letters are more balanced than Garalde • angle of stress is near vertical, like Modern

  17. Transitional

  18. Birth of modern fonts

  19. Didone (Modern) • late eighteenth century • improvements in paper production, composition, printing and binding • made it possible to develop a type style with strong vertical emphasis and fine hairlines

  20. Didone (Modern) • Developed by Didot family (French) • perfected by Giambattista Bodoni (Italian) Giambattista Bodoni 1740–1813

  21. Didone (Modern) • thin, straight serifs • extreme contrast between the thick and thin strokes • curved letters are balanced and slightly compressed • angle of stress is vertical • Prints best on a smooth, matt-finish, white paper in black ink

  22. Didone (Modern)

  23. Note • All these fonts are classified in CSS under the font-family serif • Ones with fine features or fine lines are not as suitable for screen display

  24. Sans Serif • Reaction in art and design to WWI

  25. Edward Johston, London Underground Typeface 1916

  26. Paul Renner,Futura typeface 1928

  27. Monospace • Designed for typewriters or other mechanical writing machines • Now its use is associated with computer code

  28. cursive • Different from italic • Attempt at joined letters

  29. fantasy • Anything else

  30. Part two

  31. Legibility and readability • Dictionary definitions are interchangeable • Typographic definitions are different

  32. Differences • Legibility • Can the shapes of the text be made out? • Is the signal getting through? • Readability • Can the reader read and absorb the content with ease?

  33. Legibility and Readability • Legibility is a function of • typeface design: about distinguishing one letter from another in a particular typeface • use of type on a page or a screen • Readability is a function of typography • about how easily words, phrases and blocks of copy can be read

  34. Legibility example —bold text • Bold text eliminates contrast

  35. Legibility —bold • Bold text eliminates contrast

  36. Legibility —ultra bold • Bold text eliminates contrast

  37. Legibility —ultra bold • Bold text eliminates contrast

  38. Legibility —3 principles • Transparency • Big features • Restraint

  39. Transparency • typefaces should be “transparent” to the reader • the content should be more important than the container • typefaces should not call undue attention to themselves

  40. Big Features • Legible fonts have • large, open counters • counters are the white space within letters such as ‘o,’ ‘e,’ ‘c,’ • ample lowercase x-heights • character shapes that are obvious and easy to recognize

  41. Restraint • legible typefaces • are not excessively light or bold • weight changes within character strokes are subtle • serifs (if present) do not call attention to themselves

  42. Readability • For print • High contrast colours • serif font • For screen • High contrast colours • sans-serif font