Tipografia

Tipografia é o estudo, criação e aplicação dos caracteres, estilos, formatos e arranjos visuais das palavras. Os tipos, conhecidos como fontes ou tipos de letra, indicam a composição visual de um texto. A tipografia é, sem dúvidas, uma das áreas mais importantes do Design Gráfico.


Categoria das Fontes

As fontes são divididas em 5 categorias, sendo elas:

Fontes Serifadas

As serifas (pequenas bordas achatadas nas pontas de algumas letras) têm a capacidade de guiar nossos olhos graças aos pequenos prolongamentos que elas criam e fazem as letras “se juntarem” em palavras.

Atualmente, não usamos fontes serifadas para apresentar textos longos na Web pois as tendências atuais nos levam a usar fontes um pouco mais leves visualmente.

Porém, as fontes serifadas são bastante usadas em títulos, pois acabam chamando mais atenção.

Fontes não Serifadas

Mais conhecidas por seu “nome chique” em Francês sans-serif (significa “sem serifa”), são fontes que, como você já pode imaginar, não apresentam serifas.

Elas são ótimas para a exibição em telas/monitores pois transmitem a sensação de limpeza, clareza e organização. Recomendadas para uso em textos médios e longos.

Fontes Monoespaçadas

Existem fontes monoespaçadas com e sem serifas. A principal diferença desse tipo de fonte é que o espaço horizontal (largura) ocupado por cada letra possui o mesmo tamanho.

A principal vantagem no uso desse tipo de fonte é facilitar ao máximo a leitura das palavras, principalmente aquelas que requerem que você as reproduza. Usamos muito esse tipo de fonte para representar comandos de linguagens de programação de computadores. Por isso, nós também costumamos chamá-las de fonte de terminal ou fonte de console.

Fontes Script

Também chamadas de fontes handwriting, são aquelas que tentam imitar a escrita humana. Seu uso deve ser bem controlado e jamais será aplicado a textos muito longos, pois causam cansaço visual e tornam-se difíceis de ler.

Fontes Display

Toda fonte que foge completamente das definições feitas pelas classificações acima são consideradas fontes display. São fontes com bastante efeitos visuais, enfeitadas e até mesmo curiosas. Também são chamadas de fontes comemorativas.

Essas fontes também são recomendadas para criar títulos em destaque e devem ser evitadas para textos médios ou longos.


Tamanho das Fontes

É possível gerenciar o tamanho de uma fonte de diversas formas, usando diversas medidas métricas, as medidas são descritas a seguir.

Medidas Absolutas

Medidas Relativas

* Medidas recomendadas pela W3C.
** Recomenda-se usar para textos que serão posteriormente impressos.
*** Fontes que alteram de tamanho conforme o tamanho da tela de exibição.

Formatação de Fontes

As fontes também podem ser fomatadas por seu estilo e por seu peso. Sem ter o valor semântico das tags em HTML.

Estilo

O estilo define se a fonte irá ser normal ou itálica. Pode ser definida como normal por padrão, italic ou oblique, sendo a segunda opção menos compatível em alguns navegadores.

Peso

O peso refere-se ao quão pesada será uma fonte, ou seja, o quão largas e espessas serão as linhas de escrita. Podem ser definidas por seu peso numérico (que vão de 100 a 900) e/ou pelas palavras a seguir:


Alinhamentos

E, por último, temos as configurações de alinhamento, que se dividem em 4:

Alinhamento à esquerda

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Distinctio asperiores optio laudantium laboriosam pariatur hic quos perferendis ad odio delectus enim minus rerum illum, maiores explicabo fugit vel error et?

Alinhamento à direita

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Distinctio asperiores optio laudantium laboriosam pariatur hic quos perferendis ad odio delectus enim minus rerum illum, maiores explicabo fugit vel error et?

Alinhamento central

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Distinctio asperiores optio laudantium laboriosam pariatur hic quos perferendis ad odio delectus enim minus rerum illum, maiores explicabo fugit vel error et?

Texto justificado

Lorem ipsum dolor, sit amet consectetur adipisicing elit. Distinctio asperiores optio laudantium laboriosam pariatur hic quos perferendis ad odio delectus enim minus rerum illum, maiores explicabo fugit vel error et?