Guia tipogrรกfico Para iniciantes em Design
Voltar para o Sumรกrio
Q E s f P jA g n b E s f P jA dk k M H d k l p d k M H C C g n b E s Qj b g n f P A p k kl pd l k M H Cd
Guia de Tipografia
Henrique Gamborgi Menezes (18101764) Joanna Mayr de Athayde (18101765) Tipografia Aplicada EGR7139-04454 (20192) Profª Mary Vonni Meürer de Lima Universidade Federal de Santa Catarina 2019.
Sumário
Introdução CAPÍTULO I
CAPÍTULO III
Aspectos Técnicos Anatomia Kerning Entrelinhas Variações de peso Famílias
CAPÍTULO II
4
5 6 6 7 7
História e Adequação Comunicação e Linguagem Classificação Adequação, expressão e emoção
8 9 10
Aplicação Legibilidade e Leiturabilidade Contrastes Hierarquia tipográfica Combinação de Tipos
CAPÍTULO IV
11 11 12 13
Reprodução e Cuidados Produção Gráfica Web Licenciamento
14 15 16
Referências
17
Olá! O
cenário cotidiano, no qual a tipografia desempenha seu principal papel, é invisível, permanece oculto enquanto a informação se transmite de forma eficaz. por um lado as convenções básicas da tipografia se aprendem na escola, não acontece o mesmo com os princípios elementares da linguagem visual, e a maioria daqueles que se deparam pela primeira vez com a tarefa de desenhar um poster ou um folheto descobre (em geral com surpresa) que nem eles próprios nem o seu computador são capazes de transmitir a mensagem tal e como pretendiam. Dessa forma, bons designers devem no mínimo conhecer e entender como utilizar boas tipografias, elementos que aprimoram seu design e reforçam suas mensagens. Este livro tem como intuito auxiliar no desenvolvimento acadêmico e profissional de estudantes recém-ingressados no ambiente de Design. O projeto tem o propósito de servir como um guia de consulta rápida, porém bem embasadas, que contemple as dúvidas e necessidades do público.
[4]
Introdução
Voltar para o Sumário
Anatomia
[5]
Aspectos Técnicos
Voltar para o Sumário
Kerning
É
chamado de kerning o espaço entre duas letras em uma mesma palavra. Algumas combinações de pares de letras tem pouco ou muito espaço entre elas, o que pode dificultar a leitura do texto. Esse problema pode ser reduzido com o kerning, adicionando ou removendo os espaços entre as letras. Não confundir com espaçamento/espaçamento/tracking,que é a distância padrão entre os caracteres. Tanto o kerning quanto o tracking são definidos pelo typedesigner mas podem ser ajustados pelo usuário ao utilizar a fonte.
Entrelinhas
A
distância da linha de base de uma linha tipográfica para outra é o que chamamos de entrelinha, do inglês, leading. Ao passo que aumentamos a entrelinha, o bloco de texto se torna mais aberto e leve. Deve-se tomar cuidado para não aumentar demais, pois senão as linhas tornam-se elementos individuais, desprendendo-se do bloco. Isso prejudica a legibilidade pois, após a leitura de uma linha, o olho humano demora mais tempo para achar o início da linha abaixo. Assim como espaçamentos muito grandes, a entrelinha negativa também prejudica a legibilidade, pois a linha da descendente das letras de cima colide com a linha da ascendente das letras de baixo, tornando-se um bloco sólido demais e um emaranhado de letras.
Espaço individual entre letras e caracteres
Espaço entre a palavra inteira
[6]
Aspectos Técnicos
Voltar para o Sumário
Variações de Peso
Famílias
O
C
peso de uma fonte refere-se à espessura dos traços. A maioria das famílias de tipos é desenhada com vários pesos como regular, bold negrito) e as vezes light..
onjunto de caracteres que possuem as mesmas características fundamentais, com variações de espessura, peso, inclinação, etc. (GRUSZYNSKI, 2008)
Seguem alguns exemplos de variação de peso na font Poppins:
[7]
Aspectos Técnicos
Voltar para o Sumário
Comunicação e Linguagem
É
difícil tentar imaginar a existência e relacionamentos humanos anteriormente à comunicação oral e escrita. A introdução da escrita permitiu que essas culturas rapidamente desenvolvessem organizações sociopolíticas mais complexas e organizadas, permitindo o registro de códigos de leis, história, literatura, medicina, ciências e práticas religiosas. Os livros tornaram-se mais baratos durante a Idade Média, época em que foi descoberto que o papel poderia ser fabricado com trapos de panos e fibras de plantas. O baixo custo do papel permitiu a produção mais rápida e econômica de livros.
pendentes de patrocinadores ricos, e procuravam ampliar sua prática desenvolvendo diferentes habilidades para atender à demanda. O desenho de tipos passou a ser considerado uma arte tão importante quando desenhar ou escrever poesias. Os artistas muitas vezes trabalhavam em mídias diferentes, criando xilogravuras para impressão, além de pinturas, desenhos e esculturas. O tipo é visto como uma forma adicional de expressão artística, não se separando das artes gráficas e práticas do design gráfico até hoje. Com o tempo e desenvolver de estudos e tecnologias, a aplicação da tipografia mudou seu uso predominantemente de tipos para livros pra o crescente uso de faces decorativas ou de formato display (especiais para títulos) nos mais variados materiais de leitura e promocionais.
Pictogramas Ideografias
O aperfeiçoamento da prensa de imprimir, a inovação do tipo móvel (letras individuais, reutilizáveis, fundidas em metal ou gravadas em madeira) que também permitiu o aumento na produção de livros. A brilhante inovação de Gutenberg era a produção de caracteres individualizados e reutilizáveis em vez de fundir a página inteira em uma única peça sólida. Muitos historiadores consideram a oficina de Gutenberg como um dos primeiros exemplos da produção em linha de montagem.
Hieróglifos Fenícios Gregos Romanos
Nos anos 1500, durante a Renascença europeia, o design de livros e tipos evoluíram como uma área formal de estudo. Os pintores e escultores eram de-
[8]
História e Adequação
Voltar para o Sumário
Classificação
A
o longo dos inúmeros anos de existência e estudo da tipografia, o número de estilos criados cresceu de tal maneira que exigiu dos historiadores desta área instrumentos de reconhecimento para as características formais das faces de tipo. Muitas vezes, as letras têm seu uso prático, parte de sua personalidade é expressa em suas características visuais, ganhando ou perdendo sentido, dependendo da maneira como são aplicadas no material.
• Script/cursivas: São fontes que procuram assemelhar com a letra escrita por mãos humanas. Geralmente elas são mais trabalhadas e com mais ornamentos, seu uso geralmente está atrelado à sofisticação, pessoalidade ou intimidade. Pelo seu grau de detalhamento, não são aconselhados para textos longos. • Decorativas: As características mais importantes de uma fonte decorativa são a temática e personalidade, expressadas pela maneira com que o tipo é desenhado e aplicado.
• Sans serif/sem serifa: No começo, eram utilizadas em corpos grandes e se destinavam para confecção de cartazes e a outras utilizações de textos curtos, e não a texto corrido. Além da ausência de serifas, outra característica das primeiras sans serif foi a ausência ou pouca modulação no peso das hastes • Com serifa: Fontes com serifas possuem pequenos traços aplicados nas extremidades das letras – é importante notar que existem diversos tipos de serifas. Além do caráter ornamental e estético, a serifa tem aspectos funcionais importantes que guia os olhos do leitor, formando um corredor que isola as linhas durante a leitura.
[9]
História e Adequação
Voltar para o Sumário
Adequação, expressão e emoção
E
m um mundo onde somos constantemente bombardeados com mensagens que não pedimos para receber, a tipografia precisa frequentemente dar destaque para si própria antes de ser de fato lida. Os princípios seguidos para selecionar uma fonte devem estar refletidos também no conteúdo — o contrário também é válido, escolher uma tipografia depende profundamente do tema da peça. No entanto, o riso, a graça e a alegria, assim como a própria legibilidade, se alimentam de significado, e o significado geralmente é provido pelo escritor, pelas palavras e pelo assunto, não pelo tipógrafo (BRINGHURST, 2018). Nossa experiência ensina que o que temos a dizer fica mais fácil de ser compreendido se utilizado a linguagem, voz ou tom correto, os tipos não são diferentes, são esses símbolos que ligam o autor ao leitor. Além disso, também têm seus usos práticos, podem refletir temas e expressar emoções ou personalidade — inclusive nas suas características físicas: leve ou pesada, arredondada ou quadrada, alongada ou achatada.
sentimentos agradáveis são mais bem representados por caractéres leves e informais. Conseguir encontrar um equivalente tipográfico para determinadas emoções ou personalidades pode ser um trabalho bastante difícil. Pode ser pontualmente complicado encontrar uma maioria que concorde com o tipo certo para expressar algo tão subjetivo, mas essa incerteza e espontaneidade definirão a casualidade da fonte escolhida. Os textos também podem ser usados para comuicações comerciais e promocionais de vários tipos, portanto devem obedecer princípios dentro do mundo corporativo. Geralmente, é bastante simples identificar um negócio ou serviço em particular simplesmente pelas tipografias que escolhe: quanto mais técnica for uma profissão mais frios e rígidos serão seus tipos e mais clássico para negócios mais tradicionais.
« As letras podem ganhar sentido quando próximas umas das outras, como soldados, ou podem dançar graciosamente numa linha » SPIEKERMANN, 2011.
Emoções sombrias pedem uma fonte negra e pesada, com cantos afiados;
[ 10 ]
História e Adequação
Voltar para o Sumário
Legibilidade e Leiturabilidade
A
maioria dos tipos bem construídos são considerados legíveis, porém isto não é o suficiente para considerar uma fonte apropriada para o uso em textos extensos, necessita-se de uma espécie de harmonia entre as letras, para que o cérebro consiga captar e processar as informações enxergadas. Caso contrário, a leitura perde o dinamismo e se torna lenta, exaustiva e difícil. Ao serem postas juntas, com o intuito de formar um corpo de texto longo, alguns princípios devem ser levados em consideração para manter o conteúdo confortável, fluído e aceitável para a leitura do usuário. Legibilidade se baseia em quão fácil um caractere se distingue dos outros, ponto importante quando o leitor procura por pontos específicos de informação. Já leiturabilidade diz respeito à qualidade do conforto visual — a facilidade com que o leitor capta a mensagem e move seus olhos ao longo das linhas. Este requisito é especialmente importante quando se trata de textos longos e projetos editoriais.
[ 11 ]
Aplicação
Contrates
É
extremamente crítico selecionar e testar bem as fontes que serão aplicadas em conjunto com cores. Contraste de cor é um princípio de acessibilidade muitas vezes desconsiderado ou utilizado de maneira errônea. Dependendo dos tons aplicados, usuários daltônicos ou com baixa visão podem notar dificuldades em manter a leitura de um texto com conforto. Dependendo dos tons, qualquer usuário pode notar dificuldade até mesmo em identificar tipos. Por exemplo, aplicar um texto em cinza claro em um fundo branco dificulta a capacidade do usuário de distinguir as formas, o que reduz a compreensão e velocidade de leitura. Estabelecer paletas cromáticas antes do início de um projeto pode ser uma boa opção para auxiliar com o contraste, assim como escolher cores adicionais ou secundárias para destaques, ênfases ou outras eventuais necessidades. Textos escuros em fundos claros costumam funcionar com a maioria dos usuários — o mesmo acontece para textos claros em fundos escuros. Outra alternativa interessante é testar diferentes opacidades para preto e branco.
Voltar para o Sumário
Hierarquia Tipográfica
S
aber a maneira correta de usar a hierarquia tipográfica em uma peça lhe permite conduzir a visão e interesse do leitor por um caminho pré-determinado, nós esperamos que corpos de texto sejam aplicados em uma fonte que conhecemos de algum livro ou revista, enquanto manchetes de propaganda necessitam ser simples e chamativas. Tópicos que precisam ser compreendidos primeiro devem estar elencados de maneira que recebam destaque. Sendo assim, informações vitais como títulos devem ser legíveis sob as mais adversas condições (pressa, luz, etc), para que não haja confusão entre letras e números. Talvez não precisemos soletrar cada letra na capa da The Guardian para reconhecer, ao invés de ler, porém misturar informações vitais pode ter consequências devastadoras na compreensão.
[ 12 ]
Aplicação
Voltar para o Sumário
Combinação de Tipos
A
ntigamente, o mercado tipográfico era voltado para a produção de livros, exigindo, portanto, pouca variedade de tipos. Com a Revolução Industrial e a entrada da Era da Propaganda, as fontes começaram a ser utilizadas em conjunto, aproveitando ainda das inúmeras variações dentro de uma mesma família (como postura, largura e altura). Uma boa ideia é combinar fontes display ou variações de uma mesma família que reforcem a estrutura do texto, mas cuidado, o contraste deve ser bastante evidente, o leitor deve saber sempre quando o texto que está lendo mudar de aparência. As combinações clássicas são entre serifadas e não serifadas. Porém, nem sempre se aplicam bem em tudo, nenhuma é boa companheira para qualquer das outras porque cada uma delas se baseia em um conceito diferente a respeito daquilo que constitui a forma de um tipo. Sendo assim, é preciso que o tipógrafo aproveite, explore e teste ao máximo suas virtudes, não importa quão limitada elas pareçam ser.
[ 13 ]
Aplicação
Times new roman Times new roman itálico Poppins light & bold Helvetica Neue Adelle Light Franklin Gothic Heavy Gill Sans Cooper Black Officina Display
Voltar para o Sumário
Produção Gráfica
O
suporte impresso exige ainda mais cuidado, pois a fonte pode variar dependendo do tipo do papel e a sua grossura, causando problemas de legibilidade. O ideal é imprimir uma folha com algumas opções de fontes e verificar aquela que se comporta melhor. Assim, defina um bloco de texto com parágrafos, variações de tamanho, estilo e cores que permitam verificar variações de contraste. Aplique as fontes que você quer testar. Monte uma página de teste. Imprima em diferentes tipos de papel, de acordo com as predefinições do seu projeto. Procure fazer os testes utilizando processos de impressão com qualidade equivalente.
?
Se a publicação será impressa em offset, com ótima qualidade, não faça os testes em uma impressora digital de baixa resolução. Você pode considerar que a fonte não tem qualidade adequada quando na verdade o problema está na falta de qualidade da impressora.
[ 14 ]
Reprodução e Cuidados
Voltar para o Sumário
Web
L
eve em consideração o local em que seu texto se apresentará. Por mais que você esteja projetando para web vale a pena lembrar que geralmente estamos projetando tanto para desktop quanto para qualquer dispositivo mobile. Na hora de escolher a fonte se pergunte se a espessura de contraste da sua fonte, a sua altura de x, seus pesos e serifas funcionariam bem na tela de um celular ou se só de adaptam em um monitor grande. Segundo GUERRATO (2012), quando pensamos em fontes para corpo de texto no desktop esse tamanho deve ser de 16px e este não é um número aleatório. Para entendermos melhor, precisamos lembrar que quando lemos um livro seguramos o papel a uma distância bem próxima dos olhos. Mas quando mexemos em um computador a distância em relação a tela é muito maior. Para mobile a distância da pessoa com o celular pode variar dependendo do usuário, então o recomendável é sempre começar a definir o tamanho a partir dos 12px, pois a legibilidade é garantida. GUERRATO (2012) diz que “No geral, quanto maior a distância do leitor em relação ao meio, maior deverá ser o tamanho da letra”. Para títulos não existe uma regra, mas por questão de hierarquia visual o recomendado é que eles sejam maiores que o corpo de texto.
[ 15 ]
Reprodução e Cuidados
Voltar para o Sumário
Licenciamento de Fontes
A
ntes de iniciar qualquer processo de seleção de uma fonte, é necessário compreender que cada uma possui um tipo de licença que determina o que você pode ou não fazer com ela. Na hora da seleção, devem ser considerados fatores como: você está disposto a pagar pelo uso da fonte ou precisa que ela seja gratuita? Essa fonte será usada futuramente para um fim comercial ou é para um projeto sem lucros? Geralmente as licenças são divididas em: uso pessoal, educacional e comercial, então é de suma importância que você saiba a finalidade do seu projeto desde agora. Mas mesmo com fontes não pagas você precisa ter cuidado! Não significa que só porque a fonte é gratuita que você pode fazer o que quiser com ela. Algumas licenças (mesmo que de fontes gratuitas) impedem que você faça qualquer tipo de alteração na fonte, que distribua ela sem permissão ou que utilize em elementos específicos do seu layout. Por isso, é sempre bom ler os fatores de licenciamento da fonte antes de escolhê-la. Se você não está disposto a pagar por uma fonte, veja a seguir a lista de alguns sites indicados por KLIEVER (2018) que possuem fontes gratuitas.
[ 16 ]
Reprodução e Cuidados
Embora existam muitas fontes gratuitas disponíveis além das que já fazem parte dos sistemas operacionais, uma fonte paga pode ser mais adequada para atender a uma demanda. Antes de optar por determinada fonte é preciso verificar além do preço, suas regras de uso e o número de licenças necessárias para que toda a equipe envolvida possa ter acesso a fonte durante o desenvolvimento do projeto, se for o caso. As regras de uso de uma fonte geralmente ficam definidas em um documento chamado EULA – End User License Agreement (Contrato de Licença de Usuário Final) que em geral determina que o arquivo não pode ser alterado nem compartilhado. É importante observar: Em quantos computadores é possível instalar a fonte. Se o usuário tem permissão para fazer mudanças no arquivo. Se poderá redistribuir ou incorporar a fonte, para enviar ao bureau de impressão, por exemplo.
Voltar para o Sumário
Referências BRINGHURST, Robert. Elementos do estilo tipográfico. São Paulo: Ubu Editora, 2018. 445 p.
SPIEKERMANN, Erik. A linguagem invisível da Tipografia: escolher, combinar e expressar com tipos. São Paulo: Blucher, 2011. 191 p.
CASTRO, Luciano Patrício Souza de; SOUSA, Richard Perassi Luiz de. Estruturação de projetos gráficos: a tipografia como base do planejamento. Curitiba: Appris, 2018. 154 p.
Slides apresentados na disciplina de Tipografia Aplicada da professora Mary Vonni na Universidade Federal de Santa Catarina.v
CLAIR, Kate; BUSIC-SNYDER, Cynthia. Manual de Tipografia: A História, a Técnica e a Arte. Nova Iorque: Bookman, 2009. 400 p. FERLAUTO, Claudio. O Tipo da Gráfica: uma continuação. Rosari, 2002. 132 p. GUERRATO, Dani. Um guia completo de tipografia para a web. Disponível em:<<https://tableless.com.br/um-guia-completo-detipografia-para-a-web>> KLIEVER, Janie. Fontes. Disponível em:<<https://www.canva.com/pt_ br/aprenda/fontes-design/>> Acesso em: 27 de novembro de 2019. ROCHA, Claudio. Projeto Tipográfico: análise e produção de fontes digitais. São Paulo: Rosari, 2005.
[ 17 ]
Referências
Voltar para o Sumário