Advertisement
  1. Design & Illustration
  2. Techniques

Uma Introdução de 20 Minutos aos Princípios da Tipografia

Scroll to top
Read Time: 9 min

Portuguese (Português) translation by Ingrid Fornazari (you can also view the original English article)

A Tipografia desempenha um papel importante no design gráfico e pode ser uma das coisas mais difíceis de se acertar. Meu objetivo aqui é introduzir algumas das áreas mais básicas e mais comuns da tipografia que serão importantes para seus trabalhos de design.

Essa Postagem é o Dia 20 da nossa Sessão de Design Gráfico. Sessões Criativas

Uma Introdução Básica à Tipografia

TypographyTypographyTypography

A tipografia tem um grande papel no design gráfico e muitos designers tem muita paixão ou opinião sobre ela. Por essa razão é um tópico muito quente nos círculos de design.

Desenvolvendo suas próprias habilidades em tipografia vai levar tempo e pode ser uma das coisas mais difíceis de fazer certo. É melhor ter um entendimento sólido do básico assim que possível na sua carreira e educação. Entretanto, é uma assunto complexo com uma quantidade massiva de detalhes que não podem ser explicados em apenas um artigo. Então minha meta aqui é introduzir algumas das áreas mais básicas e comuns da tipografia que serão importantes para seu design.


Então o Que é Tipografia?

Tipografia é uma forma de arte que tem estado por aí há centenas de anos. Palavras e textos estão a nossa volta todo dia em quase tudo o que fazemos. Em cada pedaço de tipo que você vê, alguém considerou como as letras, sentenças e parágrafos iriam ficar de maneira que pudesse ser lido por nós, ou nos fizesse sentir de uma determinada maneira quando nós olhamos para ele. Algumas vezes é bem feito, outras não. Frequentemente somos nós designers gráficos, quem decidimos como vai ficar, nas nossas brochuras, nossos logotipos, nossos sites e por aí vai. Quanto melhores nós formos nisso, mais eficazes nossos designs serão. 

Uma boa tipografia vem de prestar atenção a pequenos detalhes e isso pode fazer a diferença entre o trabalho de design gráfico que é apenas aceitável ou realmente bom. Há mais nisso do que apenas escolher fontes e  fazer a cópia parecer boa, é também sobre tornar as coisas legíveis e de leitura agradável (algumas das funções mais básicas da tipografia) como também deixar os layouts bonitos de um modo estético.


Noções básicas de tipografia

A seguir temos uma explicação sobre as áreas mais comuns da tipografia.

Tipo ou fonte?

Vamos esclarecer isso de uma vez! Os designers com frequência não tem certeza da diferença entre esse dois, uma vez que ambos são termos usados para a mesma coia. Atualmente, tipo é uma família de fontes (tal como Helvética Regular, Helvética Itálica, Helvética Bold, Helvética Preta, etc) mas fonte é um peso ou um estilo dentro de uma família de fontes (por exemplo Helvética Regular).

Classificação de tipos

Há muitos tipos diferentes de classificações e subclassificações de tipos, mas os dois tipos mais comuns que você vai ouvir são: Serif (ou Serifa) - esses tipos são os mais tradicionais. Eles distinguem-se por uma linha curta ou traço de finalização no final no traço ou haste do caractere (mostrado  na diagrama de anatomia abaixo) e; Sans-serif (ou Sem-serifa), como o nome sugere são distinguidas pela ausêcia de qualquer Serifa. Elas só se tornaram populares no século 19 e são consideradas modernas como resultado.

ClassificationClassificationClassification

Anatomia

Essas são algumas partes básicas da anatomia dos caracteres da tipografia. Há muito mais (que você pode encontrar sobre isso no Fonts.com), mas pense, é melhor começar com pouco primeiro.

AnatomyAnatomyAnatomy

Glifos

O que são glifos? Muitos designer devem ter observado que agora há uma paleta de Glifos na maioria dos pacotes de software. A palavra se refere essencialmente a todos os caracteres disponíveis em uma fonte, de letras a números e todos os caracteres especiais.

Kerning and Tracking

Kerning é o ajuste do espaço entre dois caracteres individuais. Tracking entretanto, é o espaçamento entre um grupo de caracteres. Esses dois são confundidos com frequência, mas uma forma de lembrar é que Tracking soa como uma longa linha de trilhos de trem, por sua vez Kerning soa como Kerne, que é um objeto individual.

Alinhamento

Geralmente o texto deve ser alinhado à esquerda, simplesmente porque nós costumamos ler desse modo. Sem uma boa razão, considere centralizar ou alinhar a direita o texto apenas, se for uma pequena quantidade, tal como um título ou subtítulo. Também, justificar o texto (onde tem uma linha reta dos dois lados) deve ser usado com moderação. Parece bonito e legal em algumas situações, mas muito dele faz o layout parecer rígido. Além disso, justificar em um tamanho pequeno de coluna pode causar um espaçamento irregular entre as palavras como tentativa do software ajustar seu texto para caber no espaço.

Medida

