Typography in Digital Products: Our Approach
Typography — the selection and arrangement of type — is one of the most impactful visual design decisions in a digital product. Good typography improves readability, communicates hierarchy, and expresses your brand personality.
Key Typography Decisions
- Typeface selection: We typically select 1–2 typefaces per project — one for headings (can be more distinctive/branded) and one for body text (must be highly readable). More typefaces add complexity without benefit.
- Type scale: A harmonious sequence of sizes (e.g. 12, 14, 16, 20, 24, 32, 48px) that creates clear visual hierarchy when applied consistently.
- Line length: Optimal reading line length is 60–75 characters. Longer and the eye struggles to return to the next line. Shorter and the rhythm is disrupted.
- Line height: Body text should have a line height of 1.4–1.6× the font size for comfortable reading. Tighter line height for headings (1.1–1.3×).
Web Font Performance
Web fonts add page weight. We select performant options (typically Google Fonts or self-hosted fonts in modern formats like WOFF2), subset fonts to only include characters in use, and use font-display: swap to prevent invisible text while fonts load.
Accessibility
Minimum readable body text is 16px for most users. We design for a minimum of 16px and ensure text can scale up to 200% without layout breaking (WCAG 2.1 requirement).