Tipografía

Tipografías web vs. tipografías del sistema

Información adicional

Ejercicio

Clasificaciones tipográficas

Algunos dicen que elegir tipografías es como elegir tu ropa — qué dice tu ropa de ti? La ropa que te pones va a formar la idea que los demás tengan de ti — de tu estilo, tu personalidad, tu nivel socio-económico, tu edad, etc. También se elige según la ocasión — no te pondrías un traje de baño para ir a una entrevista de trabajo y no te pondrías un traje sastre para ir a la playa.

Las tipografías que elijas para tus proyectos tienen la misma función que la ropa — la tipografía forma parte de la primera impresión de cualquier página. Por eso las elecciones tipográficas tienen que ser muy consideradas. ¿Tu tipografía está diciendo “vacaciones en la playa” cuando tendría que decir “entrevista de trabajo”?

Las dos clasificaciones tipográficas principales se llaman serif y sans-serif. Otras clasificaciones incluyen oldstyle, script y decorative.

⁠

Serif: serif se refiere a las patitas decorativas que tienen las letras. Por lo general se ven más serias y tradicionales. Si es un texto largo, esas patitas ayudan a que el texto sea más legible y fácil de leer porque las letras se distinguen bien entre sí.

⁠

Marcas más tradicionales o de lujo muchas veces usan tipografías serif para darle un toque elegante.

Sin serif: sans-serif literalmente significa “sin serif”…osea no tiene esas patitas decorativas. Se ven más modernas y minimalistas. Para un público que tiene poca experiencia leyendo - por ejemplo los niños - son más fáciles de leer porque las letras son más sencillas.

⁠

Uber, como la mayoría de las empresas de tecnología, usa tipografías sans-serif para posicionarse como una marca moderna.

Inglés antiguo: se distinguen por sus trazos dramáticos y remolinos en la parte del serif. No son tan populares hoy como en el año 1500 — son difíciles de leer entonces normalmente solo se usan para encabezados.

⁠

Muchos periódicos usan estas tipografías para hacer pauta en sus raíces, la tradición, y por ende en la confiabilidad de sus reportajes.

Cursivas: éstas son tipografías que parecen escritas a mano. Por lo general las letras están conectadas y hay muchos estilos — desde elegantes a divertidas a dibujadas.

⁠

Cursivas se usan mucho en marcas que quieren verse muy accesibles. También van bien con productos orgánicos o infantiles.

Decorativo: son tipografías con la intención de llamar la atención. Por lo general son muy originales y poco prácticas. Se deben de usar muy poco y con una intención específica.

⁠

Tipografías decorativas son poco prácticas pero pueden tener un impacto visual importante. Se usan mucho en obras más artísticas, conceptuales o abstractas.

Familias tipográficas

El término “familia tipográfica” se usa para describir variaciones de una misma tipografía. Por ejemplo, pueden ver que Gotham, una familia muy extensa, tiene 16 variaciones:

⁠

Cómo elegir qué tipografías usar

De nuevo volvemos a las bases que definimos al principio del proyecto. ¿Qué representa tu marca y cómo es tu público? Antes de empezar a buscar tus tipografías, es útil primero pensar en un par de cualidades que quieras comunicar con tu diseño. Así cuando elijas tipografías, ya tienes un esquema en mente. ¿Debería de ser casual, serio, elegante o juguetón? Si las características de la tipografía no encajan con el carácter de tu mensaje, vas a generarles una desconexión visual a tus usuarios. Hay que pensar en esto y no en gustos personales a la hora de elegir. Una tipografía que te parezca divertida o bonita tal vez no sea útil o apropiada para tu proyecto.

Cómo combinar tipografías

Depende del uso que se le vaya a dar. No es lo mismo elegir una tipografía para el texto de una revista digital (hay que priorizar la legibilidad) que elegir una tipografía para el encabezado de un poster para tu banda favorita. Para este proyecto, vamos a elegir sólo tres.

Encabezados: aquí se pueden tomar más riesgos y elegir tipografías más originales, siempre y cuando peguen con la personalidad de la marca

Cuerpo del texto: para el cuerpo del texto siempre se eligen tipografías serif o sans serif, priorizando tanto la personalidad de la tipografía como la legibilidad

Botones y links: para los links la legibilidad también es muy importante ya que son de los componentes más útiles de una interfaz

**No todas las tipografías tienen todos los caracteres del alfabeto, para nuestros proyectos hay que asegurar que tengan mínimo acentos y la ‘ñ’.

Combinar tipografías es un poco un arte — quieres elegir dos tipografías que sean complementarias pero no demasiado parecidas. Diferentes, pero no tanto que choquen. No caer en los extremos de demasiado contraste o no lo suficiente puede ser un proceso de prueba y error. Hacer buenas combinaciones se trata de experimentar e ir desarrollando tu ojo. Aunque sí hay algunas tips que pueden ayudar:

Encuentra alguna característica compartida: tipografías que se ven muy diferentes pero que comparten alguna cualidad por lo general funcionan bien. Esa cualidad puede ser las proporciones generales como el alto o ancho de las letras, o dos tipografías que compartan una estructura o esqueleto subyacente. Aunque los parecidos sean sutiles, le da una aire cohesivo a tu combinación.

Encontrar tipografías del mismo diseñador: diseñadores de tipografías muchas veces emplean una estética parecida en sus diferentes tipografías. Compartirán una estructura parecida que las permita combinarse bien. Busca familias tipográficas llamadas “super familias” que vienen con una versión serif y sans-serif que están diseñadas específicamente para que se complementen.

Alegreya⁠

Alegreya Sans⁠

Merriweather⁠

Merriweather Sans⁠

son super-familias tipográficas (y gratuitas).

⁠