Tipografia é algo que nem todo mundo presta atenção, mas é um dos elementos mais importantes para a experiência de um projeto de design. Seja na web, num poster ou impresso numa caneca, a tipografia é fundamental.
A arte de trabalhar com diversas fontes e as maneiras de as manipular parece, a princípio, simples. Escolhe a fonte, ajusta o tamanho, muda a cor e talvez o peso da fonte. Mas na realidade o trabalho é bem mais profundo do que isso.
Tipografia é uma arte que é difícil de ser mensurada ou mesmo compreendida. Se bem feita e aplicada, parece que o texto se mistura com o restante do projeto. Age como uma facilitadora para transmitir o sentido das palavras alí escritas da maneira mais precisa. Se não tão bem aplicada, tem o poder de gerar entendimentos errôneos, atrapalhar o consumo do conteúdo e gerar desinteresse.
Mesmo com todo esse poder de transformar a mensagem transmitida por um design, a tipografia não recebe muita atenção, interesse e até apreciação por parte dos clientes ou consumidores/usuários. Então não é de se surpreender que muitos designers também não vão a fundo para lidar e manipular o texto.
Vamos aqui então nesse artigo listar algumns dos maiores problemas que designers fazem ao lidar com tipografia.
Dica: Esse site (em Inglês) explica muito bem as nuâncias e termos da tipografia.
Altura da linha (espaçamento)
Chamado de leading no Inglês, o espaçamento ou altura da linha é a distância entre duas linhas na tipografia. Para quem está acostumado(a) com CSS, também podemos chamar de line-height.
Quando o espaçamento é muito pequeno parece que o texto está desorganizado e fica difícil de ler. Além disso dá um pouco de preguiça de entender e fazer sentido das frases. Já se o tamanho for grande demais passa uma impressão que as frases não estão conectadas e fica mais difícil de seguir com um racioncínio.
Não existe uma regra exata para escolher a alura da linha, mas a melhor forma resolver esse problema é ler o texto ou pedir alguém próximo para ler. Além da estética que precisa ser observada, o que estamos buscando aqui é a legibilidade.
Momento curiosidade: O nome leading foi dado por causa dos fios de chumbo (lead) usados originalmente para organizar os espaços entre as linhas nas prensas de ferro.
Espaçamento entre letras
O espaçemento entre as letras, também chamado no Inglês de tracking ou letter-spacing no CSS, se refere à distância de cada letra para sua próxima em uma palavra ou frase completa. Quanto maior o espaçamento entre as letras, maior o tamanho que cada palavra e cada texto irá ocupar.
Muitas vezes designers utilizam desse recurso para fazer uma palavra ou texto caber em um espaço específico perfeitamente. Nesse caso em geral não há muito problema uma vez que são ajustes pequenos, mas alterar demais esse espaçamento pode levar a resultados não muito desejáveis no total do projeto e até dificultar a legibilidade.
Em geral deixar o tracking no formato padrão será o mais legível se considerarmos que a fonte foi criada com esse intuito em mente. Se estiver usando uma fonte para um título uma prática não tão incomum é reduzir um pouco esse espaçamento para dar mais impacto, mas também é importante tomar cuidado para não reduzir demais e também dificultar a leitura.
Em geral aqui o cuidado é não exagerar na hora de brincar com o espaçemento.
Confusão entre tracking e kerning
Falamos agora acima sobre o tracking, mas existe um outro termo que é bem similar e nem sempre é claro para designers que são diferentes e até mesmo que existem.
O tracking lida com o espaçamento entre os caracteres de uma palavra inteira ou frases inteiras. Já o kerning é um ajuste do espaço entre dois únicos caracteres.
O kerning pode ser usado, por exemplo, na junção entre as letras W e A uma vez que juntas parece que ficam muito perto uma da outra por causa da angulatura.
Com o conhecimento dessa possibilidade uma coisa que pode gerar um problema é empolgar com esses ajustes e querer usar o kerning em todo lugar. Se isso é feito é bem provável que terá um texto não muito balanceado e vai acabar ficando estranho dependendo da perspectiva, distância ou intenção.
Fontes, fontes e mais fontes
Algo que muitos designers ou entusiastas fazem, especialmente quando no início da prática, é querer adicionar várias fontes e pesos de fontes em um projeto. Uma boa sugestão é limitar a quantidade em até no máximo 3 fontes diferentes.
Naturalmente há momentos que teremos que utilizar mais de três, mas é importante sempre ter em mente que a mudança de tipos fará com que o usuário fique um tanto quanto confuso e às vezes não vale a pena.
O mesmo pensamento pode ser aplicado em relação à quantidade de pesos de uma fonte. Aqui não é tão marcante para o leitor em geral, mas é algo a se ter cuidado. Para a criação de logotipos então é bem interessante ser focado e entender as tendências.
Linhas largas demais
Mais uma vez aqui é uma questão importante para a legibilidade. Quando colocamos linhas muito longas em um texto é bastante complicado para o leitor acompanhar o texto na troca de uma linha para a próxima.
Aproveitando boas práticas de jornais e web, é interessante manter a largura da linha em no máximo 75 caracteres. Naturalmente tem hora que é difícil manter esse número e é preciso extender um pouco, mas seguir essa recomendação ajudará na legibilidade.
Contraste com o fundo
Seja para a web ou impressão, algo que todo designer tem que ficar atento é no contraste entre o texto e seu fundo. Às vezes até da cor do texto e elementos ao seu redor.
É preciso ter uma atenção especial com as cores do texto e evitar que seja uma cor parecida demais com o seu fundo. Um bom contraste traz uma sensação de calma para a leitura pela sua clara distinção. Já um texto que possui uma cor similar ao fundo gera ansiedade pela falta de condições da compreensão.
A resolução desse problema não é difícil ou tão técnica como algumas que já comentamos aqui. Contudo vejo que é algo que constantemente temos dificuldades em páginas na web, rótulo de produtos ou revistas.
Recentemente fui ao supermercado com um amigo e quando vi estava ele colocando o rótulo de um produto quase enconstado nos olhos para tentar ler um texto da tabela nutricional. O texto estava num tamanho razoável, mas o designer buscou deixar a tabela mais bonita e adicionou listras amarelas e brancas alternando para cada linha dessa tabela. O problema foi que não deve ter notado que a cor da fonte era uma outra tonalidade de amarelo e ficou realmente muito difícil de ler.
Centralizando os textos
Algo que acaba sendo ponto de discussão entre designers e clientes é que designers em geral falam que não é para centralizar textos. Não que seja uma regra universal, mas vejo que quanto mais experiência um designer possui, menos textos são centralizados.
Acho que iniciantes e leigos vêem no texto centralizado uma noção de equilíbrio e simetria. Contudo esse é um erro bastante crítico pois o texto centralizado é mais difícil de ler, especialmente em passagens mais longas.
Por outro lado, assimetria traz um universo de possibilidades para trabalhar a melhor forma de organizar o conteúdo. Pode-se até justificar os textos quando se necessita de um bloco único.
Dois espaços depois do ponto final
Na época da máquina de escrever adicionar dois espaços após o ponto final era uma prática um tanto quanto comum para evitar que o dígito seguinte ficasse muito perto do ponto final. Contudo, atualmente os softwares de escrita já sabem que é preciso um respiro ao final das frases.
Esse último está cada vez menos utilizado, mas se você tem um time de redatores mais antigo, pode ser que seja uma boa dica para passar para eles ou elas para que seu trabalho fique mais agradável.
Texto justificado na Web
Esse aqui é mais direcionado ao público que está criando designs para a web e é algo que eu constantemente converso com meus clientes. Podemos referenciar vários estudos em cima desse tópico, mas esse artigo acredito que explica de uma forma legal.
Para resumir, várias pesquisas já foram feitas na web com porcentagens de leitura de textos em blogs e outros tipos de websites para determinar o melhor formato de organizar os textos.
Acho que para finalizar é interessante colocar que todos esses problemas são percepções do que ajuda na legibilidade e melhor experiência das pessoas que estão apreciando, consumindo ou buscando entendimento a partir do texto.
Problemas de tipografia são, também, totalmente dependentes de fatores culturais, geográficos e temporais. Então pode ser que um monge na China daqui a 30 anos terá uma percepção muito diferente de um jovem brasileiro hoje.
Se você gostou, aproveita para comentar abaixo e compartilhar com quem acha que pode curtir também.
Divirta-se!
