Introducción a la Tipografía

Qué es la Tipografía

“El arte de reproducir la comunicación, mediante la palabra impresa”.

La importancia de la Tipografía

Gramática, ortografía, ortotipografía…

El origen de la letra escrita

AA

Los amanuenses

Guttenberg y los tipos móviles

La tipografía pre-ordenador

El nacimiento de la autoedición

Alfabetos por el mundo

Conceptos tipográficos

Aclarando conceptos

Helvetica Neue Condensed Bold Helvetica Neue Ultra Light Helvetica Neue Light Helvetica Neue Medium Helvetica Neue Bold

Negritas, cursivas, versalitas…

Una familia tipográfica tiene que ser lo suficientemente versátil para cualquier proyecto y tener diferentes pesos y versiones. Negritas para destacar textos, cursivas para palabras en otros idiomas, versalitas para diccionarios, etc.

Anatomía de un tipo

a A

H

ABCDEFGHIJKLMÑOPQRSTUVWXYZabcdefghijklmnñopqrstuvwxyz0123456789&+*-…

f x

HOLA

Cómo se miden los tipos para papel

• Picas

• Cíceros

• Tipómetros

Cómo se miden los tipos en pantalla

• pixels

• puntos

• ems

La importancia de la contraforma

“Los tipógrafos diseñan el espacio blanco de las letras”

AAA

Condensadas y extendidas

Yo soy un poco estrecha

Yo estoy a mis anchas

Me han comprimido

Me han estirado

Clasificación de las fuentes

Serifas vs Sans Serif

GaramondHelvetica

T T

Fuentes Script

TipografíaTipografíatipografía

Inglesastencil

Fantasía

góticaegipcia

gestual

Te quiero

Te quiero

Tipos de fuentes

• Truetype

• OTF

• Webfonts

• etc.

Gratuitas vs de pago

La tipografía y el diseño gráfico

Cuándo usar cada fuente

• Fuentes de texto

• Fuentes para pantalla

• Textos largos

• Titulares

Cómo combinar tipografías

Buscardiferencias contrastarpesos

nos parecemosdemasiado

Composición y legibilidad

Kerning

tipografíatipografía

Tracking

LOS TEXTOS EN MAYÚSCULA, ADMITEN MEJOR EL TRACKING

LOS TEXTOS EN MAYÚSCULA, ADMITEN MEJOR EL TRACKING

Los textos en minúscula, admiten peor el tracking

Los textos en minúscula, admiten peor el t racking

Interlineado“ El interlineado por defecto, en los programas de autoedición, suele ser un 20% del cuerpo del texto”.

Está bien para textos en cuerpos pequeños, pero es demasiado grande en cuerpos mayores

Está bien para textos en cuerpos pequeños, pero es demasiado grande en cuerpos mayores

Está bien para textos en cuerpos pequeños, pero es demasiado grande en cuerpos mayores

10/12 10/12 40/48

En cuerpos grandes, hay que reducir el interlineado, incluso a valores negativos, pero con mucho cuidado con ascendentes y descendentes.

Ritmo de lectura• Tenemos que tener en cuenta el soporte (papel o pantalla)

donde se va a leer y el tipo de usuario para con ello definir la tipografía.

• No es lo mismo una novela para personas mayores, que textos en una red social móvil.

• Los anchos de párrafo también son cruciales, para que no se canse el lector o se pierda.

Composición de párrafosPis aut esequatur? Qui dollore vid ea nis qui autaquam, eatio. Borrovidunt ex et volenis exerios modic testem re non porescita

se laccae eum quatem fugiatet liqui volupta Erepedit ad quiat et, aped quaeseq uuntemquam labor mincto dolectur ma custiat

alita dipsandae. Nam eaquia sit ut dolumquae. Molorest, sequam est, eosae. Sedis expliquibus que este aperiorpore nonemodia

nos nobis eos simaximilis ex evellent quam con res aliquis niminct asperfera non nem liquia verum dolo quis duntia vollaut

empore idebit la nossenda vel moles et plandusapic tem lit dolenia tatur, quae perfero corectatur? Uscia dem rehent odicil

minverchit maio. Ut evel moluptas est quis resti ommo ex endebit faciasit es exerum que sit, sandelestrum renisto vel ium aut

apidi aut odisquis alitio quam renis rem reroviti sequiae reheniam lab il eiusciis plaut ad mincita ist pores est vollum vero

occum sequi vellent.

Dolorum voloreprovit harum arcia con num cum ut as quam ad quam, ut quisi sit, tem viti utenihil mi, sandaes destotae

verum, cum aut

Tamaños de las fuentes

• Para texto en papel, el tamaño mínimo será de 10 puntos.

• Para leer en pantalla, como mínimo 16 puntos.

• Dos tipografías a cuerpo 16 no son iguales en tamaño.

• Debemos usar un criterio en los tamaños de nuestros textos (10, 11, 12, 14, 18, 24…).

Soy una Garamond 16 pt

Soy una Arial 16 pt

Contraste

• Por contraste nos referimos tanto a la relación de color fondo/frontal como al contraste de la propia fuente.

• Una fuente muy fina en cuerpos pequeños, es fácil que no tenga el contraste suficiente para una buena legibilidad.

• Las tipografías también se dividen entre las que tienen poco contraste (Helvética) o mucho (Bodoni).

B B

A A A A

Jerarquización de la información• Hay que diseñar con contenidos reales.

• Estructurar la información es básico: titulares, destacados, ladillos, capitulares…

• La pirámide de la información. ¿tiene sentido en Internet?

• Destacar lo importante, con los recursos a nuestro alcance: negritas, filetes…

• Cada medio (papel/pantalla) tiene sus propias normas (texto en azul subrayado es un link).

El espacio blanco

• Una fuente con ojos grandes será más legible. También es importante la altura de la “x”.

• Como las retículas de nuestras ciudades, la de nuestros textos harán que funcione o no.

• El espacio libre transmite: orden, elegancia, legibilidad.

Márgenes en un documento

Qué NO hacer

Comillas

“diseño”

«diseño»

"diseño"

Grados y ordinales

Planta 1ª

Planta 1ª

4º piso

50 °C

50º C

Estilos de menú “artificiales”

yo soy una VERSALITAyo soy un FALSA VERSALITA

yo soy una cursivaa mí me han tumbado

El síndrome de la máquina de escribir

• Nunca usaré más de una vez la barra espaciadora o el tabulador.

• Las MAYÚSCULAS llevan acento.

• No se usan saltos de carro para separar párrafos.

Diego Rodríguezwww.arketipo.net

@arketipo

Gracias

Eskerrik asko

gràcies

graciñas

Danke

Thank you

çox sag olun

Дзякую

мерси

감사합니다

谢谢

დიდი მადლობა

ευχαριστώ

ありがとうございました

dziękuję

sulpáy