Tipografía - TEC Digital

Page 1

TIPOGRAFÍA José Adrián Gómez Montero


Tipografía Es la técnica de crear caracteres para comunicar un mensaje. La tipografía imitaba en un inicio la caligrafía. Dado los adelantos técnicos en el tiempo, se fueron desarrollando caracteres más legibles y fáciles de entender Tipografía, del griego: Tipos: “molde” Graphos: “escribir o grabar” Ia (el sufijo): “cualidad o acción”

Definiciones importantes Tipos: Igual a una letra o caracter determinado.

ABCDEFGHIJKLMN Fuente tipográfica: Son un conjunto de tipos o caracteres con características comunes. Algunos ejemplos de fuentes tipográficas son:

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

1


Familia tipográfica: Es un grupo de fuentes tipográficas unidas por características similares, pero que también poseen rasgos propios, en pesos, anchos y estructura o eje. Familia tipográfica

Helvetica Pesos

Thin

Variaciones de peso tipográficas más comunes

-

Light Regular Medium Bold Black

+

Anchos Variaciones de ancho en la tipografía

Condensada Extendida

Estructura Variaciones de estructura dada por la inclinación del eje del tipo

Italic

Regular

2


Estructura de la tipo Las siguientes son las partes más comunes en la estructura de una letra o tipo

Ascendente

Oreja

Serifa Asta

Descendente

Vértice

Barra transversal

Ojal Brazo

Cruz o travesaño

Cola

3


Clasificación tipográfica Existen muchas tipografías las cuales son clasificadas en grandes grupos según sus características de forma, visibles en cada una de las partes de la tipo que se mostraron anteriormente. La clasificación más común realizada da como resultado tres grandes grupos: las tipografías Serif, las Sans serif y las Manuscritas y de fantasía.

4


Serif

Tienen su origen en el pasado, cuando la escritura se cincelaba en bloques de piedra y resultaba difícil que los bloques de las letras fueran rectos, por lo que el tallador desarrolló una técnica donde los extremos de las letras presentaban unos remates, conocidos como serifas. Otra de sus características principales es la variación en el grosor de sus trazos.

Algunos ejemplos de tipografías Serif son los siguientes:

Book Antiqua

Garamond

Bookman Old Style

Georgia

Constantia

Goudy Old Style

Cambria

Times New Roman

Century Schoolbook

Perpetua

La mayoría son adecuadas para la lectura de textos largos, ya que la variabilidad en los trazos y los remates ayudan al ojo a crear y seguir la línea de texto, facilitando la lectura rápida y evitando la monotonía.

5


Sans serif

Estas tipografías aparecen durante los años 1820 y 1830 en Inglaterra. A diferencia de las Serif, no poseen remates en sus extremos (sin serif), y entre sus trazos existe poco contraste, dado a un ajuste óptico de forma apenas perceptible.

Algunos ejemplos de tipografías Sans serif son los siguientes:

Avenir

Helvetica

Calibri

Impact

Century Gothic

Lucida Sans

Franklin Gothic

Open Sans

Gill Sans

Roboto

Son apropiadas para su lectura en pantalla, resultando muy legibles a pequeños tamaños. Sin embargo no están recomendadas para textos largos, debido a que resulta monótonas y difíciles de seguir.

6


Manuscritas, fantasía y experimentales

En este último grupo encontramos a aquellas tipografías que no pertenecen a ninguna clasificación exacta. Poseen trazos y estructuras diversas, por lo que la mayoría no asegura una buena legibilidad. No se recomienda su uso en bloques de texto. Podría emplearse en algunas palabras solamente cuando la forma de la tipografía elegida aporte al concepto gráfico que desee representarse. Algunos ejemplos de éstas tipografías son los siguientes:

Además de que no son muy legibles pueden comunicar baja calidad y poco profesionalismo o seriedad.

7


Retórica tipográfica Las tipos proporcionan información no solo textual, como la que comunican al formar palabras y oraciones, sino también emotiva y estética, ya que a través de sus formas pueden expresar sensaciones como formalidad, dinamismo o elegancia. Lo anterior quiere decir, que aunque la función principal de la tipografía es comunicar, no debemos olvidar que ésta está impregnada de semántica visual, que cada letra es un símbolo capaz de transmitir metáforas visuales y no solo información textual.

8


Ejemplo 1

Silencio Tipografía: Edwardian Script

La retórica tipográfica aprovecha el uso de distintas tipografías para transmitir un mensaje en concreto. En el ejemplo anterior, la palabra “Silencio” posee mucha más fuerza al ser empleada con la tipografía “Impact” en comparación con “Edwardian Script”.

SILENCIO Tipografía: Impact

En el primer recuadro, “Silencio” puede ser tomado como una petición amable, mientras que en el segundo caso como una orden. 9


Ejemplo 2

Pérez & Pérez Abogados

Tipografía: Comic Sans

Pérez & Pérez Abogados Tipografía: Bauhaus En este ejemplo se muestra el logotipo de una firma de abogados con diferentes tipografías.

Pérez & Pérez Abogados

Tipografía: Baskerville

Pérez & Pérez Abogados

Tipografía: Century

Por la actividad que realizan y la importancia para sus clientes sería importante que el logotipo comunique seguridad y formalidad, aspectos que en el primer recuadro no logra utilizando las tipografías “Comic Sans” y “Bauhaus”. Lo anterior nos muestra la relevancia de escoger la tipografía correcta en cada caso, y como, el hecho de emplear la tipografía equivocada, puede ser fatídico para los intereses de una empresa, transmitiendo a sus clientes un mensaje erróneo de su calidad o seriedad. 10


