A type system without underlying structure falls apart the moment you add a new element or change screen sizes. Grids and modular scales give you a mathematical foundation that handles variation without constant manual adjustment.
This course covers ratio-based type scales (not arbitrary size jumps), baseline grid implementation that actually works in responsive designs, and vertical rhythm that survives real content. You'll learn the theory behind classic systems like the golden ratio and perfect fourth, then apply them to modern multi-device scenarios.
We address the conflicts between mathematical perfection and browser rendering, between baseline grids and varying line-heights for different text elements. You'll set up systems in CSS using relative units, then test them against content that doesn't cooperate—long German compound words, user-generated text, dynamic data.
The course includes optical adjustments that break the grid deliberately, because strict mathematical systems often look wrong. You'll learn when consistency matters and when your eye should override the numbers.