Adri谩n G贸mez Montero
HISTORIA https://www.youtube.com/watch?v=NmqKEUQSJ9g
La fuente o tipografía Conjunto de caracteres basados en una misma fuente que usualmente incluye: caja alta
números
caja baja
signos de puntuación
versalitas
signos matemáticos
ABCDEFGHIJK abcdefghijk ABCDEFGHIJK ligaduras
fi fl
123456789 .:;¡¿!?¡¿
+%=><≈≠√∫×
La fuente o tipografía Ejemplos Las tipografías expresan. Y eso es independiente de lo que pueda significar el texto.
Arial
Franklin Gothic
Open Sans
Helvética
Frutiger
Overlock
Avenir
Gabriola
Quicksand
Century
Harrington
Roboto
Comic Sans
Impact
Sanchez
DIN
Monaco
Tahoma
Fira Sans
Museo
Verdana
Familia tipogrĂĄfica Es la gama de variaciones de una misma tipografĂa
Helvetica pesos
estructura
ancho
light
italic
condensada
regular
VERSALITAS expandida
medium bold
T TTT TT CLASIFICACIÓN TIPOGRÁFICA
Elementos para clasificar las tipografĂas
1. Presencia o ausencia de serifas
Sans Serif
Serif
Elementos para clasificar las tipografĂas
2. La forma de la serifa
Garamond
Baskerville
Bodoni
Rockwell
Elementos para clasificar las tipograf铆as
3. La relaci贸n curva o recta entre bastones y serif
Baskerville
Rockwell
Elementos para clasificar las tipografĂas
4. Uniformidad o variabilidad del grosor del trazo
B B Baskerville
Rockwell
3 familias tipogrĂĄficas
Serif Sans serif Manuscritas y de fantasĂa
1.
Serif
Romanas antiguas
Romanas de transici贸n
Romanas modernas
Egipcias
Trajan
Baskerville
Bodoni
Rockwell
Caslon Garamond
Times New R Century
Didot Bauer
Cooper Clrandon
2.
Sans serif Grotescas (1957)
Helvetica
Franklin Gothic Roboto
2.
Sans serif GeomĂŠtricas (1920)
Avenir
Bauhaus Century Gothic
2.
Sans serif HumanĂsticas (1916)
Calibri
Lucida Sans Gill Sans
3.
Manuscrita y de FantasĂa
Black Rose
Badaboom Hand of sean
RETÓRICA TIPOGRÁFICA
Silencio
SILENCIO
A tener en cuenta:
1. Las letras son cosas: las letras son entidades con personalidad propia que no podemos alterar de manera caprichosa
A tener en cuenta:
2. Las letras son imágenes de cosas: “una imagen vale más que mil palabras” porque una palabra impresa ya es, en sí misma, una imagen
casa
A tener en cuenta:
3. Las letras son productos hist贸ricos: cada dise帽o de letras que se ha realizado vive pegado al tiempo en que nacieron y se desarrollaron
A tener en cuenta:
4. No existe una tipografía neutra. Todas están llenas de simbolismo
ANGRYBIRDS
ANGRYBIRDS
BATMAN
BATMAN
ACDCD
ACDC
Comunicación Mensaje acertado
Pérez & Pérez
Pérez & Pérez
Comic Sans
Baskerville
Pérez & Pérez
Pérez & Pérez
Abogados
Abogados Bauhaus
Abogados Abogados Century
Comunicaci贸n Mensaje acertado
arenas m o ved izas
CONSEJOS IMPORTANTES
1
Para qué medio se diseñó cada fuente
Medios digitales
Medios impresos
Verdana (1994)
Times New Roman (1932)
Georgia (1993)
Helvetica (1957)
Tahoma (1996)
Garamond (siglo XVI)
Arial (1982)
Baskerville (1757)
Roboto (2011)
Didot (1783)
2
No es necesario mรกs de dos familias tipogrรกficas
2
Roboto light Roboto Roboto medium Roboto bold
Times New Roman Times New Roman italic Times New Roman bold Times New Roman bold italic
3
Combinando fuentes
Adrián Gómez
Adrián Gómez
Adrián Gómez
Adrián Gómez
Garamond + Times New Roman
Helvetica + Arial
Museo + Futura
Roboto + Baskerville
4
El p谩rrafo
Alineaci贸n a la izquierda Vitae non curabitur purus pretium ac in, ea ligula tempus nibh ornare. Sem netus tempus at erat, rhoncus dolor duis eget id commodo, egestas id felis, diam nunc ut ullamcorper.
Justificado Vitae non curabitur purus pretium ac in, ea ligula tempus nibhascasasxsa ornare. Sem netus tempus at erat, rhoncus dolor duis eget id commodo, egestas id felis, diam nunc ut ullamcorper. Vitae non curabitur purus pretium ac in, ea ligula tempus nibhascasasxsa ornare. Sem netus tempus at erat, rhoncus dolor duis eget id commodo, egestas id felis, diam nunc ut ullamcorper.
5
Color tipogrĂĄfico El color de la tinta Contraste entre tipo y fondo Valor tonal de la tipografĂa Times New Roman 14/18
Impact 14/18
Century Gothic 14/18
In est condimentum vitae porttitor, eget torquent id fames lorem, amet amet sed nunc mi. Donec mollis parturient volutpat ante leo, consectetuer at maecenas arcu leo. Pulvinar eget enim, pulvinar massa massa ullamcorper est, et integer lacinia, eget fusce nam parturient scelerisque. Donec non est architecto odio vel amet, pretium et eget. Et nunc quis, vestibulum porttitor, neque mauris montes nec justo nec neque, sed nec sed, integer dui venenatis nec.
In est condimentum vitae porttitor, eget torquent id fames lorem, amet amet sed nunc mi. Donec mollis parturient volutpat ante leo, consectetuer at maecenas arcu leo. Pulvinar eget enim, pulvinar massa massa ullamcorper est, et integer lacinia, eget fusce nam parturient scelerisque. Donec non est architecto odio vel amet, pretium et eget. Et nunc quis, vestibulum porttitor, neque mauris montes nec justo nec neque, sed nec sed, integer dui venenatis nec.
In est condimentum vitae porttitor, eget torquent id fames lorem, amet amet sed nunc mi. Donec mollis parturient volutpat ante leo, consectetuer at maecenas arcu leo. Pulvinar eget enim, pulvinar massa massa ullamcorper est, et integer lacinia, eget fusce nam parturient scelerisque. Donec non est architecto odio vel amet, pretium et eget. Et nunc quis, vestibulum porttitor, neque mauris montes nec justo nec neque, sed nec sed, integer dui venenatis nec.
6
No deforme la tipografĂa (a menos que sea un experto)
7
Evite las fuentes de fantasía
Puede jugar con las tipografías que ha elegido pero buscando que el diseño sea coherente
8
Tipograf铆a para impresi贸n
Serif
Para grandes bloques de texto
Century Times New Roman Georgia
8
TipografĂa para web
Sans Serif
>14px
Roboto
Verdana
Open Sans
Lucida Sans
Myriad
Helvetica
多Preguntas?
:D