Trucos y Consejos para Combinar Tipografías

Aunque en los últimos años el uso de las imágenes y los videos cada vez está más extendido, sobre todo en la web, gracias a la velocidad de las conexiones, el contenido en formato texto sigue siendo esencial. Esto es algo que, como diseñadores, no debemos olvidar o dejar relegado a un segundo plano. Aquí es donde entran en juego el uso de las tipografías para que la navegación y la lectura sean visualmente amigables y legibles. Y las combinaciones de tipografías para crear entornos más atractivos.

Solo hay que hacer una pequeña búsqueda para ver la cantidad de artículos que hay al respecto sobre combinaciones de tipografías, incluso en Silo tenemos algunos por si os interesan. Pero en esta ocasión queremos ir un paso más allá y no daros todo el trabajo hecho, sino las herramientas con las que podáis crear vuestras propias combinaciones de fuentes.

Aunque pueda parecer una pérdida de tiempo (si, es más rápido buscar en Google, hacerse con algún listado de combinaciones y listo), conocer estos pequeños trucos no solo nos van a ayudar a ser unos diseñadores más independientes, sino a conocer como funcionan los engranajes del diseño cuando maquetamos un texto, y que hace que ciertas tipografías funcionen y otras no. Incluso saber por qué una combinación puede funcionar en un blog, pero quizás no funcione en un portfolio.

Todo esto lo hemos querido resumir en siete puntos diferentes, pero con cosas en común, y que nos vana ser como punto de inicio para crear unas propias combinaciones de tipografías. No tardemos más y veamos cuales son.

Crea una jerarquía visual

Crear una jerarquía visual es algo que podemos ver ya en soporte físico, como periódicos y revistas. Factores como el tamaño de la tipografía, su grosor, el espacio en blanco que dejamos a su alrededor… hacen que podamos navegar a través del medio donde estén las fuentes, y podamos diferenciarlas fácilmente de forma visual. Y todo esto lo podemos aplicar al combinar tipografías.

portada de la web del Washington Post, con diferenciacion entre titulares y texto del articulo

Si elegimos varias en las que estás características sean demasiado similares, confundiremos al lector, y no sabrá cuales son los elementos principales y secundarios. Esto puede llegar a crearle cierta confusión, y no saber dónde empieza y acaba cada una de las secciones que componen cualquier proyecto, ya sea una web, o la maquetación de un libro.

No olvides el contraste

Ya hemos hablado de cómo el contraste nos sirve para potenciar nuestros diseños. El contraste es un elemento que también podemos utilizar cuando vayamos a hacer combinaciones de tipografías. Y, como hemos mencionado en el punto anterior, nos va a servir para crear cierta jerarquía visual. Con contraste no solo nos referimos a que una tipografía este en negrita y otra no. El contraste también se crea entre una fuente con formas redondeadas y otra con forma poligonales y ángulos muy acusados. O que en una el espacio entre caracteres sea muy amplio, y en la otra muy pequeño.

Combina serif con sans serif

Serif vs sans serif. Este es uno de los principios básicos cuando nos disponemos a combinar tipografías, y casi podemos asegurarnos un buen resultado. Para textos muy largos, en los que primemos la legibilidad sobre la ornamentación o el impacto visual,debemos decantarnos por las serif. También son muy apropiadas para su uso en soporte físico.

diferencias entre fuente serif y sans serif

Por otra parte, las sans serif son ideales para mostrar en una pantalla, ya que al tener un trazo más simple, se adaptan mejor a cualquier tipo de tamaño y resolución. Además de mostrarse de forma más clara para el ojo.

Piensa qué función va a tener de cada tipografía

Es un error bastante común para aquellos que buscan las típicas listas de «las mejores combinaciones de tipografías», pero no saben muy bien como aplicarlas. Porque si, hay que reconocer que función va a tener cada tipo de fuente dentro de nuestro texto. En textos cortos, tales como titulares o textos que usamos para crear más impacto, no hay que cortarse en usar tipografías más ornamentales o que no sean muy habituales. Por ejemplo, hemos hablado en Silo sobre las tipografías estilo handwritten, que podríamos usarlas perfectamente en estas situaciones.

