Basic typography rules

Basic ratios:

  • Heading font size ÷ Body copy font size = 1.96
  • line height (pixels) ÷ body copy font size (pixels) = 1.48
  • line length (pixels) ÷ line height (pixels) = 27.8
  • space between paragraphs (pixels) ÷ line height (pixels) = 0.754
  • characters per line: 75 to 85

Basic ratios: (Type size = font size)

Attribute Recommended value:
Paragraph width (max-width) = 30 (type size)                          (approx. 65 chars)
Leading (line-height) = type size + (2-5) pt
Vertical rhythm (margin bottom) = line spacing = line height = type size + (2-5)pt

Other rough guidelines:

  1. Either serif or sans-serif fonts are fine for body copy and headings, but sans-serif fonts are still more popular for both.
  2. Common choices for headlines are Georgia, Arial and Helvetica.
  3. Common choices for body copy are Georgia, Arial, Verdana and Lucida Grande.
  4. The most popular font size for headings is a range between 18 and 29 pixels.
  5. The most popular font size for body copy is a range between 12 and 14 pixels.
  6. The optimal number of characters per line is between 55 and 75, but between 75 and 85 characters per line is more popular,
  7. Body text is left-aligned, image replacement is rarely used and links are either underlined or highlighted with bold or color.

 

References:

https://www.smashingmagazine.com/2009/08/typographic-design-survey-best-practices-from-the-best-blogs

 

 

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s