Typography
Working with type in design
What is Typography?
Typography is the way type is handled in design. It covers the choice of fonts, their size, weight, line height, text column width, and letter spacing. It defines how headings, paragraphs, buttons, and captions differ from each other. On the web, typography is defined in CSS and must work on large monitors as well as mobile phones. Good typography is part of a brand's visual identity.
Why It Matters
Most website content is text, so typography directly affects whether people read it to the end. Readable type and a clear heading hierarchy help visitors find important information quickly. Consistent fonts look professional and strengthen brand recognition. Too many fonts or small text reduce trust and accessibility. The choice of web fonts also affects page loading speed.
Real-World Examples
- 1Pairing one font for headings with another for body text.
- 2Larger type and line height for better readability on mobile.
- 3Consistent H1, H2, and H3 sizes across the whole website.
- 4Limiting text width to roughly 60–80 characters per line.
- 5Serving fonts from the website's own server instead of an external service.