Vertical rhythm in web typography

…doesn’t have anything to do with jumping up and down to music. Sadly.

Typographic principles are just as valid in designing for the web as they are in designing for traditional media. Through the application of a very simple mathematical principle, a design becomes more peaceful and the visitor is calmed by a subliminally identifiable pattern. (Our brains, like computers, like the structure and order of a regular pattern, even if we don’t notice it.)

One of the core typographic principles is vertical rhythm – repetition along a vertical axis using multiples of the base line-height. A body text size of 16px and a line height of 24px; an H1 header with a text size of 32px and a line height of 48px (2x); an H2 header with a text size of 24px and a line height of 36px (1.5x).

A comprehensive explanation, with examples, is in this article.