Toda conversa sobre estratégia de carregamento de fontes — preload, subsetting, ajuste de font-display — está a jusante de uma decisão que a maioria das equipes nunca toma conscientemente: carregar fontes ou não. Para uma grande classe de aplicações de alto desempenho, a seleção tipográfica correta é a que já está instalada na máquina do usuário. Zero kilobytes, zero requisições, zero deslocamento de layout, legível já na primeira renderização.
O que "pilha do sistema" significa agora
O velho atalho preguiçoso de Arial, sans-serif não é o que estou descrevendo. Uma pilha moderna do sistema é uma composição deliberada:
font-family: ui-sans-serif, system-ui, -apple-system,
"Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
Essa única declaração compra San Francisco nos dispositivos Apple, Segoe UI no Windows, Roboto no Android — três tipos que os fornecedores de plataforma gastaram, coletivamente, centenas de milhões de dólares aperfeiçoando para as próprias telas, com hinting e renderização feitos pelos motores que os conhecem melhor. Seus usuários os leem o dia inteiro; a familiaridade é, em si, um recurso de legibilidade, um ponto que o capítulo do Universal Web sobre seleção de tipos desenvolve longamente.
As pilhas de serifa e mono merecem o mesmo cuidado: ui-serif/Georgia/Charter para superfícies de leitura, ui-monospace/SF Mono/Consolas/"Cascadia Code" para código e dados. A própria fonte display deste site segue exatamente essa lógica — uma fonte comercial para quem a tem, uma cadeia de fallback afinada para todos os demais.
Quando zero é o número certo
A decisão é sobre o que a interface é. Pilhas do sistema vencem quando o produto é uma ferramenta: dashboards, painéis administrativos, interfaces de negociação e monitoramento, produtos para desenvolvedores, qualquer coisa usada de hora em hora, em que o trabalho da tipografia é desaparecer. Nessas aplicações a fonte é pura infraestrutura — ninguém admira o tipo da coisa que o aciona às três da manhã — e o orçamento de desempenho é melhor gasto em dados.
A fonte da marca merece seus bytes quando o produto é um lugar: superfícies de marketing, leitura editorial, qualquer lugar em que a tipografia carrega identidade. Este portfólio serve webfonts, deliberadamente; sua tipografia é o conteúdo. Esse é o teste — se você apagasse a fonte personalizada, o produto significaria menos, ou só carregaria mais rápido?
Engenharia do fallback como se fosse a fonte
O ofício de uma pilha de zero kilobyte é disciplina métrica. Diferentes fontes de plataforma têm diferentes alturas de x e larguras, de modo que um layout afinado apenas no macOS respirará diferente no Windows. Três ferramentas fecham essa lacuna:
font-size-adjustnormaliza as alturas de x dos fallbacks para que cada fonte da cadeia seja lida no mesmo corpo efetivo.text-wrap: balanceeprettyabsorvem as diferenças de quebra de linha entre fontes metricamente incompatíveis.- Testar na pilha real — a disciplina que ninguém pratica. Capture a interface em Segoe, SF e Roboto; onde o design só funciona em uma delas, o design está errado.