Por el otro lado, en los cuerpos de los textos lo principal es la legibilidad. Todo aquello que nos aleje de la velocidad de lectura, la claridad de los caracteres y, en definitiva, lo que nos sirva de distracción del contenido, deberíamos evitarlo. Aquí lo primordial es el contenido del texto, y no la forma. La elección de la tipografía en este caso no es más que un instrumento para que la lectura sea lo más cómoda posible.

No tengas demasiadas tipografías diferentes

Es habitual que vayamos aumentando nuestra biblioteca conforme vamos descubriendo nuevas fuentes que nos gustan, o que pensamos que pueden encajarnos en futuros proyectos. El problema llega es cuando queremos utilizar muchas dentro de un mismo proyecto: una tipografía para los títulos, otra para los subtítulos, otra para el cuerpo de los textos, otra para los pies de fotos, otra para algunos elementos que queramos resaltar… Debemos pararnos los pies a nosotros mismos, y evitar esta situación a toda costa.

En primer lugar, porque como diseñadores y/o maquetadores, no es una forma óptima de trabajar. Si cada vez que vamos a insertar un texto, tenemos que consultar que fuente hemos elegido para ese caso concreto, es que algo estamos haciendo mal. Y en segundo lugar, aunque el lector no tenga conocimientos sobre el mundo de las tipografías, va a notar toda esta amalgama de letras diferentes, y no será de su agrado.

maquetación de artículo con cuatro fuentes diferentes
Diseño de artículo con cuatro tipografías diferentes, que resulta excesivo a la vista

Mi recomendación es siempre usar combinaciones de dos tipografías diferentes en un mismo proyecto, o a lo sumo tres. Y tener muy claro cual va a ser la función de cada una. Nos evitaremos muchos tiempos muertos a la hora de trabajar, y la lectura será más amigable.

No uses tipografías muy similares

Podemos echar por tierra todo lo ganado gracias a la creación de una jerarquía visual y el contraste si acabamos usando tipografías con líneas muy parecidas. Y con muy parecidas nos referimos a que sus proporciones son similares, o tienen ciertos caracteres casi iguales.

Para esto, lo ideal es realizar un pequeño ejercicio. Escribe varias palabras al azar con una de las tipografías, y compáralas con las mismas palabras usando la otra tipografía. Si notas que hay ocasiones en que te cuesta distinguir a que fuente corresponde cada palabra, debe encenderse una voz de alarma en tu cabeza. Y quizás deberías elegir otra combinación.

Practica (mucho) con diferentes escenarios

Lo dejamos para el final, pero es un punto importantísimo. Cada vez que crees una combinación de tipografías, testéalos en un proyecto. Ya sea alguno que hayas realizado en el pasado, o uno imaginario que crees sobre la marcha. Y que no sean todos del mismo estilo, ya que no todas las combinaciones van a funcionar bien en cualquier lugar. No es lo mismo un blog de moda, la maquetación de un manual para una escuela, o un tríptico de un evento cultural. En un SiloMag hablamos sobre UI Coach, que nos creaba de forma aleatoria proyectos web con los que practicar. Es un buen punto de partida donde poder insertar las combinaciones que vayamos creando, y ver si encajan de forma correcta.

Y con esto terminamos. Como hemos podido ver, son conceptos simples pero que deberíamos tener siempre en consideración cuando intentemos crear combinaciones de tipografías por nosotros mismo. Que no solo nos ayudará para esto, sino que nos dará cierta soltura para saber qué tipos de fuentes se amoldan mejor según su función, jerarquía y contexto dentro del proyecto completo.

Esperemos que os haya resultado de utilidad y, como siempre, tenéis disponibles los comentarios para que nos hagáis llegar vuestras impresiones y experiencias. Además de poder compartir vuestras propias combinaciones de fuentes, y como habéis llegado hasta ellas.

Comentarios (4)

      1. Personalmente, creo que la más valiosa es la de tener siempre claro el crear una jerarquía visual entre tipografías, ya que es lo primero que vamos a notar al acceder a cualquier sitio. Y la que nos va a permitir que nuestros visitantes y/o lectores consuman el contenido en el orden que queramos.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *