Textos

Sobre tipografia e a web

·3 min read

Esta página foi traduzida com auxílio de IA. O original em inglês é a versão de referência.

A persistência do tipo

A tipografia é a decisão de design mais fundamental da web. Antes da cor, antes do layout, antes do movimento — existe o texto. E a maneira como esse texto é composto determina se alguém vai lê-lo.

Essa não é uma observação nova. Mas é uma que continua sendo soterrada por camadas de abstração. Design systems nos dão tokens. Frameworks utilitários nos dão classes. Ferramentas de IA nos dão layouts. E em algum lugar dessa pilha, o ofício de fato de compor texto — escolher corpos, pesos, medidas, entrelinha e hierarquia com intenção — fica reduzido a encaixar valores padrão.

Padrões não são ruins. Mas padrões sem entendimento produzem resultados medíocres.

O que o bom tipo na web exige

A boa tipografia na web exige atenção a um pequeno número de coisas, feitas com consistência:

  • Medida — o comprimento da linha importa mais do que a maioria dos desenvolvedores imagina. De 45 a 75 caracteres por linha não é uma sugestão; é a faixa em que a leitura se torna confortável. Ultrapasse-a e a compreensão cai.
  • Entrelinha — o line-height precisa responder à medida. Linhas mais longas precisam de mais espaço entre si. Linhas curtas podem ser mais compactas. Não existe um único valor correto.
  • Escala — uma escala tipográfica cria hierarquia visual sem gritar. A relação entre o texto de corpo, os subtítulos e os títulos deve parecer inevitável, não arbitrária.
  • Peso — o negrito não é ênfase. É uma das ferramentas de ênfase. Itálico, corpo, cor, espaçamento e posição também contribuem. Recorrer a font-bold como primeira resposta a problemas de hierarquia é um hábito que vale a pena abandonar.
  • Espaço em branco — o espaço ao redor do texto é tão importante quanto o próprio texto. Margens generosas, espaçamentos ponderados e respiro entre as seções sinalizam qualidade e convidam à leitura.

Tipografia como acessibilidade

Boa tipografia é tipografia acessível. Contraste suficiente, corpos legíveis, entrelinha adequada, comprimento de linha apropriado — não são preferências estéticas. São requisitos funcionais que determinam se as pessoas conseguem usar o que você construiu.

A sobreposição entre "fica bonito" e "funciona para todos" é maior do que a maioria das pessoas supõe. Quando você otimiza para legibilidade, quase sempre melhora o design visual ao mesmo tempo.

O ofício permanece

Frameworks mudam. Tendências de design vêm em ciclos. Mas os princípios do bom ofício tipográfico permanecem estáveis há séculos. Investir em entendê-los — não apenas aplicá-los, mas entender por que funcionam — é uma das coisas de maior alavancagem que um designer ou desenvolvedor web pode fazer.

A web é, em sua essência, um meio tipográfico. Tratá-la assim é ao mesmo tempo uma posição de design e uma marca de respeito pelas pessoas que leem o que você publica.