Tipografia: Guia Sobre Tipos – Escolhendo a fonte certa [parte 01]

O melhor artigo sobre Tipografia da web - Aprenda a como escolher a tipografia certa para o seu projeto e alcance o seu objetivo de comunicação.

tipografia

Eae. Td Bele?

Vamos falar sobre Tipografia?

Um projeto de design, como você já deve saber, engloba várias coisas, e uma das mais importantes é a escolha tipográfica. Independente se o seu projeto é digital ou impresso a tipografia será a “voz” dele. Por isso ela deve ser coerente com o objetivo de comunicação do mesmo.

É a tipografia que vai definir se é uma mensagem séria, divertida, urgente, dita em voz baixa ou gritando. 

Assim como as cores, existe uma psicologia por trás das fontes tipográficas e a mesma não deve ser ignorada. 

A escolha certa da tipografia em um trabalho pode fazer toda a diferença.

Mas antes de escolher aquela “fonte” legal, cheia de curvas e linhas, você precisa saber o que é tipografia. Precisa saber como ela funciona, quais são os tipos, quais elementos compõem esses tipos, como usá-la da melhor maneira, etc.

Então, Galucho, para resolver isso, e para você parar de escolher “tal fonte” só porque é bonitinha, o Chief traz para você esse Guia sobre Tipografia.

Esse assunto é pouco extenso e por vezes um pouquinho complexo, por isso eu decidi criar uma série de artigos sobre ele. Pretendo passar por praticamente todos os tópicos que envolvem a tipografia.

E antes de prosseguir com o artigo, eu quero aproveitar a oportunidade, já que estamos falando sobre Tipografia, para te avisar que estamos com inscrições abertas para o nosso curso de Fundamentos do Design Visual. O curso Fundamentos do Design Visual é focado nos fundamentos, conceitos e princípios do Design Visual.

Neste curso, juntamente com os outros fundamentos, você poderá se aprofundar ainda mais sobre Tipografia. Clique no link abaixo e conheça o nosso curso.

⭐️Curso Fundamentos do Design Visual⭐️
Saiba mais ➡ https://www.fundamentosdodesign.com.br

Curso Fundamentos do Design Visual

Bele? Preparado?

Então, vamos começar a desvendar esse mundo da tipografia!

O que você verá nesse artigo?

O que é Tipografia

Tipografia: Do grego typos = forma  e graphein = escrita.

É a mecanização da escrita feita através da tecnologia para a reprodução de textos em série.

Tipografia também é o termo usado para definir o estudo dos tipos (apesar de algumas pessoas usarem bastante também o termo tipologia).

Mas antes de tudo … Vamos voltar um pouco na história…

Começo da escrita

O Homem desde os primórdios sempre buscou meios de se comunicar e se expressar em relação ao mundo e aos seus pares. Portanto, bem antes do início da escrita o Homem já se comunicava através de sons, cantos, gestos, desenhos, pinturas, danças, esculturas…

Após o desenvolvimento da fala, e obviamente da comunicação oral, surgiu a necessidade de criar registros, de preservar e repassar a memória, etc.

E a consequência dessa necessidade foi a invenção da escrita.

“O surgimento da escrita é um marco importante na história do mundo por demarcar a separação entre a história e a pré-história iniciando o registro dos acontecimentos.”

A escrita é o sistema que utiliza signos para expressar graficamente em um suporte o pensamento humano.

“A assimilação e interiorização da tecnologia do alfabeto fonético translada o homem do mundo mágico da audição para o mundo neutro da visão.” Marshall McLuhan, A galáxia de Gutenberg, 1972”

A escrita, esse sistema de registro através desses signos, existe a cerca de 3.000 ac e passou por várias fases e evoluções. Não vou adentrar na história, até porque ficaria muito extenso este artigo, mas é muito válido que você pesquise sobre a história da escrita.

O surgimento da tipografia

Os chineses (tinha que ser os asiáticos hehe) foram os primeiros a criar um sistema de tipografia, muito antes do Gutemberg (veremos mais adiante). O inventor foi Pi Shêng por volta do ano 1040 dc. Os tipos eram feitos em argila cozida, madeira e até bronze, e eram dispostos numa tábua, a huóban (tábua viva).

Shên Kua, contemporâneo do inventor, relatou a produção de milhares de cópias, mas não é específico se foram em forma de rolos ou livros. Essas obras impressas eram o que ele chamava de Os cinco Clássicos.”

Mas o grande inventor da tipografia, feita através da prensa com tipos em metal, foi Johann Gutemberg no ano de 1450.

