As fontes afetam nossas emoções de duas maneiras.
Viés cognitivo
Em primeiro lugar, associamos certas conotações a fontes e estilos de fonte específicos. Isso, como muitas outras coisas em nosso mundo, é frequentemente influenciado por nossos vieses cognitivos e pela cultura em que crescemos. Por exemplo, fontes sem serifa são comumente usadas em fontes oficiais dos EUA.
formas de governo. Mas, na Inglaterra, as fontes sem serifa são mais comumente usadas pelos tablóides. O contexto em que as diferentes fontes são usadas muda a forma como nos sentimos quando as vemos.
Dê uma olhada nas duas capturas de tela abaixo do blog da minha empresa, apresentando um guia sobre como construir um site WordPress, definido usando duas fontes muito diferentes. Observe como o mesmo conteúdo pode transmitir uma mensagem muito diferente, dependendo da fonte que você usa para apresentá-lo.
Versão 1: As fontes normais do site
Versão 2: Fonte Comic Sans
A segunda versão parece muito menos confiável e profissional.
Isso não se deve à curvatura e espaçamento das letras ou qualquer outra característica tipográfica da fonte. Isso se deve ao fato de termos aprendido a associar comic sans com infantilidade.
Legibilidade objetiva
Além de tudo isso, algumas fontes são inerentemente mais fáceis de ler do que outras.
E quanto mais nossos olhos e cérebros têm que trabalhar para interpretar um pedaço de texto, pior relatamos o sentimento depois. As fontes com serifa foram originalmente usadas pela imprensa, pois as serifas são comprovadas para ajudar o olho a passar de uma letra para outra mais rapidamente. Quando os computadores foram usados pela primeira vez, as telas de computador tinham baixa resolução.
As fontes serif tinham que ser criadas usando vetores, que simplesmente não pareciam certos com a baixa densidade de pixels disponível antigamente. Assim, os primeiros designers usaram como padrão fontes sem serifa, que foram criadas como bitmaps. As resoluções de tela evoluíram nas últimas décadas.
Estamos em um ponto em que os pixels são quase irreconhecíveis de perto. Como tal, as fontes serif como Georgia estão se tornando cada vez mais populares.
Experimentando com fontes
Ao experimentar fontes, a primeira pergunta que eu queria responder era, claro, qual fonte é a melhor para o nosso site?
Fiz um teste A/B inicial em um de nossos artigos onde testei três fontes diferentes: Georgia, Arial e Verdana. Medimos o desempenho de cada fonte pelo número de cliques no artigo, em combinação com métricas comportamentais como taxa de rejeição e tempo na página. Aqui estão trechos de blocos de texto das fontes que testamos para que você possa ter uma ideia visual sobre as variantes que testamos.
Verdana Previ que a Geórgia venceria (por causa da legibilidade objetiva) e Verdana perderia. Enquanto eu estava certo em adivinhar que Georgia seria a vencedora, eu estava errado sobre Verdana. De fato, a variação usando Verdana gerou 29,1% mais cliques do que nossa fonte original (Arial).
Também notamos que a variação usando a Geórgia teve um tempo médio na página muito melhor, indicando que nossos usuários estavam lendo mais do artigo. Isso também foi confirmado usando mapas de calor.
Experimentando o tamanho da fonte
Depois de confirmar que Georgia era a fonte com melhor desempenho para nosso site, eu queria saber qual o tamanho da fonte para fornecer a melhor legibilidade e engajamento possível. Razoavelmente, eu esperava que quanto maior a fonte, mais legível seria.
Errado de novo. Primeiro testei 14px vs. 15px vs. 16px. Usando os mesmos métodos descritos acima, descobriu-se que 14px gerou o maior nível de engajamento.
Observação: também aumentei a altura da linha em um pixel para cada aumento de pixel no tamanho da fonte.
Isso foi surpreendente, pois eu já havia lido estudos como este sobre como fontes maiores podem aumentar a quantidade de atenção que um leitor dá ao texto que está lendo. E, curiosamente, muitos sites considerados altamente legíveis estão usando fontes com mais de 20px de tamanho. Para verificar novamente a precisão dos meus resultados, executei um experimento idêntico testando 10px, 14px, 18px e 21px.
Mais uma vez, 14px venceu. Para mim, isso apenas sugere o que todo testador A/B experiente lhe dirá: o que funciona para uma pessoa pode não funcionar para outra. Para o design do nosso blog e a fonte que estamos usando, e talvez até para o conteúdo que publicamos, 14px parece ser o ponto ideal.
