Typography

Serif

• Humanist Serif, great for journalism and historical applications.
• Transitional Serif, great for traditional academia and legal applications.
• Modern Serif, great for arts and cultural applications.
• Egyptian (Slab Serif), great for marketing and promotional applications.

Sans Serif

• Humanist Sans Serif, great for government, educational and finance applications.
• Transitional Sans Serif, great for technology and transportation applications.
• Geometric Sans Serif, great for science and architecture applications.

Script

Sometimes very difficult to read. Use only on headers, labels or titles.

Mixing

A serif typography for the header and sans serif for the body content is a really good looking combination.

Don’t use two fonts from the same style. Try to use a serif with a sans serif, it is very difficult to find two fonts of the same class or style that really combine well.

Good combinations:

• Humanist Serif with Humanist Sans Serif

• Transitional Serif with Transitional Sans Serif

Sizes

Optimal body copy (base) size is 16px. Title at 300%. Subtitle at 150%. Byline text at 75%.

A good leading (line height) size is around 120% - 150% of the body copy size. If we use a reduced value the reader may suffer a claustrophobic effect, or if it is too large they can get lost easily. (line-height: 1.5;).

Line width is measured in CPL (characters per line), the ideal width is 50-70 CPL. Smaller line widths makes the reader moves from one line to another too quickly. And larger widths can make the reader get lost.