Guia Tipográfico by Cintia Marques

SUMÁRIO

05.

09.

História da tipografia

Anatomia e terminologia

21.

29.

Letra

Classificação

47.

59.

Texto

Fontes usadas no guia

63. Referências 3

HISTÃ&#x201C;RIA DA TIPOGRAFIA 5

Até o começo do século XV os livros eram produzidos individualmente através da escrita caligráfica e reproduzidos com o auxílio de copistas. Eram objetos raros e caros, destinados aos poucos letrados do mundo. Já existiam algumas técnicas relacionadas e impressos, mas ninguém ainda havia planejado um sistema que permitisse industrializar a produção por completo. Por volta de 1450 o impressos alemão Johannes Gutenberg realizou essa tarefa. Gutenberg não inventou a imprensa, todas as tecnologias de impressão já existiam. O que Gutenberg e seus sócios fizeram foi aperfeiçoar um sistema de impressão ainda muito precário, tornando-o uma cadeia de produção mais eficiente - o que deu novo impulso a produção de livros e outros impressos. A tipografia mecânica vivenciou cerca de 500 anos de evolução tecnológica contínua. Antes de migrar para o ambiente tecnológico digital, a tipografia experimentou o interlúdio tecnológico da fotocomposição. A fotocomposição, sistema criado na década de 1950, substituiu os tipos fundidos por matrizes planas gravadas em filmes de acetato, facilitando a criação, modificação e o transporte de fontes. O surgimento do novo complexo tecnológico digital exigiu um período de transição, e as primeiras fontes digitais caracterizaram-se pela baixa qualidade de renderização em tela. As letras eram construídas por pontos (pixels) acesos ou apagados. No começo dos anos 80 surge o formato PostScript e as fontes passam a ser definidas por linhas de contorno escaláveis. Nesse formato as letras são construídas a partir de descrições matemáticas chamadas curvas de Bézier. Atualmente o vetor matemático e a substância da tipografia, e as fontes digitais funcionam como pequenos softwares.

ANATOMIA E TERMINOLOGIA 9

Perceber os fundamentos da tipografia também implica aprender as suas terminologias, a sua anatomia e a sua arquitectura. Este subcapítulo tem como objectivo sintetizar este processo de aprendizagem, clarificar alguns termos que são usados ao longo deste documento e realçar a importância dos detalhes na tipografia. “Typography in Western culture happens simultaneously on two visual levels. The macro level of overall composition guides our eyes around the format, and the micro level of minute details provides the basis for how we perceive the big picture.” (Samara, 2004: 15). Tal como Samara refere, a cultura ocidental vê a tipografia de duas formas em simultâneo: macro — olhar atento à composição global — e micro — olhar focado nos detalhes que nos permitem perceber como é a base daquilo que observamos na imagem geral. “Ser capaz de reconhecer pequenas diferenças no desenho das letras ajuda os designers a perceber o que faz com que a letra se comporte de determinada maneira.” (Samara, 2004: 15).

TIPO

CARACTERE

Refere-se a configuração visual, ao desenho das letras propriamente.

São os símbolos que correspondem a letra no sistema Unicode.

FONTE

GLIFO

Dispositivo de saída ou software que permite a instalação e a utilização dos tipos. Conjunto completo de caracteres, com letras, números e sinais.

Desenho específico de cada caractere, ou seja, as variações de um mesmo caractere, por exemplo o a, que pode ter vários glifos diferentes.

FAMÍLIA Conjunto de fontes que possuem as mesmas características fundamentais, mas com variações de espessura, peso, inclinação, etc.

tipo

caractere

L ato Regular 123. otf L ato Bold 123 L ato Black Italic 123 glifo

fonte

família

ARQUITETURA DA TIPOGRAFIA

ESPAÇAMENTO

A arquitectura da tipografia é um fator importante para que haja coerência dentro da grande diversidade de tipos de letra existentes. Ela é a base de todos os tipos de letra.

Consiste na distância vertical de uma linha base para a outra em pontos.

ASCENDENTE E DESCENDENTE Ascendente é a parte da letra que vai além da linha mediana, podendo ou não coincidir com a altura da versal. Descendente é a parte da letra que se extende abaixo da linha de base.

