Cerca de sete segundos é o tempo que muitos visitantes dão a uma página antes de decidirem ficar ou sair. Nessa janela, as regras de tipografia fazem mais trabalho do que o teu texto de vendas. A clareza visual ganha-te os segundos extra de que precisas para explicar a tua oferta.
As regras de tipografia incluem limites ao número de tipos de letra, uma hierarquia consistente e um espaçamento adequado. Este capítulo explica o que isso quer dizer em linguagem simples, porque afeta o teu website e o teu marketing, e como aplicar tudo sem te perderes em jargão. Vais ver também como a tipografia em web design se encaixa no mesmo quadro. Vamos por passos.
Ideias centrais por trás das regras de tipografia
As regras de tipografia incluem limites ao número de tipos de letra, uma hierarquia consistente e um espaçamento adequado.
As regras protegem a legibilidade quando várias pessoas atualizam o teu site.
A tipografia em web design acrescenta limitações para telemóvel e para o desempenho de carregamento.
Pôr em prática
Cria uma escala tipográfica de uma página e partilha-a com quem publica conteúdo.
Explora Google Fonts para websites e os erros de tipografia para ligares este tema ao resto do módulo.
Pequenas melhorias consistentes valem mais do que redesenhos completos ocasionais quando estás a aprender.
Lista prática que podes usar hoje
Cria uma escala tipográfica de uma página e partilha-a com quem publica conteúdo.
Quando reveres qualquer página, pergunta-te se as regras de tipografia estão visíveis logo no primeiro scroll no telemóvel. Se não estiverem, reordena as secções antes de polires os detalhes.
Guarda capturas de ecrã antes e depois das alterações, para perceberes o que fez a diferença nas regras de tipografia no teu site.
Partilha esta lista com quem atualiza o teu site, para que a tipografia em web design se mantenha consistente nas páginas novas.
Escolhe uma métrica para acompanhar este mês, como o tempo na página ou os formulários iniciados, para que as alterações de design se liguem a resultados de negócio e não só ao gosto.
Como este tema se liga ao resto da tua marca
As escolhas visuais raramente vivem numa só página. A tipografia em web design acrescenta limitações para telemóvel e para o desempenho de carregamento.
As tuas publicações nas redes sociais, os emails e os materiais impressos devem repetir a mesma hierarquia, as mesmas cores e as mesmas regras de tipografia que usas na web.
Quando os visuais da marca se desviam, os clientes sentem uma pequena discrepância, mesmo que não saibam explicá-la.
Usa o tipo de letra da marca para comparar notas com um capítulo relacionado deste módulo.
As regras protegem a legibilidade quando várias pessoas atualizam o teu site.
Perguntas que muita gente ignora
Termos secundários como tipografia em web design e combinação de tipos de letra ajudam-te a procurar exemplos mais profundos e a comparar o teu trabalho com os padrões habituais.
A tipografia em web design acrescenta limitações para telemóvel e para o desempenho de carregamento.
Escreve uma alteração de antes e depois que vais testar numa página ativa esta semana. Pequenas edições medidas valem mais do que planos vagos.
Ensinar à tua equipa um vocabulário comum sobre as regras de tipografia reduz as rondas de revisão com designers e agências.
Ferramentas que facilitam as atualizações visuais
Não precisas de código à medida para melhorar muitos problemas de layout e de estilo. Um editor visual permite-te ajustar espaçamentos, cores e tipografia enquanto vês a pré-visualização em telemóvel e em computador.
O WEMASY inclui um criador de websites com edição visual, para publicares alterações sem esperar por um programador a cada pequeno ajuste. Abre o criador de websites quando estiveres pronto para aplicar o que aprendeste.
Quando publicares atualizações, revê Google Fonts para websites e os erros de tipografia, para que o módulo continue ligado na tua cabeça.
Agora tens uma lente de trabalho para as regras de tipografia. Usa-a quando reveres o teu site, aprovares materiais de marketing ou deres um briefing a um designer. Continua com os erros de tipografia e o tipo de letra da marca para manteres o ritmo neste módulo.
Aprender as regras de tipografia é uma competência gradual. Volta a este capítulo depois de concluíres uma melhoria, para que as ideias passem da leitura ao hábito. Pequenas revisões repetidas valem mais do que decorar todas as regras de uma vez. Vai anotando o que funcionou com o teu público, para a próxima atualização ser mais rápida.
Perguntas frequentes
Quanto tempo leva a melhorar as regras de tipografia?
A maioria das pequenas empresas vê páginas mais claras ao fim de poucas sessões focadas, depois de aplicar o essencial deste capítulo. Começa pela página inicial e depois leva as mesmas regras às páginas de serviços e de contacto.
Precisas de um designer para trabalhar as regras de tipografia?
Um designer ajuda em rebrandings complexos, mas muitas correções ligadas às regras de tipografia podes fazê-las tu, quando souberes o que procurar. Usa Google Fonts para websites em paralelo com este capítulo para teres orientação relacionada.
O WEMASY pode ajudar-te a aplicar as regras de tipografia no teu website?
O WEMASY inclui um editor visual no criador de websites, para ajustares o layout, as cores e a tipografia sem código. Abre o criador de websites para atualizar modelos e pré-visualizar as alterações no telemóvel.
Qual é o erro mais comum com as regras de tipografia?
As pessoas tentam corrigir tudo de uma vez em vez de uma página de cada vez. Escolhe uma única prioridade, como a legibilidade ou o contraste, e depois consulta os erros de tipografia para a melhoria seguinte.
Como se ligam as regras de tipografia ao SEO?
Uma hierarquia visual clara e um texto legível mantêm os visitantes mais tempo na página, o que apoia os sinais de interação que os motores de pesquisa observam. Junta as correções de design a uma boa estrutura de conteúdo para teres os melhores resultados.
Onde deves aprender a seguir às regras de tipografia?
Continua com Google Fonts para websites e os erros de tipografia neste livro, para construíres um sistema visual completo para a tua marca online.