Guia para o emparelhamento de fontes: escolhendo as melhores combinações de fontes para o seu site

Publicados: 2020-11-02

Como um web designer, você tem que tomar muitas decisões importantes para cada site que construir. Paletas de cores, interações da interface do usuário, layout de navegação, escolha da melhor fonte para o seu site e muito, muito mais.

Uma área do design da Web na qual você pode não estar gastando tempo suficiente pensando é o par de fontes.

Escolher uma fonte atraente é uma coisa. Depois de ter uma boa noção da voz e do estilo da marca, será muito mais fácil identificar fontes que transmitam uma vibração semelhante.

Índice

  • Por que você precisa do emparelhamento de fontes?
  • O que considerar ao emparelhar fontes
  • 4 regras para emparelhar fontes em web design
  • Regra nº 1: não use mais do que três fontes em seu site
  • Regra # 2: Concordância e contraste são bons; Conflito é ruim
  • Regra nº 3: não tenha medo de emparelhar em superfícies de fontes
  • Regra nº 4: Certifique-se de que suas fontes tenham o tamanho e o formato adequados
  • As 30 melhores combinações de fontes para web design

Por que você precisa do emparelhamento de fontes?

Os sites precisam de mais de uma fonte - para estabelecer hierarquia, manter os visitantes engajados com muito texto e para informar subliminarmente aos visitantes mais sobre a personalidade e abordagem da marca.

Quando você adiciona essa camada extra de complexidade à mistura, as coisas podem ficar complicadas. Você não está apenas emparelhando fontes; você também está combinando-os com o seu design da web.

Tenho certeza de que você encontrou cenários como estes em suas viagens pela web:

  • Duas fontes enfadonhas tornam um post longo de blog muito difícil de ler e você acaba folheando os cabeçalhos para ver se consegue juntar a história dessa maneira.
  • Uma fonte cursiva divertida e exclusiva apresenta os visitantes ao negócio, apenas para uma fonte de corpo muito pequena e super simples para contradizer a primeira impressão.
  • O site afirma que a empresa tem uma abordagem jovem e inovadora para os negócios, razão pela qual as fontes retrô parecem tão fora do lugar.

Há muitas coisas que podem dar errado no emparelhamento de fontes se você não dedicar um tempo para entender como as fontes se encaixam.

Aprenda como adicionar fontes personalizadas ao WordPress

O que considerar ao emparelhar fontes

Em nosso guia para as melhores fontes para sites, resumimos as principais características a serem procuradas:

1. Legibilidade

Uma das razões pelas quais as serifas são fortemente preferidas na literatura e nos jornais é a legibilidade. As serifas (pés) na parte superior e inferior dos caracteres tornam mais fácil para os leitores distinguir entre caracteres de aparência semelhante, como o "I" maiúsculo e o "l" minúsculo, portanto, não há lentidão devido a problemas de compreensão.

Se você estiver criando uma página com mais de 600 palavras, não seria uma má ideia usar uma serifa no corpo do texto por esse motivo.

Dito isso, se você encontrar uma sans serif com formas de letras distintas (mesmo sem as serifas), não tenha medo de experimentar. Temos alguns exemplos de como usar sans serifs em posicionamentos de corpo e cabeçalho abaixo.

2. Legibilidade

Uma das razões pelas quais as serifas sem serifa foram por muito tempo consideradas uma escolha melhor do que as serifas para texto online foi por causa de sua alta legibilidade. No entanto, estudos mostraram que há pouca diferença na rapidez ou facilidade com que as pessoas podem ler textos com serifa vs. sem serifa - pelo menos em tamanhos menores.

Como as resoluções de tela melhoraram enormemente ao longo dos anos, os tipógrafos foram capazes de criar faces de fontes em ambos os estilos que são igualmente legíveis. Como o NNG explica:

“A antiga diretriz de usabilidade para tipografia online era simples: mantenha-se em fontes sem serifa. Como as telas de computador eram muito ruins para renderizar serifas corretamente, tentar o tipo serif em tamanhos de corpo de texto resultava em formas de letras borradas. ”

Enquanto outros tipos de fonte - como os excessivamente decorativos - podem ser muito difíceis de ler fora do texto de cabeçalho grande, os designers têm muitas opções em termos de como eles estilizam o texto em uma página com serifas e sem serifas.

O que você deve estar mais ciente, então, é o tamanho e o espaçamento de seus caracteres, pois isso afeta a legibilidade e a legibilidade.

3. Conforto

Existem alguns web designers que relutam em usar fontes como Helvetica ou Times New Roman por causa do uso excessivo. No entanto, a seleção e o emparelhamento de fontes não têm a ver com o que você acha da tipografia do seu site, mas com o quanto os visitantes se sentem confortáveis ​​ao lê-lo.

Portanto, não há vergonha em escolher os clássicos se eles fizerem o trabalho.

4. Estilo

Selecione os tipos de fonte e fontes com estilos que se alinham bem com a sua marca. Por exemplo, as fontes serif parecem mais tradicionais e sérias, em oposição às fontes cursivas, que tendem a ser mais peculiares e divertidas.

Você pode dizer muito aos visitantes sobre sua marca apenas escolhendo os tipos certos de fontes para começar.

Não perca de vista essas regras à medida que avança para a próxima etapa do design com tipografia: