Web typography

Objectives

  • Master: type scale
  • Master: line-height
  • Master: font-loading

Lesson

This lesson is part of the year-long Code Academy Alfred path. Goal: understand type scale, line-height, font-loading in real web / mobile-web design conditions.

A type scale (1.125 or 1.25) creates hierarchy without chaos. line-height 1.5–1.7 for body text.

Limit measure width (~45–75 characters) for long reading.

next/font (used here) avoids poorly handled FOUT/FOIT and stabilizes layout.

Practice immediately: rebuild the example, then change it. Memory comes from active repetition, not passive reading.

If you get stuck, use Cursor with a precise prompt (context + goal + constraints), then explain the generated diff yourself.

Assessment

Assessment

1. What is the main topic of “Web typography”?