“Nascido na Mangucia, atual Mainz, Alemanha, ele Trabalhou na Casa da Moeda com a técnica de fundir metais e cunhar moedas, o que favoreceu a criação da liga de chumbo com a qual ele passou a preparar as letras para montar os tipos móveis em metal. Gutemberg e a Imprensa A Imprensa A História do Livro e da Editoração”

A invenção de Gutemberg possibilitou a reprodução em série dos textos. No século XV, em 1456, ele imprimiu a “Bíblia de 42 linhas”, o primeiro livro impresso e a primeira comprovação da eficiência da tipografia. Composto por 642 páginas ela teve uma tiragem que de aproximadamente 200 exemplares. Com isso Gutemberg também tornou mais acessível os livros e a cultura, tirando o monopólio dos mosteiros e abadias responsáveis pelos manuscritos (livros escritos à mão).

Então, agora que já sabemos as origens vamos entender como funcionam as coisas… Vem comigo!

O que é fonte, letra e família tipográfica

Glifos (letras, caracteres):

São signos alfabéticos projetados para reprodução mecânica.

tipografia: glifos

Família tipográfica:

É o conjunto de caracteres que possuem as mesmas características de desenho independentemente das suas variações (peso, inclinação, corpo).

tipografia: família Helvetica Neue

Fonte:

É conjunto de glifos que compõem uma família tipográfica. O termo também é utilizado para designar os arquivos de fonte digitais, ou seja, uma coleção de glifos digitais em forma de arquivos para serem utilizados em computadores.
fonte

Anatomia dos tipos:

Os tipos são compostos por um conjunto de elementos:bojo, haste, barra, perna, serifa, oco, cauda, terminal, ombro, vértice, ligação, orelha, gancho, junção, espora, incisão, abertura, espinha e braço. Confira a imagem a seguir para ver cada parte da anatomia.

tipografia-anatomia-01

Ao menos que você seja um tipógrafo, você não precisa decorar cada parte que compõe a letra, mas é interessante você saber principalmente se for lidar com alguma ilustração do tipo lettering.

Ligaduras:

São as conexões de dois ou mais caracteres. Em português, a mais funcional é a FI, mas existem várias ligaduras (st, ae, oe, ff, ij, etc). Ela pode ajudar na legibilidade e estética da palavra.

tipografia-ligadura

Como ou sem serifa:

A Serifa  é o elemento, da anatomia dos tipos, que você vai mais ouvir falar. É o mais importante e o que você DEVE conhecer obrigatoriamente.

Existem tipos com e sem serifa (ou sans-serif, do francês) e a classificação dos tipos, em serifados e sem serifa, é a principal forma de diferenciação das letras.

Serifas são os pequenos traços, ou prolongamentos, que existem no final das hastes dos glifos.

tipografia: serifa

Nos próximos artigos falaremos bem mais sobre essa diferenciação.

Mas de antemão saiba que os tipos serifados são os mais adequados para  as caixas de textos “corrido” em trabalhos gráficos (em livros, por exemplo), pois a serifa tem a função de auxiliar a leitura, proporcionando continuidade para o texto e tornando-o menos cansativo para os olhos.

Enquanto que os tipos sem serifa são mais indicados para títulos, chamadas e também para textos em geral  nas aplicações digitais (em websites, por exemplo), pois as serifas acabam se tornando “borrões” no digital, prejudicando, assim, a leitura e o entendimento. Mas isso não é uma regra, ainda mais em tempos de telas de retinas, por isso o bom senso deve sempre prevalecer.

Corpo:

O corpo é o tamanho do tipo que começa do ponto mais alto (versal ou ascendente) até o ponto mais baixo (descendente).

tipografia: corpo linha base

Ascendentes:

É a parte das letras b, d, f, k, h, l e t que se estendem acima da altura de x.

Descendentes:

É a parte das letras g, j, p, q, y e por vezes a letra J (caixa alta), que se estendem abaixo da altura de x.

tipografia: ascendente e descendente

EIXOS:

É a angulação do traço. Diz respeito ao eixo de inclinação principalmente das letras b, c, e, g, o, p e q.

Eixo humanista: é o eixo oblíquo e que condiz com a inclinação da escrita manual.

Eixo racionalista: é o eixo vertical. Condiz com as formas neoclássicas e românticas .

tipografia: eixo

Caixa de tipos:

As letras possuem três tipos de tamanhos: caixa baixa, caixa alta e versalete.

Caixa baixa:

É o conjunto de caracteres em letras minúsculas.
tipografia-caixa-baixa

Caixa Alta (capitais ou versais):

É o conjunto de caracteres em letras maiúsculas.
tipografia: caixa-alta

