Files and Folders
Learn the concept, follow the practical steps, and apply what you learn through a simple activity.
Typography is the design of written language. It is not simply choosing a font. A designer uses typeface, size, weight, spacing, line length and hierarchy to make information readable and to give it an appropriate visual voice.
1. Typeface, font and family
A typeface is the broader design of a set of letters, while a font traditionally refers to a particular style or cut within that design. In everyday design software, people often use “font” for both. A type family can contain regular, medium, semibold, bold and italic styles.
For beginners, the important skill is not memorising terminology. It is learning to choose type that supports the purpose of the message.
2. Serif and sans-serif
| Category | Visual characteristic | Common use |
|---|---|---|
| Serif | Letters have small finishing strokes. | Editorial, literary, formal or traditional communication. |
| Sans-serif | Letters generally lack those finishing strokes. | Interfaces, modern branding, signage and many digital layouts. |
| Display | Designed for stronger visual personality, often at larger sizes. | Headlines, posters and short attention-grabbing text. |
These are tendencies, not rules. A typeface should be judged by readability, context and the personality you want to communicate.
3. Build hierarchy with type
Typography can tell the viewer what to read first. A useful hierarchy might contain a large headline, a medium-sized supporting line and smaller body copy. You can create this difference with size, weight, spacing and placement instead of using many unrelated fonts.
4. Font pairing
Two typefaces can work together when they have a clear relationship but enough difference to create hierarchy. A common beginner approach is to pair a distinctive heading face with a simple, highly readable body face.
Avoid pairing fonts that are almost identical but not quite. That small difference can look accidental rather than intentional. Also avoid using many typefaces simply because they are available.
5. Readability: size, line height and line length
Readable type needs enough space to breathe. Line height controls the vertical distance between lines. Very tight leading can make paragraphs feel dense; excessive leading can break the relationship between lines.
Line length also matters. Extremely wide paragraphs force the eyes to travel a long distance and make it easier to lose the next line. Shorter text blocks are especially useful on mobile screens.
6. Letter spacing and kerning
Tracking changes the overall spacing across a range of letters. Kerning adjusts the space between specific letter pairs. These controls become especially visible in large headlines, logos and all-caps text.
Do not use extra letter spacing as a universal fix. First choose an appropriate typeface and size; then make small spacing adjustments when the design actually needs them.
7. Weight and emphasis
Weight can create emphasis without changing the typeface. Regular body text paired with a semibold heading often creates a cleaner hierarchy than using bold, italic, underline, colour and a different font all at once.
8. Typography and accessibility
Good typography should remain understandable for people with different visual needs and devices. Maintain sufficient contrast between text and its background, avoid tiny body text, and do not communicate important information through colour alone.
Practical example: design a workshop announcement
Imagine a mobile poster that says “Graphic Design Workshop”. Make the title large enough to recognise quickly. Place the date and time immediately below it with a smaller but still strong treatment. Use a readable body style for the description. Give the registration action a distinct typographic treatment, but keep the overall type system limited and consistent.
Typography checklist
| Check | Question |
|---|---|
| Purpose | Does the type style match the audience and message? |
| Hierarchy | Can you identify the first, second and third reading levels? |
| Readability | Can the body copy be read comfortably at the intended size? |
| Spacing | Are line height and letter spacing helping rather than hurting clarity? |
| Consistency | Are headings, body text and emphasis styles used consistently? |
| Contrast | Does text remain clearly distinguishable from its background? |
Practical exercise
- Create a small event poster with a headline, date, description and call to action.
- Use one type family first and create hierarchy using size and weight.
- Make a second version using a carefully chosen second typeface for contrast.
- View both versions at phone size rather than zoomed in.
- Ask someone to read the poster for five seconds, then tell you what they noticed first.
- Adjust the typography based on the result instead of adding more decorative effects.
Common mistakes
- Using too many typefaces in one design.
- Choosing a decorative display face for long paragraphs.
- Making body text too small or low-contrast.
- Using bold, colour, underline and size changes all at once for emphasis.
- Ignoring line height and paragraph width.
- Judging typography only while zoomed in on a large screen.
Quick self-check
- What is the main job of typography in a design?
- How can size and weight create hierarchy?
- Why can line length and line height affect readability?
- What is the difference between tracking and kerning?
- Can you explain why you selected a particular typeface for your audience?
Key takeaway
Good typography makes information easier to understand while reinforcing the character of the design. Choose type for purpose, establish a clear hierarchy, protect readability, and make spacing decisions deliberately.