This document provides an overview of typography and font design. It discusses different font categories including serif, sans serif, script, decorative, and modern. It describes font elements such as typeface, glyph, and kerning. It provides tips for choosing fonts for different purposes and platforms. The document also discusses logo design principles such as simplicity, scalability, and readability in different color modes.

1. Type
February 6, 2014
Image source: http://cravagolina.files.wordpress.com/2011/03/death_by_typography_by_gcore1.jpg

2. Type Sets the Tone
• Font
• Typeface or Font Family
• Glyph
Image source: http://fineartamerica.com/images-medium/neon-sign-series-featuring-the-alphabet-in-red-michael-ledray.jpg

3. Parts of a Font
Image source: http://365.idtech.com/tutorials/typography_illustrator/
http://www.fontshop.com/glossary/

4. Image source: http://martinsilvertant.deviantart.com/art/Typography-Series-01-Anatomy-of-typography-329617642

5. Font Categories
• Sans Serif
• Serif
• Script
• Decorative
• Modern
Image source: http://www.idtech.com/blog/looking-at-typography/

6. Font Categories
Image source: http://enfuzed.com/the-psychology-of-fonts-infographic/

8. Glyphs
Most fonts have a set of 265 glyphs
Image source: http://www.fontspring.com/poster_imgs/73/14ed/2ed4a2990a857022fba66a3273/fp-720.png

9. Applying Additional Font Styling
• Font size
• Bold and Italic
• All CAPS
• Spacing
Image source: http://www.indezine.com/products/powerpoint/learn/textandfonts/format-font-styles-ppt2010.html

10. The Right Font for the Job

11. Choosing & Using Fonts
• Choose one font for your copy body
• No. 1 consideration? READABILITY!
• Choose a second font for your headlines
• Can be wild and derative, script and elegant or sans serif and ultra hip

12. Font Size
Image source: http://www.imaging.org/IST/pdfs/appendixa.pdf

13. Name a FONT FAMILY
Image source: http://bottom-of-the-glass.blogspot.ca/2012/02/birds-2-lethal-tweet.html
http://designtaxi.com/news/361384/A-Meticulous-Illustration-Of-The-Brooklyn-Bridge-Done-Entirely-In-Type/

14. Choosing Fonts for the Web
• The number of Web font is
limited
• Choose fonts that render
well onscreen
Image source: http://www.zeald.com/site/zeald2/images/Articles/fonts/web_fonts.jpg

15. Spacing - Leading
• Space
between
lines
Image source: http://www.fonts.com/content/learning/fontology/level-2/display-typography/line-spacing

16. Spacing – Kerning vs Tracking
• Negative space
between two
characters
• Adjusting the space across
a string of characters such
as a sentence or a
paragraph.
Image source: http://www.fonts.com/content/learning/fontology/level-2/text-typography/kerning-text-type
http://www.fonts.com/content/learning/fontology/level-2/display-typography/spacing-display-type
http://graphicdesign.stackexchange.com/questions/2606/difference-between-kerning-vs-letter-spacing

17. Typesetting Lengthy
Copy
• Paragraph indicator
• Heading & Subheading
• Display fonts
• Bulleted lists
• Hanging indents
Image source: http://www.attitudedesign.co.uk/2006/a-guide-to-practical-typography

18. Taking a Page from Newspaper Design
• Story headlines
• Columns
• Justification
Image source: http://www.ndsu.edu/pubweb/~rcollins/313editing/hobbiesnewsletterdirections.htm

19. What is a GLYPH?

20. Type: Not Just for Reading Anymore
• Bold & Italic
• SMALL CAPS
• Reversed Type
Image source: http://cravagolina.files.wordpress.com/2011/03/hendrix-typography.jpg

21. Typesetter’s Punctuation
•
•
•
•
•
•
•
•
•
•
•
Apostrophes
Brackets of various kinds [ ], ( ), { }, ⟨ ⟩
Colons and semicolons
Commas
Dashes and hyphens ‒, –, —, ―
Ellipsis
Exclamation and question marks
Quotation
Marks
Slashes
Special characters ©®¼½¾
Image source: http://www.newrepublic.com/article/113101/smart-quotes-are-killing-apostrophe

22. OpenType for Print Design
• Ligature
• Swash alternates
• Old style figures
• Dingbats
Image source: http://desktoppub.about.com/od/microsoft/ig/Microsoft-Publisher-2010/Publisher-2010-Ligatures.htm
http://designshack.net/articles/typography/add-flair-to-projects-with-alternate-lettering/
http://blog.rockymountaintraining.com/adobe-indesign-assigning-old-style-figures-through-grep-styles/

23. What you Need to Know about
Logo Design
• Logos should be unique to the subject/product/organization
• Logos must be scalable
• Simplicity is a virtue
• Limit the number of colors
• Make sure the logo is
reproductible in black only
• Logo can be reversed
• Logos should not be
vertical or too horizontal
Image source: https://self-issued.info/?cat=20
too

24. If you Must Design a Logo
• Consider a type-only logo
• Avoid using the font-du-jour
• No clip art
• Add a simple shape
• Test it out
• Turn fonts to graphics
Image source: http://www.logodesignmadeeasy.com/world_best_logos
http://breezycreativedesign.com/2010/01/21/5-different-types-of-logos/

25. Did I use a SERIF or a SANS
SERIF font for this presentation?