Caixa alta e baixa derivam da organização dos tipos em caixas de madeira sobre um cavalete, nas oficinas tipográficas, onde as letras maiúsculas ficavam na parte superior (caixa alta) e as as minúsculas na inferior (caixa baixa), já que eram mais utilizadas e assim era mais fácil de pegá-las.

Versalete (small caps):

É o conjunto de caracteres em letras maiúsculas com a altura de minúsculas (altura de x).

tipografia:versalete

Algarismos:

Os algarismos (ou numerais) também são classificados em 3 grupos: old style, lining e small caps.

Old style:

São os numerais alinhados pelo texto. Por isso eles ultrapassam a linha de x  e, consequentemente, possuem ascendentes e descendentes.

tipografia: old-style

Lining:

São os numerais com o mesmo tamanho de uma versal (caixa alta) e não possuem ascendentes e descendentes.

tipografia:lining

Small Caps:

São os numerais com o mesmo tamanho de uma versalete e não possuem ascendentes e descendentes.

tipografia-small-caps

Unidades de medidas

As unidades de medidas servem para determinar desde o tamanho do corpo, o tamanho dos caracteres até o tamanho das entrelinhas.

Basicamente as medidas “primárias” (irei chamá-las assim) são: o ponto, o cícero e a paica. Hoje em dia, graças ao digital, temos outras como:  milímetros (mm),  pixel (px), etc.

Por ora, e por questão mais de conhecimento, falaremos das primeiras: o Ponto, a Paica (em inglês pica) usado na Inglaterra e nos países de língua inglesa, e o Cícero empregado na Europa continental.

Ponto: é a medida tipográfica estabelecida pelo francês Francisco Ambrósio Didot. Um ponto equivale aproximadamente de 0,376mm. (ou 2,6 pontos = 1 mm).

Cícero: também é uma medida do sistema Didot e que corresponde a 12 pontos.

Paica (pica): é uma unidade de medida anglo-saxão usada na Inglaterra e nos países de língua inglesa. Corresponde 1/6 polegada.

Divide-se ambas medidas (Cícero e Paica) em 12 partes. E existe uma diferença pequena entre os tamanhos, sendo a paica um pouco menor que o cícero. Veja a seguir:

1 paica (4,22 mm) = 12 pontos (Inglaterra).

1 cícero (4,52 mm) = 12 pontos (Europa Continental).

Abaixo mais alguns números:

tipografia: medidas

Antes da era digital era preciso conhecer bem sobre essas medidas porquê tudo se fazia com a régua, na mão, com cálculos… Hoje em dia não existe mais tal preocupação, porque o próprio software se encarrega de fazer isso.

E como a maioria dos softwares são oriundos dos USA, logo o sistema por padrão é o Paica, usando a polegada como referência, ou seja, 1/6 de polegada (4,23 mm).

Quadratim (ou eme):

Outro tipo de medida é o espaço tipográfico derivado da letra M em caixa alta. Dividindo a largura da letra “M” em 18 unidades, essa unidade de medida é usada, principalmente, para determinar os espaços horizontais e endentações.

tipografia: quadratim

E isso só foi o começo…

Para não ficar muito extenso e cansativo vou parar por aqui essa primeira parte da série de artigos sobre tipografia.

Nos próximos artigos continuaremos a destrinchar esse mundo da tipografia para realmente termos uma boa base para escolhermos a fonte certa para os nossos projetos, bele?

E se quiser saber mais sobre essa aula sobre tipografia que gravei para os alunos do curso Web Designer PRO.

Confira:

E você gosta de tipografia? Trabalha com tipografia? Sabe como usá-la corretamente?

Quem sabe você gostaria de compartilhar conosco a sua experiência com os “tipos”.

Até mais.

Forte Abraço.

Confira a segunda parte aqui  → https://www.chiefofdesign.com.br/guia-tipografia-parte-02/

Confira a terceira parte aqui  →https://www.chiefofdesign.com.br/guia-tipografia-parte-03/

Referências:

Livro Elementos Do Estilo Tipográfico – Robert Bringhurst

Livro Pensar com Tipos – Ellen lupton

Anatomia do tipo

http://pt.wikipedia.org/wiki/Hist%C3%B3ria_da_escrita

http://www.museutec.org.br/linhadotempo/inventores/johann_gutemberg.htm

http://tipografos.net/glossario/anatomia.html

http://www.artigonal.com/ciencia-artigos/a-origem-do-livro-1542468.html

David Arty

Olá. Sou David Arty, fundador do blog Chief of Design.
Sou natural de São Paulo, Brasil. Trabalho com design, principalmente com design para web, desde 2009. Procuro transformar ideias loucas e complexas em peças simples, atrativas e funcionais.