Linha da ascendente Linha da caixa-alta Linha média Altura x Linha de base Linha da descendente

ALTURA X É a distância desde a linha de base até à linha intermédia, ou, normalmente, até ao topo da letra x. A altura-x permite perceber o tamanho do tipo de letra.

Nfp

Ascendente

Descendente

“Todos os tipos de letra (atenção para a grande diversidade existente) compartilham partes anatómicas, entre outros detalhes. Portanto existem termos específicos que os designers usam para os identificar. E, apesar das várias alterações que a era digital trouxe a este sector, uma serifa é sempre uma serifa quer em formato digital, quer impressa.”

“Ser capaz de reconhecer pequenas diferenças no desenho das letras ajuda os designers a perceber o que faz com que a letra se comporte de determinada maneira.” (Samara, 2004: 15)

(Cullen, 2012: 32)

BOJOS/BARRIGA Traços curvos que determinam um espaço fechado ou semiaberto de uma letra

OLHOS/ESPAÇO INTERNO

ÁPICE

Espaço fechado dentro da letra

Ligação entre dois traços diagonais

HASTES Traço vertical

SERIFA

ESPORA

Pé em ângulo reto ou oblíquo na extremidade

Traço que articula a junção de um traço curso e um retilíneo

BARRAS Traço horizontal

ASCENDENTE

DIAGONAIS

Traço que avança a altura x

Traço diagonal

HaMbuRgevons VERTICE Ligação entre dois traços diagonais

PERNAS Traços diagonais em direção a linha de base

CAUDAS Traços sinuosos em direção ou abaixo da linha de base

ESPINHA Haste curva da letra S

TERMINAIS São as formas encontradas no final das letras a, c, f, j, r, s e y e possuem 4 principais variações.

Serifa em bola ou botão

Serifa em lágrima ou gota

Serifa em bico ou afiada

Terminal ausente

SERIFAS Traço adicionado ao início ou ao fim dos traços principais de uma letra. Existem diversas classificações de serifas, abaixo esão as principais.

Serifa bilateral, adnata (nasce juntos ao traço) e reflexiva (que retrocede sobre si mesma)

Serifa bilateral abrupta (tangendia a haste)e retangular (espessura próxima da haste)

Serifa unilateral, adnata e transitiva (acompanha a direção da escrita)

Estilo antigo

Transicional

Moderna

Quadrada

aprox. 1475

aprox. 1750

aprox. 1775

aprox. 1825

EIXO É o ângulo de inclinação característico das letras b, c, e, g, o, p e q. Sua classificação só pode ser feita quando a fonte é modulada, ou seja, existe variação no traço (contraste).

Traço modulado (variação na espessura ou contraste) e eixo vertical ou racinalista

Traço modulado (variação na espessura ou contraste) e eixo humanista ou oblíquo

Traço não-modulado (constrate inperceptível), ausência de eixo ou eixo vertical presumido

KERNING Ocorre quando parte de uma letra avança sobre o espaço de outra, invadindo a área do corpo. Esse recurso é essencial para garantir a leitura de alguns pares específicos de letras.

Com kerning

Sem kerning

Tanto o kerning quanto o tracking são definidos pelo typedesigner mas podem ser ajustados pelo designer ao usar a fonte.

LETRA 21

“Um tipo de letra completo é mais do que um conjunto de 26 letras, 10 algarismos e “meia dúzia” de sinais de pontuação. Para fazermos um bom uso de um tipo de letra também temos de o conhecer e saber o que ele nos oferece”. (Kane, 2002: 5). “A caixa-baixa, para além das minúsculas das letras apresentadas na caixa alta, inclui ainda ligaduras para fi, fl,ff, ffi,ffl e ainda o duplo ‘s’ germânico ‘esset’. A caixa alta, por norma, incluí não só as letras maiúsculas como certas vogais acentuadas, o ‘c’ de cedilha e o n com til ‘ñ’”. (Kane, 2002: 5).

PESOS Os pesos são as diferentes espessuras que podem ser aplicadas ao tipo. Os pesos são recursos usados para determinar hierarquia e para ajustar a legibilidade do texto.

Família Lato

Aa Aa Aa Aa Aa Hairline

Light

Regular

Bold

As família tipográficas apresentam variações em relação ao peso, largura e inclinação. Acima pomos observar a variação de peso da família da tipografia Lato.

Black

CORPO O corpo é o tamanho do tipo. Este tamanho é a distância entre a base da descendente até o topo da ascendente ou maiúscula (versal), com um acréscimo de um espaço.

Aa Bb Cc Dd Ee

Aa Bb Cc Dd Ee 25

NUMERAIS Podem estar todos alinhados à linha de base (Lining Figures) ou não (Non-lining Figures). Podem ser algarismos com diferentes larguras e tamanhos conforme o algarismo ou podem ser algarismos mono-espaçados.

LINING São numerais do mesmo tamanho da maiúscula, ou versal. Não possuem ascendentes e descendentes.

ABC 1234567890 OLD STYLE São os numerais alinhados pelo texto. Por isso eles ultrapassam a linha de x e possuem ascendentes e descendentes

ABC 1234567890 26

LIGATURA São a junção de duas ou mais letras de uma mesma fonte, formando uma espécie de conexão. No português, a ligadura mais comum é a das letras FI (ﬁ), porém, pode-se destacar o uso da mesma nas letras (ST, AE, OE, FF, IJ) entre outras.

Com ligatura

Sem ligatura

As ligaturas remontam às letras romanas. Em Roma, era muito frequente usar as ligaturas. Elas facilitam a leitura. 27

CLASSIFICAÇÃO 29

Num artigo para a Visible Language em 1971, Walter Tracy defende que a classificação na tipografia é tão necessária como em botânica ou qualquer outra área. Tracy acrescenta ainda que no início do século xix, a extensa variedade do desenho dos tipos de letra obrigou os tipógrafos e escribas a identificar conjuntos de tipos de letras mais específicos, dando-lhe determinada designação (Golbert, 2000). Os tipos de letra não tinham um nome concreto. Os impressores nomeavam-nos segundo o seu tamanho; na realidade eram nomes como “Paragon”, “Great Primer”, “Nonpa- reille”. Caso o impressor tivesse disponível mais do que uma versão de um tipo de letra romano, eram-lhe atribuídos diferentes números, por exemplo “Great Primer No.2”. No entanto, com a revolução industrial surgiu o desejo de tipos de letra mais “ruídosos” e que chamassem mais à atenção. Nascem novos desenhos, inúmeras variações de estilo e novas oportunidades de trabalho na tipografia. Eis que se tornou necessário determinar termos para que se possa falar sobre eles. As foundrys inventam os seus próprios termos, de forma mais ou menos arbritária, atendendo aos novos estilos: “Egyptian”, “ Gothic” or “Grotesque” para os tipos de letra sem serifa, “Ionic” ou “Doric” ou “Antique” para as “slab serif”. Cada vez mais os tipos de letra se tornavam diferentes dos existentes e a terminologia usada revelou‑se disfuncional pois deixou de ser universalmente compreendida. Entretanto, estes termos passaram a ser determinados pelo marketing e não pelo estilo ou raízes históricas (2012). Mostraremos aqui a classificação que Stephen Coles propôs uma visão contemporânea, contemplando fontes serifadas e não serifadas.

SERIFA HUMANISTA

Centaur

Traço gradual com leve contraste; Eixo vertical inclinado; Serifa orgânica e gradual; Terminais caligráficos. 32

SERIFA TRANSICIONAL

Guia Tipográfico Baskerville

Traço gradual; Eixo vertical; Terminais arredondados; Serifas simétricas mais abruptas. 33

SERIFA RACIONALISTA

Guia Tipográfico e Bodoni

Eixo vertical; “e” na horizontal; Serifa fina; Terminais arredondados; Traço gradual e contrastante. 34

SERIFA CONTEMPORÂNEA

Maridien

Colunas largas; Serifa pesada, com transição angular; Detalhes angulados.

SEM SERIFA INCISA

Guia Tipográfico Baltra

Pouco contraste, com um traço pontiagudo e fino; Não apresenta serifas, mas seus pés são afunilados, dando impressão de uma linha imaginária na leitura; Sua forma larga e seus traços finos as tornam muito legíveis a qualquer corpo. 36

