Typography Does More Work Than Your Layout

Ask a room of designers what makes an interface feel professional and you will hear about spacing, grid, and hierarchy. All true. But the fastest visible improvement to almost any product screen is typographic, and it is usually three adjustments deep rather than a redesign.

Line length is the most ignored variable

Comfortable reading sits somewhere around sixty to seventy-five characters per line. Most application layouts stretch body text across the full width of a container because the container is the width of the screen, producing lines of a hundred and forty characters that readers physically struggle to track. Constraining text width is a single property change and it makes prose noticeably easier to read.

Use fewer sizes than you think

A scale with nine sizes guarantees inconsistency, because nobody can remember which one applies where and two adjacent sizes will be used interchangeably. Five or six steps covers almost every product: a display size, two heading sizes, body, small, and caption. Restricting the set forces hierarchy to come from weight, colour, and spacing, which are more flexible tools anyway.

Line height belongs to the size

A single line-height value applied globally makes large text too airy and small text too tight. Tie line height to size: display text wants roughly one point one, body text roughly one point six, and small text slightly more. This one rule fixes the common problem of headings that look disconnected from their own second line.

Weight carries hierarchy better than size

Jumping two sizes to signal importance costs a lot of vertical space and can break layout. Going from regular to semibold at the same size signals importance with no layout cost. Products with tight information density should lean heavily on weight and colour, reserving size changes for genuine structural levels.

• Set numerals to tabular figures anywhere numbers are compared in a column, so digits align.
• Give paragraphs a consistent bottom margin rather than relying on the browser default.
• Never centre more than two lines of text; the ragged left edge slows reading.
• Check your typeface at the smallest size you actually ship, not at the size in the specimen.

If a screen feels cluttered, try removing one font size before removing a feature. It is often the same result with less argument.

The ten-minute audit

Take your densest screen. Count the distinct font sizes in use, then the distinct weights, then measure your longest line of body text. Most teams find eight or nine sizes and lines well past a hundred characters. Cutting to six sizes and constraining text width takes an afternoon and will be the most visible improvement of the quarter.