Ejemplo 3

CHISPITAS JARDIN INFANTIL

Tipografía: Cowboy Movie

CHISPITAS JARDIN INFANTIL Tipografía: Carnivalee Freakshow

CHISPITAS JARDÍN INFANTIL

Tipografía: KG Primary Italics

CHISPITAS JARDÍN INFANTIL

Tipografía: Comic Sans MS

En este caso, al igual que en el ejemplo anterior, la elección de la tipografía aporta gran parte del mensaje que queremos transmitir. Algunas tipografías como las ubicadas en el primer recuadro nos recuerdan alguna película del “Far West” o a un circo. Mientras que las tipografías del segundo recuadro poseen trazos más simples y están más relacionadas con el contexto. 11


Consejos importantes al trabajar con tipografĂ­a

12


1

¿Para qué medio se diseñó cada fuente? Algunas tipografías fueron diseñadas originalmente para su reproducción impresa y no en pantalla. Como por ejemplo: Verdana, Open Sans o Roboto. Otras como la Times New Roman para, con su formas, poder compensar la impresión deficiente de una máquina rotativa antigua.

2

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)

No más de dos familias tipográficas Al realizar el diseño de una composición o documento, es importante tener en cuenta que no necesitamos más de dos familias tipográficas en total, es la cantidad suficiente para realizar las variaciones necesarias en títulos y demás estilos de texto. De hecho podría utilizarse una sola familia tipografía y jugar con sus variaciones de peso y estructura para aportar una diferenciación suficiente a cada estilo de texto dentro del documento o composición.

Roboto light Roboto Roboto medium Roboto bold

Times New Roman Times New Roman italic Times New Roman bold Times New Roman bold italic

13


3

Combinando tipografías Al realizar la combinación de dos tipografías debe buscarse el contraste entre éstas, utilizar dos fuentes que se parezcan demasiado es una mala idea.

Fuente tipográfica

Garamond + Adobe Caslon Pro

Fuente tipográfica Avenir + Futura

Fuente tipográfica Museo + Gandhi Serif

Fuente tipográfica

Calibri + Adobe Caslon Pro

14


4

El párrafo Al contrario de los medios impresos, la tipografía en web y en los recursos digitales debe adaptarse cada día a diversos monitores y dispositivos que van surgiendo. En esta situación, al utilizar el texto justificado, el resultado de su visualización en cada dispositivo puede no ser el mismo, y aumenta la posibilidad de encontrar ajustes no deseados. Además, se ha logrado identificar que el texto justificado dificulta la lectura para usuarios que padecen dislexia, ya que los espacios en blanco entre los textos justificados son un distractor importante. Por lo anterior es que es recomendable utilizar la alineación del texto a la izquierda. Y en caso que se deba justificar, utilizar guiones y dividir palabras al final de cada línea. 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.

El justificar el texto no nos asegura que el espacio entre cada palabra sea igual en cada una de las líneas del párrafo, tal como se muestra en el ejemplo anterior. Esta variación en el patrón entre líneas dificulta la lectura para el usuario.

15


El número de caracteres que se incluyan dentro de una línea de texto es el responsable en gran medida de la legibilidad del texto. Si la línea es muy extensa puede ser intimidante y difícil de leer, mientras que si es muy corta puede a llegar a crear confusión en la idea que desea transmitirse. Por lo anterior es que se tiene como norma utilizar alrededor de 7 palabras por línea o entre 60 y 80 caracteres. En cuanto al interlineado o espacio entre líneas en un párrafo, se recomienda que sea de 1.5 o el conocido espacio doble.

Todas estas borrascas que nos suceden son señales de que presto ha de serenar el tiempo y han de sucedernos bien las cosas; porque no es posible que el mal ni el bien sean durables, y de aquí se sigue que, habiendo durado mucho el mal

5

No deforme la tipografía A menos que sea un profesional, no debe deformar la tipografía cambiando su proporción, ya que las letras son entidades con personalidad propia que no podemos alterar de manera caprichosa. El hacerlo podría influir en la legibilidad, además que se ve poco profesional.

tipografía

tipografía

16


6

Evite las fuentes de fantasía Puede jugar con las fuentes que haya elegido, pero buscando que el diseño sea coherente con la idea que desea transmitir. La mayoría de las veces, las fuentes de fantasía transmiten poco profesionalismo o seriedad.

IMPORTANTE IMPORTANTE IMPORTANTE IMPORTANTE IMPORTANTE

17


7

Tamaño de la tipografía Aunque no existe un estándar de tamaños que deban utilizarse se recomienda: Entre 10 y 12 puntos para el texto normal en medios impresos. En el caso de títulos, subtítulos y encabezados, no hay reglas fijas, pero se recomienda aplicar tamaños que sean del orden de un 20% superiores, por ejemplo: normal 10 pt

subtítulos 12 pt

títulos 14.4 pt Para documentos digitales, por recomendaciones de accesibilidad se suele utilizar como tamaño mínimo 14 puntos. Mientras que en páginas web, para el texto normal se recomienda 1 em (16 px). Para más información de tipografía para web puede consultar: http://typecast.com/blog/a-more-modern-scale-for-web-typography

8

Fuentes tipográficas para impresión Para medios impresos y textos extensos se recomienda el uso de tipografías de la familia Serif. En general estas tipografías son mucho más legibles que las sans-serif. Puede utilizar:

Century Times New Roman Georgia

18


9

Fuentes tipogrĂĄficas para medios digitales Se recomienda utilizar tipografĂ­as Sans-Serif como las siguientes:

Helvetica

Lucida Sans Myriad Open Sans Roboto Verdana

19


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.