SEM SERIFA GROTESCA

Guia Tipogrรกfico Vectora

Leve contraste de traรงos; Terminais curvados; Eixo horizontal; Pequenas aberturas. 37

SEM SERIFA NEO-GROTESCA

Guia Tipográfico Helvetica

“g” aberto; “R” largo; Terminais retos; Formas arredondadas. 38

SEM SERIFA GEOMÉTRICA

Futura

Letras circulares; Sem contraste no traço; Curvas feitas a partir de semi-círculos.

SEM SERIFA HUMANISTA

Candara

Contraste do traço moderado; Característica de tipos caligráficos (pernas curvadas); “a” aberto.

SEM SERIFA NEO-HUMANISTA

Gill Sans

Estrutura humanista (pernas curvadas); Contraste do traรงo pequeno; Aberturas.

SERIFA QUADRADA GROTESCA

Caredon

Serifa abrupta; Cauda dobrada para cima; Terminal em bola; Eixo vertical com contraste moderado. 42

SERIFA QUADRADA GEOMÉTRICA

Memphis

Serifa abrupta; Formas redondas geométricas; Contraste mínimo.

SERIFA QUADRADA HUMANISTA

Henriqueta

Serifa abrupta; Pernas arredondadas; Contraste mÃnimo do eixo.

CALIGRร FICA

Actonia

Eixo levemente inclinado; Alto contraste no traรงo.

TEXTO 47

A principal função da tipografia é facilitar a leitura, tornando-a o mais natural e confortável possível. Legibilidade e Leiturabilidade são os termos usados para avaliar o emprego da tipografia no texto. Antes de escolher a tipografia ideial, é interessante e indispensável um bom briefing, que servirá de guia para o projeto e também dará a informação talvez mais importante: o público-alvo. Com o público-alvo bem claro, saberemos, entre outras coisas, a idade aproximada para quem a publicação se destinará. Isso será importante na hora de decidir não apenas a fonte mas também o tamanho ideal a ser utilizado. Pois nem sempre as publicações – por mais parecidas que sejam em termos de conteúdo – deverão utilizar os mesmos critérios de diagramação.

LEGIBILIDADE

A legibilidade é uma qualidade atribuída ao emprego do tipo em uma palavra. Um texto é legível quando os tipos podem ser facilmente identificados na página, além de serem discerníveis entre si, ou seja, possuirem características próprias os fazem diferentes um do outro ao primeiro olhar, como por exemplo: Hastes ascendentes e descendentes não muito curtas; Tamanho (corpo) do tipo favorável; Cor do tipo contrastante à cor da página; Altura x não muito pequena.

corpo

altura x

LEITURABILIDADE

Num aspecto mais amplo, refere-se ao emprego do tipo no texto. Ela depende de vários fatores, como por exemplo: Tipo de letra escolhido; Corpo da letra; Espaço entre letras e palavras; Comprimento das linhas de texto; Entrelinhamento; Composição de cores da página.

Não é recomendado usar a caixa alta para todo o texto. Isso compromete muito tanto a legibilidade quanto a leiturabilidade, por tornar todas as letras muito similares, sem a diferenciação das ascendentes e descendentes. Use a caixa alta somente para títulos e para iniciar a frase. Isso também vale para itálico e para tipografia manuscrita. Elas comprometem a leitura e devem ser usadas em momentos especiais, como um trecho do texto, título ou capitular.

NÃO É RECOMENDADO USAR CAIXA ALTA PARA TODO O TEXTO. ISSO COMPROMETE TANTO A LEGIBILIDADE, QUANTO A LEITURABILIDADE, POR TORNAR TODAS AS LETRAS MUITO SIMILARES, SEM A DIFERENCIAÇÃO DAS ASCENDENTES E DESCENDENTES. USE CAIXA ALTA SOMENTE PARA TÍTULOS E PARA INICIAR A FRASE. Isso também vale para itálico e tipografia manuscrita. Elas comprometem a leitura e devem ser usadas em momentos especiais, como um trecho do texto, título ou capitular.

ESPAÇAMENTO

Pensar no espaçamento entre as letras (kerning) e entre as palavras (trecking) é fundamental para garantir uma boa leitura do texto. Letras e palavras muito juntas e muito espaçadas confundem e cansam o olhar do leitor. Geralmente, as tipografias já possuem esse ajuste natural. Entretanto, quando o texto é alinhado dos dois lados, ou seja, justificado, esse espaçamento tende à aumentar. Nesse caso é necessário reduzir o trecking e o kerning e, se for o caso, hifenizar. As versões bold, semi bold e black exigem maior trecking e kerning.

U m t e x t o m u i t o e s p a ç a d o p o d e c a n s a r o o l h a r d o l e i t o r. O e s p a ç a m e n t o p o d e f u n c i o n a r p a r a p a l a v r a s o u p e q u e n a s f r a s e s . M u i t a s v e z e s , p o d e r e m e t e r à l i m p e z a , v a z i o , c a l m a e p a u s a . M a s , s e u s a d o e m t e x t o s l o n g o s , p o d e c a u s a r a d i s p e r s ã o d o l e i t o r.

Da mesma forma, um texto muito apertado pode confundir oleitor.Diferentedoespaçado,dificilmenteotextoapertado é utilizado. Somente para títulos, logos, de forma que a junçãopropositaldasletrasformeumdesenho.

ENTRELINHA

As entrelinhas influenciam, e muito, a leiturabilidade. Entrelinha é aquele espacinho entre a base de uma linha e a outra. Isso vai depender, principalmente, da largura da coluna, o que depende do tamanho e peso da tipografia, do trecking e do kerning. Estudos apontam que, quanto maior a entrelinha, maior a leiturabilidade. Mas não se deixe enganar. Entrelinha demais também deixa o olhar o leitor completamente perdido, e ele vai ter dificuldade de ler o texto.

A entrelinha nunca deve ser menor que o espaço entre as palavras. Quando isso acontece, o olhar do leitor tende a fluir pelos espaços das palavras. A variantes bold, semi-bold e black exigem maior espaçamento, e portanto, maior entrelinha. Normalmente, a entrelinha é igual ao corpo do texto, mais 2, 3 ou 4 pontos.

ALINHAMENTO

Alinhamento é o posicionamento do texto na coluna. Quando dispomos um texto em uma página, alinhá-lo à coluna é fundamental para guiar o olhar do leitor e facilitar sua leitura.

Justificado

Nesse alinhamento, todas as linhas possuem o mesmo comprimento, proporcionando um bloco de texto uniforme. Entretanto, para que isso ocorra, podem surgir grandes espaços entre as palavras. Uma alternativa é a hifenização e o ajuste do kerning. Mas lembre-se: as configurações de hifenização devem estar em português ou na língua do texto, e evite hifenizar várias linhas seguidas. Justificado com última linha a esquerda Assim como o justificado, nesse alinhamento todas as linhas possuem a mesma largura, menos a última delas, que pode ser alinhada a esquerda. Isso evita aqueles caminhos de rato pelo texto. À Esquerda Nesse alinhamento, todas as linhas possuem o mesmo comprimento, proporcionando um bloco de texto uniforme. Entretanto, para que isso ocorra, podem surgir grandes espaços entre as palavras. Uma alternativa é a hifenização e o ajuste do kerning. Mas lembre-se: as configurações de hifenização devem estar em português ou na língua do texto, e evite hifenizar várias linhas seguidas. Justificado com última linha a esquerda Assim como o justificado, nesse alinhamento todas as linhas possuem a mesma largura, menos a última delas, que pode ser alinhada a esquerda. Isso evita aqueles caminhos de rato pelo texto.

À Direita Nesse alinhamento, todas as linhas possuem o mesmo comprimento, proporcionando um bloco de texto uniforme. Entretanto, para que isso ocorra, podem surgir grandes espaços entre as palavras. Uma alternativa é a hifenização e o ajuste do kerning. Mas lembre-se: as configurações de hifenização devem estar em português ou na língua do texto, e evite hifenizar várias linhas seguidas. Justificado com última linha a esquerda Assim como o justificado, nesse alinhamento todas as linhas possuem a mesma largura, menos a última delas, que pode ser alinhada a esquerda. Isso evita aqueles caminhos de rato pelo texto.

