The sites that age badly have one thing in common: they look like the tools that made them. The icon pack from 2021. The illustration style that was everywhere in 2022. The gradient treatment that peaked in 2023.
The sites that hold up use typography as the primary design element. Type does not go out of date. It does not look like a plugin. It does not require a license renewal when the vendor pivots.
The most considered sites we know — the ones we return to as reference — are almost all type-led. Not because the designers could not do other things. Because they understood that type, done precisely, does not need help.
What type is actually doing
On most sites, type is treated as the thing that carries the words. The design is the other stuff: the colours, the imagery, the layout, the effects.
That is backwards. Type is doing most of the perceptual work. The size differential between a heading and body text creates hierarchy. The weight contrast creates emphasis. The tracking on a label creates register. The line height of body copy creates density — and density communicates pace. Fast or slow. Dense or spacious. Urgent or considered.
All of that happens before the user reads a word. Type sets the tone of the page the same way a face sets the tone of a room. The design choices in typography are expressive in ways that are felt before they are noticed.
The two-typeface rule
We use two typefaces. Syne 800 for headings and display. Inter for everything else. That is the full system.
The discipline of two is not an aesthetic choice — it is a legibility choice. Every additional typeface is a decision the eye has to make: what does this mean, why is this different, what is the relationship between this and the other things. Two typefaces with clearly differentiated roles make that decision automatic. The eye stops making it and the content gets the attention instead.
The other thing two typefaces forces is precision within the system. When you cannot reach for a third face to solve a hierarchy problem, you solve the hierarchy problem with size, weight, colour, and spacing. Those are better tools. They use the typeface you already have rather than introducing a new variable.
Where the sizing decisions live
Typographic scale is not a set of arbitrary sizes. It is a set of ratios that the eye reads as related. A heading at 56px and body at 17px have a ratio of roughly 3.3:1. That ratio communicates: these are categorically different things. A subheading at 24px sits between them and creates a middle tier.
The ratios matter more than the absolute sizes. A heading at 56px and a subheading at 52px are almost the same size. They read as parallel, not hierarchical. The four-pixel difference is invisible in the composition. The hierarchy it was supposed to establish does not exist.
When typographic hierarchy feels flat, the sizes are usually too close together. The fix is not to add more levels — it is to increase the contrast between the levels that already exist.
The tracking mistake
Tracking — letter spacing — is the most commonly misused typographic tool. The instinct is to add positive tracking to make text feel premium, or to add it to uppercase labels to improve legibility. That second instinct is correct. The first is not.
Positive tracking on large display type makes it feel loose. Letters at large sizes already have generous optical spacing. Adding more separates them further and reduces the visual cohesion of the word. Large display text almost always benefits from negative tracking — pulling the letters closer together, making the word feel more solid.
Positive tracking belongs on small uppercase text: labels, eyebrows, tags. At small sizes, tight letter spacing reduces legibility. The tracking opens the text up and makes it readable at a size where it would otherwise blur.
The line height that nobody talks about
Line height for body text is a readability decision. Too tight and lines run together; the eye loses its place. Too loose and the paragraphs feel disconnected; the reader loses the thread. The range 1.65–1.75 works for most body copy at 16–17px.
Line height for large headings is an aesthetic decision that most people get wrong by copying body copy values. A heading at 56px with a line height of 1.5 has 28px of leading between lines. That is almost half a heading's height of empty space. Large headings read more powerfully at 0.92–1.0 — the lines nearly touch. The density communicates weight.
The heading that feels flat is usually a heading with too much line height. Pull it down and watch the hierarchy sharpen.