Se refere ao comprimento das linhas de texto em um parágrafo ou coluna. A maioria das pessoas tende a se referira a isso como a largura da coluna, no entanto. A medida é uma coisa importante para se conseguir a tipografia correta, e pode ser crucial para leitura agradável do texto. Se a medida for muito grande o texto pode ficar difícil de ler já que o olho tem que se mover muito mais após cada linha. Se for muito estreita pode também ficar cansativo para o olho ler, já que ele tem que se mover constantemente para frente e para trás. Uma medida estreita também vai levar a muita hifenização.

Entrelinhamento

O espaçamento Vertical entre linhas é referido como entrelinhamento em tipografia e impressão, isso se deve aos velhos tempos da impressão e configuração dos blocos de tipos, tiras de entrelinha eram inseridas no meio das linhas de acordo com quanto espaço era exigido. O papel do entrelinhamento na tipografia é gerar espaço suficiente entre as linhas para deixar legível. Como todos os assuntos da tipografia, é o equilíbrio entre ler confortavelmente e um estilo estético.

Ligaduras 

Quando duas partes da anatomia dos caracteres, tanto se chocam, como parecem muito próximas, elas podem ser combinadas no que é chamado de Ligadura. Elas podem ser por razões funcionais ou decorativas dependendo de quão óbvio é o choque. Na maioria, isso é apenas uma questão com as fontes Serif, apesar de que algumas vezes as sans-serif vão precisar de ligaduras para serem configuradas também.

LigaturesLigaturesLigatures

Você pode encontrar muito mais sobre ligaduras no Fonts.com e no Adobe’s Layers Magazine.

Hifenização

Outro daqueles detalhes que você tem que julgar em tipografia. A hifenização não é amada por designers e tipógrafos, mas é considerada necessária algumas vezes, para prevenir problemas de  trapos (rag) (há uma descrição de trapos mais para frente nesse artigo). Se você usar, evite ter vários dele no mesmo bloco de cópia, e especialmente evite ter um em baixo do outor. Para mais informações tente ler essa página em Fonts.com.

Hífen, Traço e Travessão

Outra coisa que causa confusão é o uso de caracteres de linha horizontal numa fonte, e qual é o correto a se usar. Vale a pena saber a diferença entre o Hífen (o mais curto) um Traço (um pouco mais longo) e o Travessão (o mais longo de todos).  Lynotype e Fonts.com tem guias úteis sobre esse assunto.

Grades

Uma grade é uma guia pela qual os designer gráficos podem organizar cópias e imagens de uma maneira flexível, enquanto tornam o conteúdo fácil de assimilar e entender. Elas podem formar a base de um bom layout tipográfico, então é bom ter o hábito de usá-las no seu trabalho. Tente ver nos exemplos (como jornais, folhetos, ou um site com bastante conteúdo) veja como os tipos foram posicionados e estruturados. O diagrama abaixo deseja mostrar de uma maneira básica como as diferentes peças de tipos podem ser posicionadas numa grade, e como as partes principais da grade são chamadas.

GridGridGrid

Saiba mais sobre o uso de grades no The Grid System, um recurso bem útil.

Trapos (Rag)

Isso é a borda vertical irregular de um bloco de tipos, é mais comum na borda do lado direito, no caso de textos alinhados a esquerda. É importante prestar atenção ao trapo (rag), porque ele pode afetar muito a legibilidade. Se o trapo(rag) não for muito bom, ele pode distrair muito o olho enquanto você lê coluna abaixo. Normalmente é fácil de corrigir; retrabalhando as quebras de linha, ou editando a cópia.

RagRagRag

Viúvas e Órfãos

Se uma única palavra ou uma linha curta é deixada no fim de uma coluna é chamada de Viúva. Igualmente, se o mesmo for deixado no topo da coluna seguinte é chamado de Órfão. Ambos são considerados tipografia ruim, porque causam num bloco de tipo, formas que distraem. Eles também podem ser corrigidos facilmente, do mesmo modo que os trapos (rag), retrabalhando as quebras de linhas na coluna ou editando a cópia.

Widows and OrphansWidows and OrphansWidows and Orphans

Continue Aprendendo Mais

Uma vez que tenha digerido o básico que eu delineei, há mais uma enorme quantidade de material de referência para uma boa tipografia de qualidade online, que ajudará você a aprender mais e melhorar suas habilidades e julgamento. Abaixo há uma coleção de links úteis para você começar.

Leitura Recomendada

Duas das maiores companhias internacionais de fontes tem algumas seções de recursos muito boas, que tem como alvo ajudá-lo a dominar o básico da tipografia.

Inspiração

De uma olhada pela Web e tenha uma noção de ótima tipografia. Não apenas você encontrará uma grande variedade de estilos, mas também poderá ver o que outras pessoas consideram um bom tipo. Há alguns ótimos lugares para começar:

Terminologia

Se você quer encontrar mais sobre a terminologia da tipografia ou apenas verificar uma palavra, esses são sites úteis:

Artigos em Geral

Esses são alguns artigos com dicas gerais sobre melhorar sua tipografia:

Tipografia da Web

Se você está interessado em ler sobre o uso da tipografia em websites, tente esses recursos úteis:

Essa Postagem é do Dia 20 do nosso Sessões de Design Gráfico. Sessões Criativas
Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Design & Illustration tutorials. Never miss out on learning about the next big thing.
Advertisement
Start your 7-day free trial*
Start free trial
*All Individual plans include a 7-day free trial for new customers; then chosen plan price applies. Cancel any time.