Cómo elegir y combinar las tipografías de tu web

Lo confieso. Me encantan las letras bonitas: la tipografía, el lettering y la caligrafía.

Me pierdo en Pinterest. Me pierdo en las herramientas online para crear combinaciones tipográficas. Me pierdo entre las webs con tipos de letra bonitos. Y me pierdo por las calles mirando carteles y letreros. Me encantan los letreros antiguos de las tiendas de toda la vida. Y es que las tipografías hablan por sí mismas y combinarlas es un arte como otro cualquiera.

Y aquí aparco mi predilección por las letras bonitas porque el objetivo de este artículo no es hablarte sobre mis gustos sino darte unas pautas para elegir las tipografías de tu web.

¿Cuántas?

Otra vez la famosa frase: menos es más. No hay una respuesta universal pero como recomendación una con diferentes estilos o dos son más que suficientes para crear una web con jerarquía, coherencia y personalidad.

¿Qué quieres transmitir?

Las tipografías sirven para escribir y contar mensajes pero ellas mismas con sus formas y sus trazos son capaces de comunicar sensaciones.

Por lo tanto, elegir las tipografías en función de la imagen de marca que quieres proyectar reforzará el mensaje. Dentro de cada grupo hay infinidad de tipografías diferentes y las sensaciones que transmiten pueden variar pero en general estos son los valores que se asocian con los principales tipos de letra. No es algo radical. Las tipografías se utilizan en un contexto y rodeadas de otros elementos que en conjunto son los que marcan las sensaciones transmitidas.

Serif.

Se caracterizan por tener remates en los extremos y sus trazos suelen tener diferente grosor.

Se asocian con clasicismo, elegancia, formalidad.

Se utilizan, por ejemplo, en moda.

Sans serif.

No tienen remates y sus trazos suelen tener el mismo grosor.

Se asocian con modernidad, minimalismo, dinamismo, neutralidad.

Se adaptan a casi todos los proyectos. Se utilizan en negocios online.

Slab serif.

Similar a las serif pero con los remates más rectos.

Transmiten fuerza y robustez.

Se utilizan en proyectos online.

Caligráficas.

Imitan la escritura manual. Sus trazos son regulares. 

Se asocian con elegancia, exclusividad.

Se utilizan, por ejemplo, en sectores relacionados con el lujo.

Manuscritas.

Imitan también la escritura manual pero son más variadas y sus trazos más irregulares que los de las caligráficas. 

Dentro de esta familia hay fuentes tan diferentes que se pueden asociarse con cercanía, delicadeza, feminidad, creatividad.

Se utilizan en negocios de lo más variado, restaurantes, marcas handmade, negocios digitales.

Display.

Son tipografías decorativas y diferentes unas de otras.

Tienen una personalidad muy definida.

Se utilizan para títulos, carteles o logotipos. No son apropiadas para textos porque su legibilidad es complicada en textos largos.

Y estas son las sensaciones que se asocian con los diferentes estilos tipográficos:

Negrita o bold.

Fuerza, importancia, robustez.

Light.

Ligereza, minimalismo, delicadeza.

Cursiva.

Elegancia.

¿En qué tipo de textos las vas a utilizar?

—> Bloques de texto. En este caso es imprescindible elegir una tipografía con buena legibilidad. Si elegimos, por ejemplo, una tipografía decorativa para un texto largo no se leerá bien. Las más indicadas por su buena legibilidad en pantalla son las tipografías sin serif o de palo seco. No obstante, hay excepciones y algunas tipografías con serif también tienen buena legibilidad.

—> Títulos y textos cortos. Los textos cortos y destacados dejan mayor libertad a la hora de elegir tipografía. También es necesario que sean legibles, sin embargo, no es necesario mantener la atención de forma continuada para leerlos por lo que se pueden utilizar tipografías en función de la estética y de la sensación que se quiera transmitir. 

Tanto las serif como las sin serif van bien para títulos y textos cortos destacados.

—> Palabras destacadas y detalles. A veces es interesante destacar alguna palabra por encima del resto, una sección del menú, el texto de un botón, el nombre de un apartado. Y aquí la libertad es aún mayor que en los títulos. Según la imagen que se quiera dar se pueden utilizar tipografías caligráficas o manuscritas. Las manuscritas son tipografías con mucha personalidad, suelen ser más difíciles de leer y si se abusa de ellas pueden recargar y cansar demasiado pero pueden quedar bien como detalle. 

¿Cómo combinarlas?

Una sola tipografía:

Combinando grosores y estilos.

Dos tipografías:

Que sean diferentes entre ellas para que haya contraste y se note.

Que una tenga más personalidad que la otra. Una sencilla y con buena legibilidad para los textos y otra con más personalidad para los títulos y destacados.

Por ejemplo, una con y otra sin serif.

¿Quieres jugar a combinar tipografías?

Aquí te dejo dos herramientas que te encantarán.

typ.io. Muestra ejemplos reales de combinaciones tipográficas a partir de la que elijas.

https://www.canva.com/font-combinations/. Sugiere combinaciones a partir de una tipografía.

Estos son algunos criterios para elegir y combinar las tipografías. Pero como siempre, cada proyecto es único, tiene unas necesidades y un estilo que se tiene que ver reflejado tanto en el tono de voz como en el diseño. No sé si te pasa, pero a mí cuando llego a la tipografía adecuada algo me hace click y me dice que he llegado a la que buscaba.

Y tú, ¿qué criterio sigues para combinar tipografías? Te leo en los comentarios.