Fontes

Fontes

Imagine ter de carregar, para cima e para baixo, caixas pesadas contendo letras feitas de metal – um conjunto diferente de letras para cada corpo tipográfico – e ter de montar seu texto, letra por letra, para criar o design de um documento.

Esse parece um mundo distante do universo clicável e instantâneo do design digital. Porém, não faz muitos anos que uma fonte era conhecida como um conjunto específico de letras de metal portáteis – em vez de um nome engraçado no menu suspenso de um software.

Embora nossos métodos de design tenham avançado bastante, às vezes navegar pelo processo moderno de escolha e uso de fontes pode parecer quase tão complicado quanto nos bons e velhos tempos das fontes de metal e prensas móveis. Então, se você já se sentiu um pouco confuso com relação às fontes, você está no lugar certo.

Este guia foi criado para oferecer uma visão geral sobre fontes: suas diferentes categorias, como escolhê-las, como usá-las e onde encontrar fontes gratuitas para download.

01. Quantos tipos de fonte existem?

Indo direto ao ponto: vários, incluindo alguns tipos bem malucos, que desafiam o sistema de categorização. Tipógrafos, designers de fontes e outros interessados na história da tipografia podem afirmar que há diversas classificações, cada uma delas com definições técnicas e históricas próprias – e eles estão certos. Algumas classificações que você já deve ter ouvido falar incluem Romana, Escrita Gótica e Humanista. Porém, não vamos nos debruçar sobre elas neste artigo (mas se você tiver interesse, pode encontrar muitas informações na internet). Em vez disso, vamos focar em quatro categorias básicas de fontes. Tais categorias vão ser úteis para você entender como escolher uma fonte compatível com seu projeto, como combinar fontes no seu design ou discutir suas escolhas de fonte com outras pessoas.

1) Fontes serifadas: possuem pequenos “pés” ou linhas anexadas às suas extremidades. Elas são geralmente consideradas mais sérias ou tradicionais.

2) Fontes não-serifadas: não possuem linhas anexadas às suas extremidades. Por essa razão, são, geralmente, consideradas mais modernas e dinâmicas.

Embora este seja um ponto gerador de debate, é comum ouvir dizer que fontes serifadas fazem com que longas passagens de texto sejam mais fáceis de “navegar” visualmente. Porém, como as serifas são, geralmente, pequenas e finas, elas não são exibidas muito bem em telas digitais (parecem distorcidas em vez de nítidas). Por conta disso, muitos designers preferem usar fontes não-serifadas em projetos de web design, especialmente quando se trata de fontes pequenas.

3) Fontes script: são fontes em estilo cursivo. Elas, geralmente, possuem letras conectadas umas às outras. Você vai perceber que fontes desse tipo possuem estilos variados: elegante, divertido, casual e caligráfico.

4) Fontes decorativas: quando se diz que uma fonte é categorizada como decorativa, isso significa que ela tem o objetivo de chamar sua atenção. Geralmente, elas são mais estranhas que práticas e devem ser usadas em pequenas doses para alcançar um efeito ou propósito específico.

02. Isto é uma fonte ou um corpo tipográfico?

Você já deve ter ouvido pessoas se referirem aos textos que você usa em seus projetos de design como fontes ou corpos tipográficos, e parou para pensar se os dois termos significam a mesma coisa. Tecnicamente e historicamente, em termos de composição tipográfica, são coisas diferentes; porém, hoje em dia, tais termos são usados de forma intercambiável. Se você estiver interessado em entender a diferença, seguem algumas definições rápidas que podem ajudar:

O corpo tipográfico (tipo de letra) é o design; a fonte é como esse design é realizado.

Corpo tipográfico + estilo + tamanho = fonte

A fonte é o que você usa; o corpo tipográfico é o que você vê.

A distinção remonta à maneira tradicional de imprimir corpos tipográficos de metal. O estilo ou design único do alfabeto que identificamos por nome – digamos, Times New Roman ou Bodoni – seria considerado um corpo tipográfico. Quando esse alfabeto precisa ser criado em um tamanho ou peso específico (tamanho 10 em negrito, por exemplo), passa a ser considerado uma fonte. Então, Bodoni 10 em negrito e Bodoni 24 em itálico seriam duas fontes diferentes do mesmo corpo tipográfico.

Isso tudo para dizer que, para a maioria dos designs criados nos dias de hoje, os termos são mais ou menos intercambiáveis. Fontes são representações digitais de corpos tipográficos, e podemos alterá-las com um simples clique na tela do computador. Então, a não ser que você esteja conversando com um especialista em tipografia a quem você queira impressionar com seus conhecimentos avançados, não é preciso se preocupar com essas distinções.

03. Por que a escolha das fontes é importante?

Designers (incluindo Erik Spiekermann, Dan Mayer e Jessica Hische) são conhecidos por comparar a escolha de fontes para projetos de design com a escolha de roupas para vestir. E esta é uma analogia pertinente. Pense no que suas roupas dizem sobre você. Com base no que você veste, as pessoas vão tirar conclusões, certas ou erradas, sobre seu estilo, sua personalidade, sua situação socioeconômica, sua idade (ou a idade que deseja aparentar) ou o tipo de impressão que você deseja passar. E diferentes ocasiões e situações exigem diferentes roupas. Você não usaria um maiô para ir a uma entrevista de emprego; da mesma forma, você não usaria um terno e uma gravata durante suas férias na praia. Existe um elemento de adequação a considerar.

O que suas roupas fazem por você, as fontes fazem pelo seu design. Geralmente, a tipografia oferece aquela primeira impressão na qual as pessoas se baseiam para analisar e julgar o restante do seu design – por isso, suas escolhas precisam ser apropriadas e ter um propósito. Sua fonte está dizendo "férias na praia" quando deveria dizer "entrevista de emprego"? Os elementos da sua fonte se chocam ou se complementam? Estão, efetivamente, comunicando as qualidades que você deseja projetar? Essas considerações são uma parte do que torna a escolha das fontes tão importante durante o processo de design; algo que deve ser abordado cuidadosamente.

Geralmente, a escolha das fontes estabelece o tom do seu projeto e pode influenciar os sentimentos dos observadores e as interações deles com o seu design – assim como você seria julgado por sua aparência pelas pessoas caso aparecesse trajando sua camiseta puída favorita e sua calça de ginástica em uma festa de gala. Não seja esse cara com o seu design; não dê aos observadores uma desculpa para tirar conclusões incorretas sobre sua marca ou seu negócio. Escolhas tipográficas ruins sempre tiram a atenção da mensagem e das intenções do design.

Não tem certeza por onde começar? Na seção abaixo, vamos nos aprofundar na escolha e no uso de fontes, oferecendo explicações simples de entender e dicas práticas.

04. Como escolher uma fonte?

Os Fundamentos

Ao escolher a fonte para um projeto, sua primeira preocupação deve ser combinar a fonte com a mensagem e com a intenção do seu design. Antes mesmo de você começar a procurar algo no seu computador ou buscar uma fonte nova para comprar ou baixar, seria uma boa ideia fazer um brainstorm das qualidades e características que você deseja comunicar através do seu design. Dessa maneira, durante o processo de escolha da fonte, você já vai ter um modelo para guiar sua decisão.

Isso é importante, pois cada fonte tem seu próprio humor e sua própria personalidade. Ela pode ser séria, casual, brincalhona ou elegante. Você vai precisar determinar o que uma fonte específica está dizendo a você, e se isso se encaixa no seu design. Se as características que a fonte está comunicando não combinarem com a mensagem do seu design como um todo, vai ocorrer uma desconexão visual com os observadores ou usuários do seu design, e você não quer que isso aconteça.

Ao navegar pelas fontes, pode ser fácil cair na escolha de opções divertidas e interessantes, mas não deixe que suas preferências pessoais tirem o seu foco. Uma fonte que você acha diferenciada e estilosa pode não ser útil ou apropriada para o projeto no qual você está trabalhando. Pergunte a si mesmo: esta fonte apoia as qualidades da minha marca ou complementa a intenção do meu design? As escolhas mais eficientes proporcionam tudo isso.

Considere contexto e público.

Onde e como o seu design será visto também devem embasar sua escolha. Por exemplo, um design de cartão de visita vai precisar de uma fonte que seja legível em tamanho pequeno. Já um design para redes sociais – que, provavelmente, será visualizado em dispositivos móveis – necessita de uma fonte compatível com o tamanho das telas de celular e tablet.

Quem está vendo seu design também pode ser uma informação importante. Seu público tem uma certa idade ou pertence a um certo grupo demográfico? Sua fonte vai estar em sintonia com essas pessoas?

Sua escolha de fonte é adequada?

Em termos de contexto, a adequação é uma questão mais funcional do que o humor ou a personalidade de uma fonte. Por isso, pergunte-se: a fonte que você escolheu realmente funciona onde você pretende usá-la? Vai ser prática e facilmente legível no contexto do seu design?

Um dos erros mais comuns que os iniciantes cometem é não perceber as diferentes adequações das várias categorias de fonte – por exemplo, fontes para corpo de texto versus fontes decorativas.

Fontes para corpo de texto são usadas, como o nome diz, no corpo de texto: textos de livros, de revistas, de jornais, de sites – ou seja, textos longos. Essas fontes não cansam os olhos e são fáceis de ler. É importante que elas não causem distração, para que os usuários possam passar o olho no texto com facilidade. Esta é a categoria em que fontes como Times New Roman e Arial se enquadram.

Fontes decorativas (mencionadas brevemente no início deste artigo), em contrapartida, nunca são adequadas para longas passagens de texto. Esses são tipos de fonte que gritam “Olhe para mim!”. Elas apresentam vários graus de usabilidade, de fontes em negrito e caixa alta que podem ser usadas em manchetes a fontes que são bastante literais ou óbvias – como letras com formato de neve que parecem dizer “Eu devo ser usada no Natal!” ou letras que parecem feitas com pedaços de tronco ou gravetos que, supostamente, dão ao seu design um visual campestre. Elas podem ser divertidas e úteis, mas um bom design, especialmente aquele destinado a contextos empresariais ou profissionais, demanda algo mais sutil.

As fontes decorativas podem ter um grande impacto quando usadas de maneira correta, mas quando usadas inadequadamente, podem fazer com que o design pareça poluído e amador – ou completamente ilegível.

Resumindo, fontes decorativas são diferentes das fontes de corpo de texto, porque não são fáceis de ler em longas passagens, e devem ser usadas com moderação e propósito. Se você tiver dúvidas sobre se uma certa fonte é adequada ou não para o seu design, é melhor apostar em uma fonte neutra. Na próxima seção, vamos falar sobre como escolher uma fonte versátil e funcional, da qual você pode fazer muito bom uso.

A fonte escolhida é versátil?

Todo designer precisa de algumas fontes neutras. Essas fontes se adaptam a qualquer projeto e podem ser uma opção válida quando o prazo for curto ou nada mais funcionar. Às vezes chamadas de fontes do tipo “workhorse”, elas costumam ser fontes (com ou sem serifa) que não atraem muita atenção.

A fonte neutra mais útil vem em uma variedade de pesos (como claro, médio, negrito e pesado) e estilos (estreito, condensado, estendido ou versalete).

Poder contar com todas essas opções, especialmente em um design carregado em texto, permite que você atribua diferentes estilos da mesma fonte a diferentes funções no seu design, criando um visual geral mais coeso. É por isso que a escolha de uma fonte versátil – especialmente se você estiver planejando usar apenas um tipo de fonte em seu projeto de design – facilita, e muito, a criação de um design atraente e legível.

Em busca de algumas recomendações de fonte do tipo “workhorse” para usar? Ano passado, mais de 40 designers revelaram algumas de suas fontes favoritas. O resultado? Embora as respostas tenham sido bem variadas, a fonte Avenir (e Avenir Next, versão atualizada para melhor uso na web) foi a mais mencionada – mas se você quiser usá-la, vai ter de comprá-la, e ela não é barata.

No entanto, você não precisa ter dinheiro sobrando para obter algumas fontes versáteis. Há muitas opções que podem ser baixadas gratuitamente ou que estão disponíveis em vários sistemas operacionais. Embora essas fontes não sejam tão boas em termos de qualidade, nem tão cuidadosamente elaboradas quanto as top de linha, elas vão funcionar bem em projetos de design corriqueiros. Na categoria de fontes serifadas, experimente Georgia, Andada, Crimson Text, Droid Serif, Heuristica ou Merriweather. No quesito fontes não-serifadas, confira Franklin Gothic, Clear Sans, Roboto, Lato, Source Sans Pro ou Merriweather Sans.

A sua fonte é legível?

  • Tamanho: você precisa escolher o tamanho da fonte (em pontos) que se encaixe no contexto do seu design. Um cartão de visita vai precisar de uma fonte de tamanho diferente de um cartaz de evento. Se você estiver projetando algo que vá ser visto em dispositivos móveis –  gráficos para redes sociais, por exemplo –, abra qualquer programa de processamento de texto e tente digitar algumas linhas utilizando a fonte que você pensa em aplicar no design; em seguida, reduza o tamanho da fonte. Se você ainda conseguir realizar a tarefa com facilidade, então a fonte, provavelmente, vai funcionar bem em telas pequenas. Se você jogar no Google o nome de qualquer fonte e conferir algumas informações sobre ela (possivelmente, no site do designer da fonte), você será capaz de saber se ela é otimizada para uso na web ou não.
  • Espaçamento: ajustar o espaçamento do seu texto, a fim de adequá-lo ao design, contribui bastante para uma melhor visualização. Na maioria dos casos, um espaçamento generoso melhora a legibilidade. Porém, se o espaço no design estiver “apertado”, você vai precisar experimentar diferentes combinações de tamanho e de espaçamento da fonte para otimizar a legibilidade. A maioria dos programas de design permite que você ajuste o tracking (espaço entre grupos de letras ou passagens de texto), o kerning (espaço entre duas letras) e as entrelinhas (espaço vertical entre as linhas).
  • Altura de X: é a altura das letras minúsculas de uma fonte. Uma altura de X relativamente proporcional às letras maiúsculas melhora a qualidade e mantém a legibilidade, mesmo em letras de tamanho menor. Porém, a altura de X não deve se aproximar muito da altura das letras maiúsculas, pois desta forma fica difícil distingui-las.
  • O teste I/l/1: para qualquer fonte que você esteja considerando usar em passagens de texto que incluem letras e números, experimente o seguinte: digite “i” em letra maiúscula, “L” em letra minúscula e o número “1”. Se dois ou mais símbolos tiverem visuais idênticos, significa que os leitores vão tropeçar em algumas palavras ou combinações de letras/números.

Combinando fontes

Combinar duas ou mais fontes pode ser complicado. Você quer que as fontes se completem, porém, que não sejam muito semelhantes – diferentes, mas não tão diferentes que se choquem. Evitar esses extremos, de pouco ou muito contraste, geralmente acaba sendo um processo de experimentação, de tentativa e erro – como a Cachinhos Dourados testando o mingau dos três ursos e achando um muito frio, um muito quente, mas um "no ponto".

Encontrar uma combinação de fontes com um nível de contraste perfeito não é um processo didático; geralmente é o resultado de uma mistura de gosto pessoal, prática, instinto e observação. Mas esse processo não precisa ser completamente misterioso. Enquanto você estiver desenvolvendo sua habilidade para combinar fontes, pode pegar alguns atalhos:

  • Encontre uma qualidade comum às fontes: as que parecem muito diferentes, mas que compartilham algo em comum, podem funcionar bem juntas. Essa qualidade pode ser proporções gerais, como a altura ou largura das letras, ou uma estrutura parecida. Mesmo que a semelhança seja sutil, isso vai ajudar a dar à sua combinação de fontes uma coesão elementar.
  • Encontre fontes do mesmo designer: designers, geralmente, criam suas fontes utilizando uma abordagem única ou uma estética reconhecível. Seus modelos compartilham um certo aspecto ou uma estrutura que facilita a combinação. Procure famílias de fontes conhecidas como "superfamílias", que apresentam opções com e sem serifa criadas especialmente para se complementarem e que oferecem uma variedade de pesos e estilos para você escolher. Quer testar uma superfamília? Baixe Alegreya e Alegreya Sans (duas famílias de fontes gratuitas com 40 opções de peso e estilo ao todo) ou Merriweather e Merriweather Sans, que também apareceram em nossas recomendações de fontes versáteis.
  • Dê um trabalho para cada fonte: as fontes escolhidas vão precisar ser diferentes o suficiente para criar uma clara hierarquia visual – indicando aos observadores para onde olhar e o que é importante. Uma fonte sem serifa e outra com serifa são, geralmente, suficientes para alcançar tal objetivo de modo eficaz.

