Proof

A specimen is for looking at. This one sets the measure, the scale, the mathematics and the notes in the margin at the sizes they actually occur, so all of it can be settled by eye.

The measure#

A column has a width, and the width is not a matter of taste. Too narrow and the eye never builds any momentum. Too wide and it loses the start of the next line on the way back, which feels like your own fault and is not. Bringhurst puts the comfortable range for a single-column serif setting at about sixty-six characters including spaces, and treats anything wider as needing extra leading to stay navigable (Bringhurst 2012).

Sixty-six here. It also leaves room for the margin column.

The scale#

Sizes come from a modular scale in ratio 1.2. The labels are roles.

The face is Source Serif 4, drawn by Frank Grießhammer for Adobe and released under an open licence (Grießhammer 2021). It carries an optical size axis: at the top the strokes thin and the spacing closes up, at the bottom the counters open and the letters stand further apart. Metal type did the same, cutting each size.

Where the lines break#

Browsers break a paragraph one line at a time. Each line takes as many words as fit, the break is set, and it is never revisited. A comfortable break early can force a bad one six lines down. In justified text this is visible as the pale channels that open through the column.

Knuth and Plass published the alternative in 1981 (Knuth and Plass 1981). Score every line by how far it has to stretch or squeeze, add penalties for hyphenation and for neighbouring lines that are noticeably unlike each other, and take the set of breaks with the lowest total. The paragraph is solved once, whole. It stays cheap because the best route to any breakpoint follows from the best routes to the ones before it. The production details are in Knuth’s TeX documentation (Knuth 1984).

A greedy line breaker saves a word early and pays for it four lines down.

This page runs that algorithm in the browser through Justif, Lyall Cooper’s implementation, which upgrades already-rendered HTML in place and declines any paragraph it cannot measure (Cooper 2026). With JavaScript off you get the browser’s own justification: worse, and intact.

Two smaller things ride along with it. Punctuation at the edge of a line hangs slightly outside the block, so the edge reads as straight rather than dented by every quotation mark. Word spacing moves in increments too small to see one at a time. Both belong to the micro-typography Zapf argued for in the hz-program (Zapf 1993) and Schlicht’s microtype package made routine in TeX documents (Schlicht 2025). Hochuli’s short book is the best account of why adjustments at this scale are worth making (Hochuli 2008).

Below about forty characters none of it works. No algorithm justifies a column that narrow without opening channels through it, so on a phone this page sets ragged right.

The margin#

Notes sit in the right margin, beside the sentence that caused them.44 Here. On a narrow screen there is no margin to sit in, so the marker becomes a control and the note unfolds in the text. Footnotes and endnotes ask you to carry a question somewhere else and bring it back. Tufte’s books keep the note beside the thing it annotates (Tufte 2006).

There is a second register:

Quotation#

Two registers here as well. A blockquote is evidence: someone else’s words, set apart and attributed.

Typography exists to honour content. Robert Bringhurst, The Elements of Typographic Style

A pull quote is the page’s own words, louder: the line above about greedy line breakers.

Tables#

Tables get what a statistics journal would give them: a heavier rule above and below, a lighter one under the header, nothing else. A vertical rule usually means the columns are too close together.

Numerals in a table are tabular lining figures, so the columns stack. In running text they are old-style — 1,847 and 1981 and 66 — sitting inside the line rather than standing above it.

Mathematics#

Equations are MathML, laid out by the browser directly (Wang and Verdier 2025), so they select, they search, they read aloud, and they scale. The face is New Computer Modern Math, Tsolomitis’s Unicode extension of Knuth’s Computer Modern (Tsolomitis 2025).

Inline mathematics such as ρ(x)=e^(−x^2/2σ^2)$𝜌\left(𝑥\right)={𝑒}^{-{𝑥}^2/2{𝜎}^2}$ sits in the line without disturbing the leading.

Stretchy delimiters and large operators are the real test, since those glyphs are assembled from parts rather than drawn once:

Everything numbered can be referred to, and every reference carries a preview. Hover Equation 7, or Table 1, or Equation 9: the target comes to you.

Code#

def adjustment_ratio(target: float, natural: float, stretch: float) -> float:
    """How far this line must stretch to fill the measure. Zero is perfect."""
    if natural == target:
        return 0.0
    if natural < target:
        return (target - natural) / stretch if stretch > 0 else INFEASIBLE
    return (target - natural) / shrink if shrink > 0 else INFEASIBLE

Inline code such as font-optical-sizing: auto is set slightly smaller than the text around it. Monospace faces run large in the x-height.

Figures#

Figure 2 scrolls inside its own box if it cannot fit, so the page body never scrolls sideways.

The apparatus#

The pipeline is Typst, whose 0.15 release added MathML output and a bundle target that emits a multi-file site from a single project (“Typst 0.15 Contains Multitudes” 2026). Typst treats the bundle as one document for introspection, so a reference in one essay to an equation in another resolves on its own.