Fonts!

Fonts!

Kate Krolickikkrolick@williams.edu

 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