No momento em que estamos escrevendo este artigo, existem 884 diferentes famílias de fontes do Google disponíveis gratuitamente. São muitas escolhas! É por isso que você pode estar procurando alguém para ajudá-lo a encontrar essa agulha em um palheiro com uma lista das melhores fontes do Google.

Nós o temos para você, e então também vamos compartilhar algumas das melhores práticas para usar o Google Fonts no WordPress.

Escolher uma fonte é mais do que apenas uma escolha estética – pode ter um efeito real nas taxas de rejeição e conversão do seu site, especialmente se você escolher uma fonte que é difícil de ler para os seus visitantes.

Basicamente, vale a pena dedicar algum tempo para escolher a melhor família de fontes do Google para o seu site, em vez de desperdiçar a primeira fonte que você vê!

As 15 Melhores Fontes do Google em 2019 – De acordo com a Sabedoria das Multidões

Então, como você cria uma lista das melhores fontes do Google quando tanto disso é subjetivo? Não queremos que toda essa lista seja subjetiva, então vamos aos dados para criar uma lista das melhores fontes do Google.

Basicamente, usaremos a análise do Google Fonts para confiar na sabedoria das multidões. Com mais de 23 trilhões de visualizações totais de fontes, o Google tem apenas um pouco de dados para extrair. 😉

Então, iremos um pouco além dos números de popularidade brutos e escolheremos algumas fontes emergentes que estão crescendo rapidamente. Pronto? Vamos mergulhar…

1. Roboto

Fonte Roboto Google

Fonte Roboto Google

Roboto é uma oferta sans-serif de Christian Robertson que foi desenvolvida pela Google como fonte do sistema para Android. Agora é muito popular, vem em 12 estilos diferentes e faz múltiplas aparições nas análises do Google Fonts. Por exemplo, Roboto é a fonte mais popular. Mas Roboto Condensed é também a sexta fonte mais popular, e Roboto Slab também aparece no número 13!

2. Open Sans

Open Sans Fonte Google

Open Sans Fonte Google

Open Sans é uma fonte sans-serif desenvolvida por Steve Matteson. O Google usa Open Sans em alguns de seus sites, bem como em seus anúncios impressos e na web.

3. Lato

Fonte Lato Google

Fonte Lato Google

Lato é outra oferta popular de sans-serif, desta vez de Łukasz Dziedzic.

4. Slabo 27px/13px

Fonte Slabo Google

Fonte Slabo Google

Slabo é uma fonte serifa desenvolvida por John Hudson da Tiro Typeworks. O que é único sobre esta fonte é que ela é projetada especificamente para ser usada em um determinado tamanho – 27px ou 13px dependendo de suas necessidades.

5. Oswald

Fonte Oswald Google

Fonte Oswald Google

Oswald é uma fonte sans-serif originalmente desenvolvida por Vernon Adams.

6. Source Sans Pro

Fonte Sans Pro Fonte Google

Fonte Sans Pro Fonte Google

Source Sans Pro é uma fonte sans-serif de Paul Hunt que foi criada para a Adobe e foi a primeira fonte de código aberto da Adobe.

7. Montserrat

Fonte Montserrat Google

Fonte Montserrat Google

Montserrat é uma fonte sans-serif de Julieta Ulanovsky, que vive no bairro homônimo de Montserrat, em Buenos Aires. Com 18 estilos diferentes, você tem um monte de escolha.

8. Raleway

Raleway fonte do Google

Raleway fonte do Google

Com 18 estilos diferentes, Raleway é outra fonte sans-serif da família grande, inicialmente criada por Matt McInerney. Se gosta de Raleway e está à procura de algo único, Raleway Dots oferece um estilo semelhante com uma abordagem pontilhada que pode funcionar para grandes manchetes.

9. PT Sans

PT sem fonte Google

PT sem fonte Google

A PT Sans foi desenvolvida para os Tipos Públicos da Federação Russa e, como tal, inclui caracteres latinos e cirílicos. Existem também várias outras fontes na família PT, incluindo algumas opções de serifas.

10. Lora

Lora Fonte Google

Lora Fonte Google

Lora é uma fonte serifa popular que é projetada para funcionar bem tanto na tela quanto na impressão.

Fontes de Bônus + Up-And-Comers

Pelos números, as dez fontes acima são as fontes mais populares do Google. Mas só mostrar as opções mais populares faz um desserviço para as grandes fontes emergentes que ainda não tiveram exposição para aparecer na análise.

Aqui estão alguns dos nossos favoritos que não apareceram no topo da análise.

11. Noto Sans / Serif

  • Sans-serif or serif
  • Estilos: 4 cada
  • Ver Fonte
Noto Sans Fonte Google

Noto Sans Fonte Google

Noto é uma fonte encomendada pelo Google que vem nas versões serifa e sans-serif. Ele está recebendo atualizações regulares, e agora há mais de 100 fontes Noto, com mais fontes vindo o tempo todo!

12. Nunito Sans

Nunito Sans Fonte Google

Nunito Sans Fonte Google

Nunito Sans é uma opção sans-serif que está crescendo rapidamente em popularidade (seu uso triplicou desde o ano passado).

13. Concert One

Fonte do Google do Concert One

Fonte do Google do Concert One

Concert One é um tipo de letra grotesco arredondado que faz uma opção estelar para manchetes.

14. Prompt

Solicitar fonte do Google

Solicitar fonte do Google

Prompt é uma oferta sans-serif da empresa tailandesa de design de comunicação, Cadson Demak.

15. Work Sans

Trabalhar sem fonte Google

Trabalhar sem fonte Google

