Embed Size (px)
DESCRIPTION
Citation preview
Anatomy of Type
Categories of Type
Oldstyle
• has serifs• serifs slanted on lower
case letters• serifs curved where they
connect to letter• thick/thin- gentle• stress- diagonal• easy to read
Examples:
Modern
• has serifs• serifs are thin & flat• thick/thin- radical• stress- vertical
Examples:
Slab Serif
• has serifs• serifs are thick, slab-like• thick/thin- none, all thick• stress- none or vertical
Examples:
Sans Serif
• no serifs• thick/thin- none, or minor• x-height- usually large
Examples:
Script
• emulates hand lettering Examples:
Monospaced
• all letters are the same width
Examples:
Distressed
• blotchy• distorted• fun, but use sparingly!
Examples:
Decorative
• very distinct, eye-catching & flavorful
• fun, but use sparingly!
Examples:
Text Density: Tracking & Leading
Tracking is the general spacing between letters - a.k.a. letter spacing.
Leading is the space between lines - a.k.a. linespacing.
Choosing the Right Font
Reinforce Your Message
Is your message playful or serious?
Evoke the Desired Response
.
Readability and Legibility
A font is readable if you can easily read long blocks of text that are set in it.
A font is legible if you can instantly recognize a brief snippet of text written in it.
Other Features that impair readability/legibility
• very noticible flourishes/decoration• drastic thick/thin contrast• very bold or very light• very narrow (condensed) or very wide (expanded)• very slanted• very large or very small x-height• very wide or very narrow column widths• poor word spacing• poor line spacing• poor letter spacing (inc. monospaced)• poor use of justification or centering• low contrast with background color• WRITING IN ALL CAPS
The Key to Readability
Moderation of features.
The more time you spend noticing a font, the less you're reading it.
The most readable fonts are "invisible."
Most readable font type: Oldstyle
The Key to Legibility
Instant recognition of letterform.
Most legible font type: Sans Serif
The font is on YOUR computer
Unless it's a browser safe font, don't count on your printer or viewer having the font on their computer!
Solutions:• save/export as a non-vector format:
o PDFo GIFo PNG
• convert text to paths before saving as a vector format• use cufon on web pages (requires javascript)
Font File Types
True Type Fonts (.ttf):
• files are platform specific- you need a Mac or PC version.
• can only hold 265 gylphs per file, so true type collections can provide extra options.
• most common free font type
Open Type Fonts (.otf):
• cross-platform compatible• can hold 65K+ glyphs per
file• more common as a paid
font
Free vs. Paid
Free Fonts:
• Great for one-off jobs• May have very limited
character sets- missing punctuation, upper case, lower case, etc.
"Pro" Fonts:
• Contain more options, expanded character sets, decorations, and multi-language support.
• Always check the description before buying- not all paid/otf fonts have extra perks.
• Good for long term identity projects
Fonts as Design Elements
Typography PostersTypography Layouts
Keep in mind:• diagonals add visual interest• vastly different font sizes can be fun• opacity & clipping masks can give cool effects• a good background texture can make a big difference
Tips for Print Material
• Avoid delicate serifs and fine lines for light on dark printing or lower quality print jobs
• Don't let the pretty font distract you from spell checking!• Ask your printer how they like material prepared, and what
file formats they perfer. • Always, always get a proof or look at a test copy before
committing to a large run
Resources
Free Fonts:http://www.fontfreak.com/http://www.1001freefonts.com/http://www.urbanfonts.com/http://www.fontriver.com/http://www.free-fonts.com/
The Non-Designers Type Book, by Robin Williams
Browser safe fonts
Embedding fonts w/ cufon
Professional Fonts:http://www.linotype.com/http://www.veer.com/http://www.fontshop.comhttp://www.adobe.com/type/http://www.fonts.com
Create your own fonts
