Guía para el emparejamiento de fuentes: elección de las mejores combinaciones de fuentes para su sitio web

Como diseñador web, debe tomar muchas decisiones importantes para cada sitio web que cree. Paletas de colores, interacciones de la interfaz de usuario, diseño de navegación, elección de la mejor fuente para su sitio web y mucho, mucho más.

Sin embargo, un área del diseño web en la que es posible que no dedique suficiente tiempo a pensar es el emparejamiento de fuentes.

Elegir una fuente de gran apariencia es una cosa. Una vez que tenga un buen sentido de la voz y el estilo de la marca, será mucho más fácil identificar fuentes que transmitan una vibra similar.

Los sitios web necesitan más de una fuente: para establecer una jerarquía, para mantener a los visitantes interesados ​​con mucho texto y para informarles de manera subliminal más sobre la personalidad y el enfoque de la marca.

Cuando agrega esta capa adicional de complejidad a la mezcla, las cosas pueden complicarse. No solo está emparejando fuentes entre sí; también los está emparejando con su diseño web.

Estoy seguro de que se ha encontrado con escenarios como estos en sus viajes por la web:

• Dos fuentes aburridas hacen que una publicación de blog larga sea muy difícil de leer y terminas hojeando los encabezados para ver si puedes reconstruir la historia de esa manera.
• Una fuente cursiva divertida y única presenta a los visitantes el negocio, solo para que una fuente de cuerpo demasiado pequeña y súper simple contradiga esa primera impresión.
• El sitio web afirma que la empresa adopta un enfoque juvenil e innovador para los negocios, razón por la cual las fuentes retro parecen tan fuera de lugar.

Hay muchas cosas que pueden fallar en el emparejamiento de fuentes si no se toma el tiempo para comprender cómo encajan las fuentes.

En nuestra guía de las mejores fuentes para sitios web, resumimos las características clave que debe buscar:

1. Legibilidad

Una de las razones por las que las serifas son muy preferidas en la literatura y los periódicos es por su legibilidad. Las serifas (pies) en la parte superior e inferior de los caracteres facilitan a los lectores la distinción entre caracteres de apariencia similar como la "I" mayúscula y la "l" minúscula, por lo que no hay desaceleración debido a problemas de comprensión.

Si está diseñando una página con más de 600 palabras, no sería una mala idea utilizar un serif en el cuerpo del texto por esta misma razón.

Dicho esto, si encuentra un sans serif con distintas formas de letras (incluso sin los serif), no tenga miedo de experimentar. Tenemos algunos ejemplos de cómo usar sans serifs tanto en el cuerpo como en el encabezado a continuación.

2. Legibilidad

Una de las razones por las que durante mucho tiempo se pensó que las san serif eran una mejor opción que las serif para el texto en línea era su alta legibilidad. Sin embargo, los estudios han demostrado que hay poca diferencia en la rapidez o facilidad con la que las personas pueden leer textos serif y san serif, al menos en tamaños más pequeños.

Como las resoluciones de pantalla han mejorado enormemente a lo largo de los años, los tipógrafos han podido crear fuentes en ambos estilos que son igualmente legibles. Como explica el NNG:

“La antigua directriz de usabilidad para la tipografía en línea era simple: ceñirse a los tipos de letra sans-serif. Debido a que las pantallas de computadora eran demasiado pésimas para reproducir correctamente las serifas, intentar escribir con serifas en el tamaño del texto del cuerpo resultó en formas de letras borrosas ".

Mientras que otros tipos de fuentes, como las demasiado decorativas, pueden ser demasiado difíciles de leer fuera del texto de encabezado grande, los diseñadores tienen muchas opciones en términos de cómo diseñar el texto en una página con serif y san serif.

Entonces, de lo que debería ser más consciente es del tamaño y el espaciado de sus caracteres, ya que eso tiene un efecto en la legibilidad y la legibilidad.

3. Comodidad

Hay algunos diseñadores web que se muestran reacios a utilizar tipos de letra como Helvetica o Times New Roman debido a su uso excesivo. Sin embargo, la selección y el emparejamiento de fuentes no se trata de cómo se siente acerca de la tipografía de su sitio web, sino de lo cómodos que se sienten sus visitantes al leerlo.

Por lo tanto, no hay vergüenza en elegir clásicos si hacen el trabajo.

4. Estilo

Seleccione tipos de fuentes y fuentes con estilos que se alineen bien con su marca. Por ejemplo, las fuentes serif se sienten más tradicionales y serias en comparación con las fuentes cursivas, que tienden a ser más extravagantes y divertidas.

Puede contarles a los visitantes mucho sobre su marca simplemente eligiendo los tipos de fuentes correctos para empezar.

No pierda de vista estas reglas a medida que avanza en el siguiente paso del diseño con tipografía: