Tipografia: um manual completo para criação

tipografia

O que é tipografia? De um ponto de vista simplista, podemos dizer que trata-se da arte de arranjar tipos para obter um resultado estético agradável. Mas ao longo deste manual completo sobre tipografia você entenderá que na verdade trata-se de muito mais do que isso.

A maioria das pessoas jamais pensa em tipos em toda a sua vida, mas você como designer deve se diferenciar delas e se empenhar em conhecer tipografias criativas. Afinal, entender o efeito psicológico de fontes e a sua importância na hora de convergir uma mensagem é a sua profissão.

Tipografia é uma parte muito importante do design e compõe a maioria de seus layouts. Por isso, hoje você entenderá de uma vez por todas o que é tipografia, quais são seus elementos de variação e o quão importante é o seu papel na criação de logos memoráveis. Pronto para essa lição? Então comece a leitura agora mesmo!

1. O que é tipografia?

Para usar a explicação mais básica possível, tipografia é o desenho e o uso de tipologias como uma forma de comunicação. Muitas pessoas consideram que essa arte começou com Gutemberg, após a criação da primeira prensa, mas a tipografia vai bem mais longe do que isso. Esse braço do design tem suas raízes, de fato, nos letterings manuais que são tão antigos quanto a escrita em si.

Por isso, quando falamos de tipografia, não vale achar que estamos falando apenas de fontes como você as conhece na modernidade. Tipografia encompassa tudo desde a caligrafia até os tipos digitais que vemos hoje em páginas da web (como esta).

Tipografia é muito mais do que uma fonte bacana. É a estética completa de qualquer palavra em sua forma escrita, do arranjo de suas letras até o espaçamento entre elas.

Quando surgiu a tipografia?

Embora Gutemberg não tenha inventado a tipografia, é ele o responsável pela ciência moderna dos tipos como conhecemos. Antes da imprensa, livros eram produzidos por escribas e o processo era todo manual. Entretanto, foi só com a invenção do tipo móvel, por Johannes Gutemberg, e a partir da publicação de sua Bíblia, em 1454, que o processo de composição tipográfica em escala industrial foi cunhado.

A prensa, criada pelo supracitado inventor, foi um instrumento de comunicação revolucionário e o primeiro de muitos meios de divulgação de ideias em massa. Naquela época, boa parte da população ainda era analfabeta, e foi graças a introdução secularizada de formas de se imprimir (longe dos monastérios e do domínio da Igreja) que foram possíveis revoluções posteriores, como as teses protestantes de Lutero e a Revolução Industrial (1870).

Por que tipografia é importante?

Tipografia é importante, primeiramente, porque está em toda parte. Olhe ao seu redor e me diga quantas coisas têm tipos nelas. Se você está numa sala de escritório ou no seu quarto, provavelmente há por aí itens que contém marcas e nelas há tipografias diferenciadas que representam produtos, por exemplo.

Caso não consiga apontar uma tipografia assim, basta olhar para o seu telefone. Ali há pelo menos uma dezena de fontes convivendo em harmonia para converter uma mensagem. E todos os elementos contidos nelas, de glifos a serifas significam alguma coisa.

Talvez pareça trivial para você, na maioria das vezes, o papel das fontes ao seu redor, mas até a menor das alterações nelas pode fazer uma grande diferença. Quando uma marca escolhe trocar sua tipografia oficial você pode até não perceber isso inicialmente, mas sentirá que o layout tem características distintas do que você conhecia.

Em muitas peças gráficas, como em websites, tipografias são praticamente 80% de um layout. Dá para entender, por aí, por que esses instrumentos de comunicação são tão importantes. Além deles carregarem uma mensagem, levam consigo também características intrínsecas que muitas vezes temos dificuldade de precisar, mas sabemos que estão lá.

Pense, por exemplo, em como as letras em caixa alta (ESCRITAS ASSIM) assumiram uma identidade própria no contexto moderno. Toda vez que as utilizamos na internet ou em peças gráficas parecemos querer chamar atenção de nosso interlocutor, falando num tom de voz um pouco mais alto. Como algo tão simples quanto a mudança de caixa consegue expressar tamanha diferença?

É porque tipografias falam além do que está escrito. E entender esse papel delas, como designer, fará com que seu trabalho se torne cada vez melhor.

Qual a diferença entre fonte, glifo e família tipográfica?

Toda tipografia é composta de caracteres, que são o menor de seus componentes. Podemos citar, como exemplo, qualquer letra do dicionário ou número. Os caracteres são definidos assim porque tem valor semântico e, portanto, significam algo dentro ou fora daquela tipografia.

Já um glifo é uma representação visual de um caractere, ou seja, ele especifica uma fonte. Em alguns casos, um glifo pode representar mais de um caractere e aparecer em situações especiais. Em muitas fontes, quando as letras f e i são colocadas juntas (fi), cria-se uma ligadura, ou seja, um glifo especial que conecta ambas para facilitar a leiturabilidade do tipo.

Já o termo família tipográfica diz respeito a uma coleção de caracteres, que reúne designs que variam em peso em outras características, mas que ainda assim mantém o mesmo desenho da fonte original. Pense, por exemplo, na tipografia Arial e na tipografia Arial Bold. Ambas fazem parte da mesma família tipográfica, mas uma está em negrito enquanto a outra não.

Utilizar mais de uma fonte da mesma família tipográfica é um recurso excelente para criar um senso de hierarquia em seus layouts sem, entretanto, confundir os leitores. Dessa forma você conseguirá fazer com que títulos e bullet points, por exemplo, se destaquem do resto sem que eles saiam da harmonia da composição.

Quais são as classificações dos tipos?

As classificações dos tipos são às vezes chamadas de famílias genéricas de fontes, pois são formas de organizá-las por familiaridade e construções similares. Esses agrupamentos de tipografias são baseados num número de classificações em que diferentes fontes podem ser incluídas e, no geral, as mais típicas são:

  • serifadas;
  • sem serifa;
  • monospace;
  • cursivas;
  • fantasia;
  • script.

Há outro sem número de classificações de fontes que são diferentes dessas, como a “slab serif”, que diz respeito a fontes que são identificáveis por terem serifas curtas e grossas em suas extremidades. Cada uma dessas classificações tem em si uma particularidade, que torna fácil identificar fontes que fazem parte deste grupo. A seguir, você verá cada uma delas brevemente.

Serifadas

Fontes serifadas são todas as fontes que contém, em sua composição, serifas. Essas ligações, entre uma fonte e outra, aumentam a leiturabilidade de um tipo e o tornam ideal para suportar grandes massas de textos.

Sem serifa

Fontes sem serifa, por sua vez, são todas as tipografias que não têm as ligações conhecidas como serifas. Essas fontes são excelentes na web e para executar títulos e destaques e geralmente são pareadas com fontes com serifa na composição de layouts mais complexos.

Monospace

Fontes monospace são fontes cuja largura é fixa. Todas as suas letras e caracteres ocupam sempre a mesma quantidade de espaço horizontal, o que torna sua aplicação ideal em máquinas de escrever e programas de edição de código, que exigem uma alta leiturabilidade.

Fantasia

Fontes fantasia são fontes decorativas, particularmente úteis para a confecção de cartazes e mídia de display.

Script

Fontes script são exatamente o que seu nome indica. Fontes de estilo caligráfico, que podem ser compostas com auxílio do computador, e utilizadas em layouts de todos os tipos para dar a eles um ar mais artesanal.

2. Elementos de variação entre as fontes tipográficas

Quando as tipografias fazem parte da composição de um layout elas sofrem algumas variações em seus elementos, respectivamente nos seus alinhamentos, tamanho, largura, peso e contraste para que se adequem à composição ao seu redor. Conheça o funcionamento desses elementos de variação a seguir.

Alinhamento

O alinhamento é uma das maneiras de organizar uma tipografia e pode ser justificado, centralizado, alinhado à direita ou à esquerda. Na maioria dos apps de layout web e impresso, criar composições com essas características está a distância do clique de um botão, mas decidir que tipo de alinhamento você vai utilizar não é tão simples quanto aplicá-lo.

Como regra, sabemos que os alinhamentos justificados são populares, mas mais difíceis de ler. Já os alinhamentos à esquerda favorecem a leitura, mas ocupam mais espaço do que o justificado. Quando você opta por alinhar um texto à direita, por outro lado, dificulta a compreensão de grandes massas de texto e ao centralizar conteúdos deve priorizar fazê-lo apenas em textos com a mesma quantidade aproximada de palavras em cada frase, como poemas e convites.

Seguindo estas regras dá para compreender basicamente o funcionamento do alinhamento na complexidade tipográfica e criar layouts melhores para os seus clientes.

Tamanho

O tamanho de uma tipografia é determinado pelo espaço que ela ocupa em pontos ou pixels dentro de uma página. Ajustar o tamanho de seus tipos proporcionalmente a seus layouts é importante para criar o que chamamos de hierarquia visual e harmonizar o todo de suas composições.

Você pode fazer isso por tentativa e erro, realizando múltiplos testes para avaliar a leiturabilidade de uma tipografia em suas peças gráficas. Faça tantas impressões quanto for preciso e confira se é possível ler todas as informações contidas em um determinado documento antes de finalizá-lo.

Largura

A largura de uma tipografia é decidida em sua construção, ou seja, não depende do designer que está aplicando-a, necessariamente. Como mencionamos, fontes monospace são as únicas cuja largura é conhecida e sempre a mesma para todos os caracteres de um alfabeto. Por isso elas são escolhidas para compor os tipos móveis tradicionais e ferramentas como a máquina de escrever.

A largura de uma tipografia determina a sua dimensão, visualmente falando. Com base nela dá para calcular quantas páginas um layout precisará ter para conter uma determinada quantidade de informações, por exemplo.

Obviamente, a largura de uma tipografia pode ser distorcida em programas de edição. Entretanto, o ideal é que isto não aconteça. Quando mexemos na largura ou na altura de uma tipografia sem manter suas proporções originais, prejudicamos (e muito) sua leiturabilidade e legibilidade e transformamos-na em algo completamente diferente do que foi criado pelo designer responsável. A maioria das licenças de uso sequer permite que isso seja feito sem algum tipo de punição.

Peso

O peso é uma característica relativa à grossura do traço de cada caractere de uma fonte. São consideradas mais pesadas as fontes que têm traços mais grossos em suas composições, bem como são consideradas mais leves as fontes que têm traços mais finos nos seus desenhos.

Em geral, o peso de uma fonte é expresso pelas palavras em inglês bold (negrito), light (leve), extra bold (super negrito) e black (o mais grosso dos traços). Há ainda variações como o extra light (super leve), thin (muito leve), extra thin (muito muito leve) e assim por diante, a depender da família tipográfica em questão.

Contraste

Quando falamos de contraste em tipografia, estamos falando da diferença de pesos, ou seja, a distância entre traços leves e traços mais grossos num mesmo layout. Você pode ver que uma fonte tem um bom contraste quando ela consegue ser reduzida em vários pontos sem perder legibilidade e sem prejudicar o seu entendimento. Este aspecto do design tipográfico é particularmente importante no desenvolvimento de logos.

3. Complementos

Alguns complementos podem ajudar você a trabalhar com tipografias de maneira muito mais simples no seu dia a dia. Por isso, os abordaremos aqui e explicaremos o papel de cada um deles na criação de layouts criativos e harmoniosos.

Você entenderá, neste tópico, como o uso do grid, de recursos de hierarquização e de uma boa combinação de cores podem destacar uma composição tipográfica e fazer dela ainda mais valiosa.

Uso do Grid

Todos os designs podem se beneficiar dos grids, recursos para arranjar textos e imagens em uma página ou tela. E especificamente quando falamos em fazer composições harmoniosas com tipos, os grids podem ajudar. Sua estrutura ajuda a criar composições hierarquicamente harmônicas, que seguem uma ordem natural e de fácil entendimento.

Muitos designers abraçam o grid como parte de sua prática profissional e veem nele um recurso para facilitar as suas rotinas. Grids podem ser usados para compor texto e imagens, mas são especialmente úteis na organização de parágrafos e grandes massas de palavras que ficam muito melhor resolvidas dentro de suas medidas.

Na prática, o que o grid faz é tirar a parte da adivinhação do design. Ele dá uma tela estruturada e com medidas claras, na qual está explícito em que posição cada elemento deveria ser configurado. Ao contrário de um canvas em branco, o grid orienta e direciona, agilizando processos de criação e minimizando o erro.

Recursos de hierarquização

Quando não estamos falando em grids, especificamente, temos outros recursos de hierarquização que podem ser utilizados no design tipográfico para criar harmonia entre layouts. Aqui, particularmente, endereçamos os pesos e tamanhos de tipografias e o seu poder de convergir uma ideia.

No momento em que você coloca um título com um tamanho maior do que o corpo de um texto, está criando uma estrutura hierárquica que deverá ser respeitada ao longo de todo o seu layout. Este recurso, bem como o uso de negritos, itálicos e outros pesos específicos, são uma das ferramentas de design mais conhecidas para criar diferenciação e determinar equilíbrio entre composições.

Combinação de cores

Combinar cores é outra forma de variar o uso de tipografias e estabelecer uma relação entre elas, de grandeza ou comparação. Quando você escolhe uma paleta de cores para uma peça gráfica, todas essas cores significam alguma coisa e aquela que você opta por colocar em títulos e no corpo de textos faz toda a diferença em sua criação.

Dependendo da combinação de cores criada você pode estabelecer que um texto é uma continuidade de um texto anterior ou trata-se de uma seção completamente diferente e nova em um layout. Por isso, vale ficar atento para esta característica ao compor seus layouts.

4. Fontes tipográficas vs logos

Fontes são provavelmente um dos aspectos mais importantes na hora de criar uma logo. E é exatamente por isso que não poderíamos considerar este manual completo sem abordar este aspecto das tipografias.

Quase toda logo terá um componente tipográfico em seu conjunto, geralmente o nome da organização que representa ou uma tagline. E essa parte de uma logo é tão importante quanto o ícone ou símbolo que vem ao seu lado. Selecionar a tipografia apropriada é tão crítico para o sucesso de um design em particular quanto qualquer outra etapa do branding.

Antigamente, usar tipografia existente era tabu na criação de logos. O design de tipografias customizadas era quase que obrigatório quando um designer se tornava responsável pelo desenvolvimento de uma identidade visual, pois isso era considerado parte do seu trabalho. Toda logo tinha de ter sua tipografia própria, desenhada manualmente ou composta com caracteres únicos retirados de outras fontes e adaptados exclusivamente para aquele uso.

Hoje, todavia, as coisas não são mais assim. Com o avanço do design digital e a quantidade quase ilimitada de fontes disponíveis por aí, esse tabu foi colocado para escanteio. É perfeitamente aceitável combinar uma fonte existente com um desenho exclusivo e criar uma logo única, o que simplificou bastante o trabalho de designers ao redor do mundo.

Muitas vezes, inclusive, essa é a opção favorita de clientes e designers porque a tipografia escolhida pode ser utilizada em outras aplicações, estendendo as opções da marca. Assim, website e documentos podem ser personalizados e ficarão com a cara do negócio sem que precisem ser desenhados exclusivamente.

Isso, obviamente, não quer dizer que em alguns casos não será necessário desenhar ou customizar fontes. Se você achar que essa é a decisão certa para um projeto, faça-o. Mas não fique tímido de usar uma tipografia disponível comercialmente, isso não é mais um problema.

As melhores fontes tipográficas para logos variam de projeto para projeto. Não podemos fazer aqui uma lista simples de fontes que são ideais para que você utilize como coringa em todas as suas aplicações, pois isso não seria justo. Cada cliente tem necessidades exclusivas e demandas únicas que você como designer deve atender.

Por isso a customização não deve sair do seu radar. Talvez seja necessário fazer ajustes em uma tipografia disponível no mercado para que ela atenda às suas expectativas. Muitas vezes uma fonte é perfeita para uma aplicação, mas tem alguns defeitos em seu desenho que poderiam prejudicar sua leiturabilidade em algumas instâncias.

Neste caso, você é encorajado a verificar a licença dessa fonte e descobrir se ela pode ser modificada para a aplicação em seu projeto. Se sim, o faça. Tendo o melhor para o seu cliente em mente, é provável que os resultados ficarão incríveis.

Existem, entretanto, algumas dicas que podemos dar para facilitar a sua vida na hora de combinar fontes para logos. Fique atento às colocações a seguir:

  • trabalhe com fontes que se complementam;
  • tente manter o design simples, em geral;
  • crie uma hierarquia visual entre as fontes escolhidas, não importando quantas elas são;
  • evite escolher tipografias que são quase idênticas para um mesmo projeto;
  • explore uma família inteira de fontes;
  • procure não combinar fontes da mesma categoria;
  • brinque com o tamanho das suas fontes até obter o resultado desejado;
  • pense no contexto de suas aplicações antes de escolher tipografias;
  • crie contraste entre os tipos escolhidos, colocando uma fonte em negrito junto a uma fonte super light, por exemplo;
  • escolha fontes de um mesmo designer para facilitar na harmonização delas;
  • experimente fontes de várias categorias que tenham a mesma altura;
  • opte por fontes premium e evite as fontes gratuitas de origens pouco confiáveis;
  • estude cada fonte individualmente.

Quando o assunto é tipografia, pode ser muito difícil fazer combinações, entender como elas funcionam e obter os melhores resultados. Todavia, com este guia você conseguirá resolver os principais problemas que tem com fontes num piscar de olhos. Mantenha-o nos seus favoritos e o consulte sempre que precisar.

Acha que é um especialista em tipografia e sabe aplicá-la como ninguém? Então venha ser um profissional WeLancer! Cadastre-se gratuitamente!