Google Fonts: como usar baixar tipografias gratuitamente?
Quem trabalha fazendo artes, designs ou precisa criar um produto visual sabe que o uso de boas fontes faz toda a diferença e, também, que quanto mais estilos tiver para escolher, melhor. Com o Google Fonts essa busca fica mais fácil, já que pelo serviço pode-se pesquisar por tipografias de todos os tipos e fazer o download de pacotes para usar nos seus documentos.
Quer saber como fazer para usar o Google Fonts para facilitar os seus trabalhos de criação de imagens e vídeos? Então confere aqui dicas que vão te ajudar a usar ainda melhor esta ferramenta!
Como funciona o Google Fonts?
O Google Fonts é uma base de dados exclusivas de tipografias para criações de conteúdo digital. Ou seja, todos os estilos de fontes cadastrados no site são web fonts, próprias para o uso em sites, banners e postagens em redes sociais.
Ao usar o Google Fonts você poderá encontrar a tipografia perfeita e baixá-la no seu dispositivo para usar no programa que preferir, pode ser em outro serviço – como o Google Apresentações, por exemplo ou no Photoshop que tem instalado no PC.
Como usar o Google Fonts?
Usar o Google Fonts é muito fácil, porque a busca é bastante intuitiva e o layout minimalista característico do Google orienta o usuário onde deverá clicar.
- Acesse o site do Google Fonts com a sua conta Google;
- Favorite as fontes que mais gostou adicionando-as para pastas personalizadas em “Add to colection”;
- Use o filtro de buscas para ser mais fácil encontrar o estilo de fonte que deseja. Você pode optar só por fontes serifadas, manuscritas ou de acordo com o tema do seu trabalho, por exemplo;
- Para exportar o arquivo da fonte para o seu dispositivo clique em “Donwload”. Um arquivo ZIP será transferido. Clique em “exportar” para conseguir ver os arquivos que ficam dentro da pasta. No arquivo em que tiver escrito “TrueType faça o download para conseguir visualizar a fonte nos seus programas”
Como usar as fontes do Google Fonts na minha página?
Para usar as fontes do Google você precisa aprender a copiar o código HTML que definem o padrão de cada tipografia. Olha só como fazer isso:
Assim que você adicionar uma fonte clicando no botão + aparece uma notificação na tela com algumas informações sobre o arquivo salvo. Clique no box. Ali, selecione a opção “Embed”.
Na hora de fazer a importação da fonte você terá duas opções. A primeira delas é o modo “Standart”, modo em que será preciso copiar o link e colar o código no site dentro da tag <head>.
Exemplo Standart:
<html>
<head>
<link href="https://fonts.googleapis.com/css?family=Roboto+Mono" rel="stylesheet">
<style>
div {
font-family: 'Roboto Mono', monospace;
}
</style>
</head>
<body>
<div>Exemplo</div>
</body>
</html>
A segunda opção de embed é pelo código CSS @import que deve ser copiado e colado na mesma sessão head.
Exemplo @import:
<html>
<head>
<style>
@import url('https://fonts.googleapis.com/css?family=Roboto+Mono:300,400');
div {
font-family: 'Roboto Mono', monospace;
font-weight: 400;
}
</style>
</head>
<body>
<div>Exemplo</div>
</body>
</html>
Na aba “Load Time” você poderá conferir qual é o tempo estimado que aquele arquivo de tipografia demora para carregar numa página da web.
As 5 melhores fontes do Google segundo especialistas
Está na dúvida e qual fonte escolher para o seu trabalho? Então a lista com estas 5 melhores fontes do Google segundo especialistas vai te ajudar a decidir. Entre as selecionadas das mais de 800 famílias de fontes disponíveis grautitamente nas bases do Google, estas são as que obtiveram melhores resultados em websites e redes sociais.
Clique nos links para visualizar a página da fonte no site oficial, onde poderá fazer o download e testar a tipografia.
- Roboto: uma fonte estilo sans serif desenvolvida por Christian Robertson e que é usada como padrão para o sistema Android, sendo uma das fontes mais populares de todo o Google Fonts;
- Open Sans: uma fonte sans serif desenvolvida por Steve Matteson, é a fonte que o Google usa para fazer anúncios e também está presente em algumas páginas oficiais;
- Lato: essa é outro estilo de fonte sans-serif, desenvolvida por ?ukasz Dziedzic. A fonte é tradicional no uso de produtos feitos para o público digital;
- Source Sans Pro: é uma fonte sans-serif criada por Paul Hunt para uso inicial nos programas da Adobe, sendo a primeira a ser disponibilizada com código aberto. Muito comum em criações publicitárias;
- Montserrat: uma das fontes sans-serif com mais opções de estilo diferentes, sendo 18 no total. Assim poderá criar títulos e subtítulos com facilidade, sem precisar trocar a família da fonte e arriscar a harmonia do projeto.
Gostou das dicas? Então continue acompanhando as postagens do Tech News e não se esqueça de deixar a sua opinião sobre o conteúdo aqui nos comentários!
Deixe seu comentário