Por que é melhor usar Google Fonts em freelances de webdesign?

google-fonts para webHouve uma época sombria da internet em que um site só poderia ser considerado de boa usabilidade se exibisse textos em Arial ou Times New Roman. Houve uma época ainda mais escura em que era aceitável usar Comic Sans — é melhor nem lembrar disso!

A verdade é que desde que o Google resolveu atacar o problema de forma definitiva com seu Fonts API, os designers ganharam muito mais customização e expressão para seus trabalhos freelance de webdesign. É por isso que vamos te mostrar agora por que usar uma Google Font é a melhor solução para você!

O que é uma Google Fonts

Afinal, o que significa Google Fonts API? Esse é o nome da interface de programação de aplicações que a gigante de buscas criou para facilitar o trabalho dos web designers na hora de escolher a tipografia de um site.

Antigamente, os navegadores só conseguiam exibir as fontes de uma página na web caso elas estivessem instaladas no computador do usuário. Isso limitava muito a criatividade dos profissionais de web, que ficavam restritos às fontes do sistema para não causar problemas de visualização (como Arial, Verdana, Times New Roman, etc).

Com a API do Google, as fontes são renderizadas utilizando um diretório na nuvem, sem a necessidade de tê-las instaladas no sistema de quem visualiza a página. É uma mudança simples, mas que abre um novo mundo de possibilidades para o freelancer que quer mais qualidade e estilo em seu trabalho.

Por que utilizar uma Google Fonts em seus trabalhos freelance de webdesign

Não é à toa que web designers vêm integrando este diretório de fontes em seus trabalhos. Não é porque todos gostamos do Google, é porque elas dão vantagens competitivas e de conceito para o freelancer que busca se destacar da concorrência. Veja as razões disso:

Licença comercial gratuita

O primeiro motivo já é um belo incentivo para começar a usar o Google Fonts. Todo designer freelancer sabe como é difícil encontrar fontes de qualidade que fujam daqueles padrões do sistema sem ter que apelar para a pirataria.

Pois é, esses dias acabaram! O diretório do Google oferece mais de 800 famílias de fontes de alta qualidade técnica e visual, gratuitas e com código aberto. Isso significa que você pode baixar, usar e modificar qualquer uma delas do jeito que você quiser.

Facilidade de implementação

O Google criou seu diretório de fontes pensando especificamente em seu uso para a internet. Por isso, é muito fácil procurar e adicionar famílias aos seus freelas de webdesign.

Todas elas possuem o mesmo sistema unificado de implementação para CSS e HTML, bastando escolher a Google Font que você quiser, copiar o código e adicioná-lo ao da página que você está construindo.

Ganho em usabilidade

Uma grande vantagem desse diretório é a variedade de famílias de fontes para os vários usos que você pode ter em uma página. Basta definir sua prioridade para a usabilidade que você procura.

Você quer uma página mais legível? Para uso preferencial no mobile? Você quer fontes display para integrar gráfico e usabilidade? É só procurar o que precisa e começar a integração!

Como não é só de leitura que se mede a usabilidade, você também deve se preocupar com a leveza do site e com o quão rápido a sua página é visualizada. Pensando nisso, o Google categoriza as fontes por tempo de carregamento (load time), de rápido a lento, para você saber com objetividade o quanto aquela família impactará no peso da sua página.

Liberdade de estilização

É claro que para um designer é importante imprimir seu estilo depois que a usabilidade está resolvida. É nessa hora que um freelancer precisa fugir das fontes padrão para conseguir mostrar a sua capacidade de estética e de conceito.

O diretório do Google oferece fontes com e sem serifa, fantasia e display, escritas a mão e monospace, opções para todos os casos na hora de diagramar o seu projeto.

Como incluir uma Google Fonts no seu design

exemplo-google-fonts

É muito fácil adicionar uma fonte do Google em seu projeto, seja seu site de portfólio ou em um freela de webdesign. Veja os passos a seguir:

1. Escolha a fonte

Entre em https://fonts.google.com/. Infelizmente o site está apenas em inglês, mas é muito fácil navegar nele. Você pode passear por todo o diretório até encontrar o que precisa, mas também pode utilizar a busca para procurar um nome e refinar resultados por categoria.

2. Selecione a fonte

Selecione as famílias de fonte que você preferir clicando no sinal “+” ao lado do seu nome. Fazendo isto, a família escolhida será adicionada a um menu no pé da página.

3. Customize a família selecionada

Ao abrir o menu com as fontes que você escolheu, vá até a aba “CUSTOMIZE” para adicionar todos os pesos que você pensa em utilizar no seu design. Nesse momento, tome cuidado!

Quanto mais opções de peso você selecionar, maior será a influência da fonte no tempo de carregamento da página. Use apenas as que forem necessárias para garantir seu estilo e a usabilidade do site.

4. Adicione Google Fonts ao seu código

Fontes definidas, é hora de importá-las para o seu trabalho. No mesmo menu de famílias selecionadas, a aba “EMBED” gerará o código que você precisa para usar a fonte. Você pode tanto usar o método href tradicional do HTML como a regra @import no CSS do seu site.

Além disso, o Google gera também a regra para você especificar o uso das famílias no código de estilo, bastante didático para você não errar!

O diretório do Google Fonts surgiu como a solução para a dificuldade que os designers tinham em variar e surpreender em seus projetos de webdesign. Entender como ele funciona e aprender a usá-lo é essencial para um freelancer se destacar da concorrência em personalidade, eficiência e profissionalismo.

Agora que você está pronto para usar uma Google Font em freelances de webdesign, é hora pôr em prática seus conhecimentos — não só para dar estilo ao seu design como para facilitar a vida dos usuários que seu cliente quer atrair. Para isso, venha conferir um artigo sobre a importância da usabilidade em um site!