Work Sans é uma fonte sans-serif que é otimizada para uso em telas. Os designers recomendam usar os estilos de peso médio para qualquer coisa a partir de 14px-48px.

Como criar as Melhores Combinações de Fontes do Google

Se você pensou que tentar escolher uma fonte do Google Fonts era difícil, espere até que você tente emparelhá-la no seu site! Felizmente, este não é um problema que tenhas de resolver sozinho, a não ser que queiras. Existem algumas maneiras de criar as melhores combinações de fontes do Google.

Primeiro, o próprio site do Google Fonts irá sugerir emparelhamentos populares se você rolar para baixo na página:

Onde encontrar pares de fontes do Google

Onde encontrar pares de fontes do Google

Além disso, você também pode usar um site como Font Pair para obter mais sugestões.

Melhores Práticas para Usar o Google Fonts no WordPress

Depois de encontrar as fontes perfeitas do Google Fonts, aqui estão algumas das melhores práticas para usar o Google Fonts no WordPress.

Limite o Número de Pesos de Fonte que Você Usa

Algumas destas fontes – como Montserrat e Raleway – vêm com 18 tipos de letra diferentes. Embora isso seja bom para lhe dar escolha, você não quer carregar todos os 18 pesos no seu site WordPress porque isso irá diminuir o tempo de carga. Isto é muito importante!

Para a maioria das fontes, uma boa regra geral é usar 3 pesos no máximo:

  • Regular
  • Itálico
  • Negrito

Um monte de sites de WordPress que vemos hoje em dia estão mesmo saltando Itálico e indo apenas com 2 pesos de fonte diferentes. Se você mesmo estiver incorporando o Google Fonts, poderá escolher exatamente as ponderações a serem incluídas na guia Personalizar no Google Fonts:

Como escolher estilos de fontes do Google

Como escolher estilos de fontes do Google

A maioria dos temas do WordPress hoje em dia incluem maneiras fáceis de escolher quais fontes e pesos do Google você deseja usar. Mas, nem todos os desenvolvedores de temas estão focados em desempenho. Portanto, em alguns casos, pode ser melhor desativar o Google Fonts no seu tema e adicioná-los você mesmo.

Fontes variáveis também começam a se tornar populares, e são suportadas por todos os navegadores modernos. Estes são impressionantes porque permitem que um arquivo de fonte simplesmente se transforme com propriedades diferentes. No entanto, ainda não há muitas fontes livres para escolher. No entanto, o Google tem algumas fontes variáveis no Early Access.

Considere Hosting Google Fonts Localmente

As an alternative to serving up fonts from Google’s server, you can also host fonts locally, which might offer performance benefits. Although remember that most Google fonts are probably already cached in people’s browsers. So we recommend doing your own performance tests.

If you’re using a premium font other than Google fonts, like the “Brandon” font we use on our Kinsta site, then by all means hosting them locally (and serving them from your CDN) is the best route.  For more on this topic, check out our posts on how to host fonts locally.

Escolha uma Fonte que Receberá Atualizações

As fontes são como plugins e temas do WordPress – ao longo do tempo, elas recebem atualizações e melhorias para torná-las ainda melhores. E enquanto as apostas não são tão ruins como com os plugins do WordPress, ainda pode ser benéfico escolher uma fonte que receba atualizações regulares. A família Noto do Google é aquela que tem recebido atualizações regulares desde 2014.

Porque a maioria das fontes nesta lista são populares, é provavelmente uma boa aposta que qualquer fonte nesta lista receberá atualizações e melhorias regulares. E se você decidir sair da lista, certificando-se de que qualquer fonte que você escolher é popular o suficiente para chamar a atenção nunca é uma má idéia.

Não se Esqueça da Acessibilidade

De acordo com a Organização Mundial da Saúde, em 2017, estima-se que 253 milhões de pessoas vivam com deficiência visual: 36 milhões são cegos e 217 milhões têm deficiência visual moderada a grave.

Quando você está usando o Google Fonts, você pode controlar a aparência com CSS, como cor e tamanho. Portanto, não se esqueça de seguir as Web Content Accessibility Guidelines (WCAG) 2.0. Isso garantirá que o seu conteúdo seja facilmente acessível a todos.

Seguir estas orientações tornará os conteúdos acessíveis a um maior número de pessoas com deficiência, incluindo cegueira e baixa visão, surdez e perda de audição, dificuldades de aprendizagem, limitações cognitivas, movimentos limitados, deficiências da fala, fotossensibilidade e combinações destas.

Uma diretriz muito importante é o contraste de cores. Em um design mais antigo do site Kinsta, nossa fonte era um pouco leve demais e os visitantes expressaram suas preocupações, pois dificultava a leitura. A última coisa que você quer fazer é publicar conteúdo incrível só para que ele se torne uma tensão nos olhos das pessoas!

Você pode usar uma ferramenta como o verificador de contraste de cores do WebAIM para ver se as cores das fontes passam nas recomendações oficiais. Abaixo você pode ver que as cores nos posts do nosso blog já passaram o teste. 👍

Ferramenta verificador de contraste de cor

Ferramenta verificador de contraste de cor

Qual é a Sua Fonte Favorita no Google Fonts?

Google Font é incrível e usado por milhões de sites na web todos os dias. Seguir as melhores práticas, tais como limitar o peso das fontes, alojá-las localmente (em alguns casos) e seguir as orientações de acessibilidade, irá garantir uma melhor experiência geral para os seus visitantes.

Agora a todos – quais são as vossas fontes favoritas e pares de fontes do Google Fonts? Deixe-nos saber abaixo nos comentários.

60
Shares