Web Typography

Web typography is the control of how text looks on web pages: the choice of typeface, size, weight, line spacing, and the spacing between letters and words. For much of the web’s early history this control was sharply limited, because a browser could only render fonts already installed on the reader’s own computer. Designers fell back on a small set of “web-safe” fonts — Arial, Times New Roman, Georgia, Verdana — that they could reasonably assume everyone had.

The breakthrough was the ability to download a font along with the page. The mechanism is the CSS @font-face rule. As the W3C’s CSS Fonts Module Level 3 specification puts it, “the @font-face rule allows for linking to fonts that are automatically fetched and activated when needed.” An author declares a font family, points it at a font file by URL, and the browser fetches that file and uses it to render the text. With @font-face, a page can use almost any typeface, regardless of what the reader has installed.

Delivering fonts over the network created a need for a compact, web-tailored format, which led to WOFF, the Web Open Font Format. The W3C WOFF specification describes it as “a simple compressed file format for fonts, designed primarily for use on the Web.” WOFF is not a new outline format but a container that wraps an existing TrueType, OpenType, or Open Font Format file with compression and optional metadata. A later revision, WOFF2, uses stronger compression for smaller downloads, and the two formats are now the standard way fonts reach browsers.

Beyond loading fonts, CSS gives the web fine-grained typographic control. Properties manage size, line height, weight, and style, while features exposed from the underlying OpenType fonts — ligatures, alternate figures, and the kerning encoded in the font — can be switched on through CSS. The unicode-range descriptor even lets a page split a typeface into subsets so the browser downloads only the character ranges a page actually uses.

Together, @font-face and the WOFF formats ended the web-safe-fonts era and made the web a full medium for typography. A reader visiting a site today usually sees the exact typefaces its designer chose, rendered with kerning, ligatures, and spacing that once belonged only to print.

Sources

Last verified June 8, 2026