CAPITULAR

s capitulares são aquelas letras maiores do que o normal, usadas para identificar o início do texto. Além disso, são usadas como uma forma de atrair o olhar do leitor para o texto. Geralmente, as capitulares são o equivalente à 3 linhas do corpo do texto, com a mesma tipografia. Mas você pode abusar da sua criatividade e criar capitulares que realmente chamem a atenção do leitor.

HIERARQUIA

Alinhamento é o posicionamento do texto na coluna. Quando dispomos um texto em uma página, alinhá-lo à coluna é fundamental para guiar o olhar do leitor e facilitar sua leitura.

A escolha tipográfica pode contribuir para eterminar a hierarquia dos textos na peça gráfica. Alterações como> variações da família tipográfica, cores, corpo, estilos, peso e largura podem ajudar a organizar o texto.

QUEM VOCÊ

Leu primeiro?

COMBINAÇÃO DE TIPOS

Em certas ocasiões, a hierarquia dos textos pode se dar com a variação das fontes. Combinar tipos não é uma tarefa fácil. Em um projeto gráfico com conceito pré-definidos, segui-los é fundamental para que haja uma harmonia final. As combinações mais tradicionais são de variações da família da fonte escolhida. Mas quando se quer combinar uma fonte sem serifa com outra com serifa, essa tarefa fica mais complicada ainda. E você pode até combinar duas fontes, ambas com serifa. Bom senso e muitos testes é o que o ajudará a tomar essa decisão, mas aqui vão algumas dicas para facilitar seu trabalho:

Utilize uma fonte com mais personalidade e a outra mais neutra, de forma que somente uma se sobressaia. Prefira a com personalidade para títulos e altere seu tamanho para destacá-la.

TIPOGRAFIA USADA NO GUIA 59

Lato

Aa Aa Aa Aa Aa 54 pt Black

Lato Black

29 pt Bold

Lato Regular

14 pt Regular

Lato é uma fonte sem serifa, criada por Lukasz Dziedzic no verão de 2010, na Polônia. Lato quer dizer “Verão” em polonês. A fonte possui uma família com 10 variações e está pronta para o uso em diversas línguas, cerca de 200, ao redor do mundo. Lato é uma fonte aberta e possui o suporte da Google.

Minion Pro Aa Aa Aa Aa Aa

54 pt Bold

Minion Pro Bold

29 pt Medium

Minion Pro Medium

14 pt Regular

Minion Pro é uma fonte Adobe criada em 1990 por Robert Slimbach, inspirada na Renascença. Foi criada para o uso em textos longos, mas possui um desenho detalhado, remetendo aos meios clássicos de criação de tipos. Seu nome vem do tradicional sistema de nomenclatura, utilizado para decodificar os tamanhos dos tipos. Minion era o nome utilizado para tipos com 7pts.

REFERÃ&#x160;NCIAS 63

COSTA, Cátia Alexandra Rodrigues. Organizador de Tipos de Letras. 2013. 216 f. Dissertação (Mestrado) - Curso de Design e Multimédia, Universidade de Coimbra, Coimbra, 2013. SPIEKERMANN, Erik. A linguagem invisível da tipografia: escolher, combinar e expressar com tipos. São Paulo: Blucher, 2011. ZAPATERRA, Yolanda. Design Editorial. São Paulo: Gustavo Gili, 2014. BRINGHURST, Robert. Elementos do Estilo Tipográfico. São Paulo: Cosac Naify, 2015. HIGHSMITH, Cyrus. Entre Parágrafos: fundamentos tipográficos. Brasília: Estereográfica, 2017. KANE, John. Manual dos Tipos. São Paulo: Gustavo Gili, 2012. LUPTON, Ellen. Pensar com Tipos. São Paulo: Cosac Naify, 2006. SALTZ, Ina. Design e Tipografia: 100 fundamentos do Design com Tipos. São Paulo: Blucher, 2010.

Universidade Federal de Santa Catarina Centro de Comunicação e Expressão EGR7139 - Tipografia Aplicada Trabalho Acadêmico - Guia Tipográfico Cíntia Marques - Maria Tereza Finotti