Typography
Definition
The art of arranging text – choosing fonts, sizes, spacing, and hierarchy. Good typography makes content readable and reinforces your brand identity.
What is Typography?
Typography is the art and technique of arranging type. On the web, this means choosing fonts, setting sizes, managing line heights, and creating visual hierarchy with text.
Why Typography Matters
Readability
Poor typography makes content hard to read. Users won't struggle – they'll leave.
Brand Identity
Fonts carry personality. A law firm and a children's toy shop shouldn't use the same typography.
Professionalism
Bad font choices make businesses look amateur. Good typography signals quality.
Key Typography Terms
Font vs Typeface
Technically, a typeface is the design (Helvetica), and a font is a specific instance (Helvetica Bold 12pt). In practice, people use these interchangeably.
Serif vs Sans-Serif
- Serif: Has small decorative strokes (Times New Roman)
- Sans-serif: Clean, no decorations (Arial, Helvetica)
Line Height
Space between lines of text. Too tight is cramped, too loose feels disconnected.
Letter Spacing
Space between individual characters. Affects readability and style.
Web Typography Best Practices
Limit Font Choices
Two fonts maximum – one for headings, one for body text.
Size for Readability
Body text should be at least 16px. Smaller is hard to read on screens.
Contrast
Sufficient contrast between text and background. Light grey on white is problematic.
Line Length
50-75 characters per line is optimal. Longer lines are harder to track.
Mobile Considerations
Fonts should be readable on small screens without zooming.
Choosing Fonts
- Match your brand personality
- Prioritise readability
- Check licensing for web use
- Consider loading speed (web fonts add weight)