Mas quantas fontes são muitas fontes? Há quem diga, na comunidade do design, que uma fonte é suficiente para a maioria dos projetos e que três é a quantidade máxima que você deveria incluir em seu design para evitar um layout confuso e sobrecarregado. Embora seja um bom ponto de partida, se você é novo no design, saiba que não há regras – pelo menos, não há regras que não possam ser quebradas na situação correta. Alguns designs vão exigir um certo visual estético ou ultradecorativo que pode se beneficiar de uma gama mais ampla de fontes.

Onde encontrar fontes gratuitas?

Em busca de uma nova fonte para usar, mas não quer colocar a mão no bolso? Há muitos sites que oferecem fontes gratuitas para download. A primeira coisa que você deve lembrar ao baixar suas fontes é verificar a licença (mais sobre isso daqui a pouco). Primeiramente, aqui vão alguns sites com fontes gratuitas para você começar a criar seus designs:

1) Font Squirrel: é, provavelmente, o melhor recurso para encontrar fontes que são, ao mesmo tempo, gratuitas e licenciadas para uso comercial (todas as fontes do site). Inclui uma ótima seleção de fontes, escolhidas a dedo e de alta qualidade, pesquisáveis ​​por tipo (com serifa, sem serifa etc.) ou tag (casual, retrô etc.).

2) Google Fonts: criado para servir como diretório de fontes gratuitas para uso em sites, aplicativos e outros projetos relacionados à web. Inclui centenas de fontes do tipo open source (o que significa que elas podem ser compartilhadas, modificadas, customizadas etc.) otimizadas para web (com instruções de como adicionar o código apropriado ao seu website e de como integrar a fonte ao seu CSS). As fontes também podem ser baixadas em seu computador para serem usadas em projetos impressos – confira as instruções abaixo:

3) DaFont: atualmente, possui mais de 25.000 fontes gratuitas e em domínio público. Porém, elas variam em termos de qualidade, pois qualquer pessoa pode submeter suas criações. Muitas fontes gratuitas são apenas para uso pessoal.

4) 1001 Fonts: há mais de 7.000 fontes gratuitas disponíveis e, assim como o DaFont, elas variam em termos de qualidade. O site inclui uma seção especial de fontes gratuitas e disponíveis para uso comercial, bem como oferece opções úteis de busca – por tipo/estilo/humor, década e até feriados e outras ocasiões.

5) Outros: os sites abaixo não são dedicados exclusivamente a fontes gratuitas e não possuem um rico acervo, mas ainda assim possuem boas opções.

Lost Type Co-Op: oferece fontes vintage, únicas e da moda do tipo “pague o que quiser” para uso pessoal (incluindo nada – mas se você puder apoiar os designers das fontes, nem que seja contribuindo com uma quantia pequena, faça isso) e preço fixo para uso comercial.

Fontfabric: uma pequena, mas variada, seleção de fontes gratuitas, desenvolvidas profissionalmente. O site é atualizado com novas opções regularmente.

FontShop: um local para comprar fontes, e que também oferece uma seleção gratuita de certos estilos e pesos de fontes. É preciso criar uma conta para fazer download.

Pixel Buddha: possui uma seção gratuita que contém uma pequena seleção de fontes artísticas e desenhadas à mão. É preciso criar uma conta para fazer download.

Licenciamento de fontes

Quando você compra ou baixa de graça uma fonte, você não pode fazer o que quiser com ela. Dê sempre uma olhada na licença da fonte que você baixar antes de usá-la. Geralmente, ela é licenciada para uso pessoal, comercial ou educacional.

Algumas fontes limitam o número de vezes que podem aparecer em projetos impressos ou online, bem como indicam como (ou se) podem ser distribuídas para terceiros.

Bateu a inspiração? Comece a criar seus designs utilizando fontes incríveis hoje mesmo!

Descobrir como usar as fontes de uma maneira eficaz em seus projetos de design é um processo de aprendizado, de muita prática e de tentativa e erro. Esperamos que este guia seja um ponto de partida motivacional para você aprender mais sobre como escolher fontes apropriadas e como aplicá-las em seus projetos.