fbpx
Desenvolvimento Dicas

Fontes para web: saiba onde encontrar

Quando foram implementadas, as folhas de estilo (CSS) introduziram muitos recursos em tipografia para web. Atualmente, a propriedade facilita a vida de quem quer instalar e inserir fontes diferentes em sites (usando o elemento @font-face), fugindo do padrão de formatação básico do HTML.

Pensando em ampliar as possibilidades para a sua página, selecionamos alguns sites que oferecem diversas famílias tipográficas para serem instaladas e utilizadas. Confira abaixo alguns sites ótimos com fontes web para você usar:

Google Fonts

https://www.google.com/fonts/

O mais famoso dos sites que oferecem fontes para web: não exige cadastro, as fontes são gratuitas e o acervo é bem completo (fontes manuscritas, fontes com serifa, sem serifa, display, mono espaçadas). Ao escolher uma fonte, é possível observar todas as suas variações (mais fina, mais larga, em itálico, em negrito ou até mesmo em itálico + negrito) e escolher a que melhor adequa a sua proposta.

Adobe Typekit

https://typekit.com/fonts

Neste site, é preciso fazer um cadastro para ter acesso a 800 fontes gratuitas para a web, que podem ser instaladas dentro de um único site. Também existem planos pagos que apresentam um maior número de fontes e permitem instalação em mais de um site. O Typekit é bem completo: cada fonte possui uma descrição sobre o autor, indicações de uso, para quais línguas está disponível (pela questão do alfabeto e caracteres especiais).

Adobe Edge Web Fonts

https://edgewebfonts.adobe.com/fonts

Bem parecido com o Google Fontes, o Edge Web conta com um acervo de 503 fontes para web (decorativas, sem serifa, com serifa, manuscritas, mono espaçadas etc). Dá para pesquisar as fontes por estilo, indicação de uso, propriedades e línguas que suporta. Esse site é uma boa opção para quem busca fontes gratuitas e não está disposto a fazer um cadastro, basta escolher a fonte e copiar o código para aplicar no layout.

Font Squirrel

http://www.fontsquirrel.com/

Este site permite encontrar fontes para serem baixadas e usadas de maneira geral e também permite que você carregue uma fonte que já exista no seu computador. Assim, ele cria automaticamente o arquivo com css, transformando-a em uma web fonte! Para realizar buscas direto no site, é preciso refinar por “Web Fonts”, clicar em “Webfont Kit” e optar pelo Download @Font-Face Kit. Ao escolher uma fonte, você consegue ver as línguas para quais ela está disponível e escolher a opção que mais se adequa antes de baixar. As opções de fontes disponíveis são um pouco limitadas e é preciso garimpar, mas pode valer a pena.

CSS Font Stack

Fontes tradicionais – http://www.cssfontstack.com/

Para os mais clássicos, é possível encontrar 46 fontes simples e básicas. Ele mostra quais são as fontes tradicionais e seguras (fontes que são pré-instaladas por muitos sistemas operacionais e, por isso, para usá-las basta inserir o nome), existem opções sem serifa, com serifa, mono espaçadas, fontes fantasia e script.

Web Fontes – http://www.cssfontstack.com/Web-Fonts

Nesta outra parte do site, são disponibilizadas 320 fontes gratuitas para web, divididas em três categorias principais: com serifa, sem serifa e manuscritas. Não é necessário fazer nenhum tipo de cadastro e nem download, o código é fornecido na própria página.

Ficou preocupado, pensando que a fonte pode não aparecer em todos os navegadores? Saiba que, hoje em dia, é muito difícil que determinada fonte não seja identificada, porém, vale lembrar que é importante deixar algumas fontes tradicionais em segundo plano.  Elas podem assumir o lugar da fonte principal e seguramente estarão disponíveis na maioria dos navegadores. Assim, as fontes substitutas podem ser usadas caso alguma plataforma não suporte a web fonte escolhida como principal.