A font budget is a design decision

Type is the single most visible decision on a website and one of the most expensive things it downloads. Those two facts get considered by different people, at different times, usually in that order, which is how a site ends up with four families, eleven weights and a header that arrives half a second after everything else.

The fix is not to give up on good typography. It is to decide the budget while you are still choosing the typeface, when the trade-off is a design conversation rather than a rescue operation.

What a font actually costs

Every distinct family, weight and style is a separate file unless you are using a variable font. Each one is a request that competes with your images and scripts, and until it lands the browser either shows nothing or shows a fallback that will visibly reflow. Neither is free, and both are worse on the mid-range phones most of your visitors are holding.

• Subset to the characters you actually serve. A full Latin Extended set is generous to languages your site does not offer.
• Prefer one variable font over five static weights. You gain the intermediate weights and lose most of the payload.
• Self-host rather than calling a third-party CDN. It removes a DNS lookup and a connection to somewhere you do not control.
• Set an explicit display strategy so text is readable while the font loads, and pick a fallback with similar metrics so the swap does not throw the layout around.

Two families is usually one too many

The pairing instinct runs deep, but a lot of sites would be better served by a single well-chosen family used with real range: a heavy, tightly tracked display size against a comfortable regular for body copy is often more distinctive than a display serif bolted onto a neutral sans, because the whole page then reads as one voice.

When a second family does earn its place, make it work hard. It should appear in headlines and nowhere else, or in pull quotes and nowhere else. A second family scattered across labels, buttons and captions is not a pairing, it is an inconsistency with a rationale attached.

Set the budget before you fall in love with the typeface. Afterwards, every conversation about performance sounds like an attack on the design.

Write the budget down

On my projects the type budget goes into the scope document alongside everything else: how many families, how many weights, what the total transferred size may be, and what the fallback stack is. It takes a paragraph. It prevents the conversation, six weeks later, where a beautifully art-directed page has to be argued out of its own typography because nobody agreed the constraints while there was still time to design within them.