Document ID: /fineweb-2-swissfilter-quality_10-filterrobots/filtered/02541.jsonl.gz/15

Fontes e tamanhos de texto são recursos esquecidos em muitos sites. As configurações padrão em plataformas CMS como Wordpress e Wix são 14 pixels (px) e espaçamento simples. Alguns temas premium têm fontes personalizadas, embora quase sempre sejam muito pequenos. Mas, ao modificar o tamanho do texto, o espaçamento e a família de fontes do seu site, você pode aumentar o tempo do usuário no site, as visualizações de página e a legibilidade - o que tudo leva a taxas de rejeição mais baixas e classificações mais altas do mecanismo de pesquisa.
Abaixo estão cinco maneiras de melhorar a legibilidade e as classificações de seu site, atualizando a aparência de seu conteúdo.
1. Tamanho do texto
Embora não haja um tamanho de fonte mágico, o Google pode desvalorizar seu site se você usar tamanhos de fonte menores que 12 px. Cada vez mais, o Google valoriza a usabilidade e a experiência do usuário, e se você precisa aplicar zoom em um site para lê-lo, isso é tudo menos amigável.
Um tamanho de fonte de 12 px é aceitável e é um padrão comum para e-mail e software de documentos como o Word. As páginas da web, no entanto, se beneficiam de tamanhos de fonte maiores, como 18px ou até 20px.
Antes de você ou seu desenvolvedor começar a mexer com os tamanhos das fontes em seu site ativo, é importante ter certeza de que tem uma boa aparência. Não há maneira mais fácil de testar alterações de tamanho de fonte em seu site do que simplesmente pressionandoctrl e +em um PC com Windows oucomando e +em um Mac, para aumentar o zoom. Para diminuir o zoom,pressione ctrl e -oucomando e -.
Você descobrirá que o conteúdo do seu site pode parecer bom, e possivelmente melhor, a 110 por cento, ou mesmo 125 por cento. Nesse caso, peça ao desenvolvedor que altere o tamanho da fonte para 125 por cento do original. Se o original tiver 14 px, 125 por cento seriam 17,5 px, por exemplo, o que poderia ser arredondado para baixo ou para cima com pequenas alterações.
Exemplo de tamanho de texto:
A imagem a seguir ilustra o uso da função de zoom do navegador em uma página da Wikipedia sobre o Google.
2. Tamanhos de texto para dispositivos móveis
Como os dispositivos móveis oferecem muito menos espaço na tela, os tamanhos das fontes precisam ser compatíveis com dispositivos móveis. Para conteúdo regular em forma de parágrafo, minha recomendação de 18px a 20px para um site funcionará em qualquer dispositivo, de um computador desktop a um telefone celular. Mas, para cabeçalhos no site True Blue, ocasionalmente aumentamos - em alguns casos, de 40 a 50 pixels ou até mesmo maiores. Se você fizer isso, precisará reduzi-lo para dispositivos móveis ou sua legibilidade será prejudicada. O mesmo é válido para fontes pequenas. Talvez o formulário do seu site mostre um pequeno rótulo acima do campo com um tamanho de fonte de 12 px. Em um dispositivo móvel, pode ser muito pequeno para ler, especialmente para pessoas mais velhas.
Exemplo de um site otimizado para celular versus um site não otimizado para celular:
3. Texto / família de fontes
A legibilidade é obrigatória, mas isso não significa que você está restrito a usar famílias de fontes como Arial, Helvetica ou Times New Roman. Embora possa não ser a melhor ideia usar sua fonte favorita em seu site, como Comic Sans (caramba!), Existem toneladas de fontes lindas servidas na nuvem disponíveis gratuitamente.
Fontes como Robô ou Aberto sem tornaram-se muito populares. Usar uma fonte diferente como uma dessas ajuda seu site e sua marca a se destacar da concorrência. E, quando usada corretamente, uma fonte não típica pode melhorar a estética geral e a legibilidade do seu site. Aqui está um fato interessante: Roboto foi criado pelo Google para ser a fonte principal para dispositivos Android. Embora tenha recebido muitas críticas no primeiro lançamento, a fonte já foi usada por mais de 40 milhões de sites.
4. Cor e contraste do texto
Para ser legível, a cor das fontes deve ser clara e fornecer contraste suficiente. Muitos sites preferem manter o plano de fundo branco e a fonte preta. Mas isso não é o ideal.
Muitas pessoas têm uma condição chamada Síndrome de Irlen , o que causa dificuldades no processamento de informações visuais, incluindo sensibilidade ao contraste. Quando você tem sensibilidade ao contraste, o texto preto em um fundo branco se parece com isto:
Esse texto vermelho em um fundo azul não é muito legível, não é? É importante encontrar um meio-termo. Em um fundo branco, uma aposta segura para a cor da fonte é um tom de cinza escuro, como # 30303a. Este hexcode é a cor específica da fonte que usamos em nosso site, True Blue Life Insurance.
5. Espaçamento do texto
Aplique espaçamento adequado em todos os elementos em todo o seu site usando margens e preenchimentos. Essas são as lacunas de espaço em branco abaixo de um cabeçalho, por exemplo, ou o espaço em branco acima e abaixo dos itens de menu em um cabeçalho.
Junto com o espaçamento entre os elementos, a altura da linha, uma propriedade CSS que determina a quantidade de espaço em branco entre cada linha de texto em um parágrafo, é igualmente importante.
Exemplo de altura de linha:
Tal como acontece com o tamanho do texto, não existe um número mágico para a altura da linha, mas acho que um valor de 1,5em ou 150 por cento é o ideal. Dê uma olhada no gráfico a seguir que ilustra o impacto da altura da linha na legibilidade.
Tipo de bônus:
O melhor conteúdo é o conteúdo que você pode ler. Nem todo mundo tem uma visão perfeita. Vamos tornar mais fácil para nossos clientes ler nosso conteúdo sem ter que apertar os olhos. Reserve um tempo para testar a família de fontes, o tamanho e o espaçamento do seu site. Ao implementar essas recomendações, as estatísticas do usuário do seu site e as classificações do mecanismo de pesquisa irão disparar.