Email

[email protected]

Teléfono

(33) 3124-1285

Dirección

Av. México 3370 Int. 10T
Col. Mónraz C.P. 44670
Guadalajara, Jalisco

¿Cómo elegir la tipografía de mi página web?

¿Cómo elegir la tipografía de mi página web?

A la hora de planificar nuestro sitio web pensamos en el contenido, la estructuración de la información, la usabilidad y el diseño, pero en ocasiones no le damos la importancia que se merece a la tipografía y nos enfocamos bastante en las imágenes y los colores, olvidando que el tipo de letra que elijamos no sólo le dará equilibrio a nuestro diseño, si no que el usuario lo agradecerá, ya que leer lo que tenemos para ofrecerle será más fácil.

Como usuario particularmente, creo que no hay nada más molesto que entrar a un sitio web y encontrar inconsistencias en la letra, sobre todo, que la fuente elegida sea algo compleja de leer, que los colores varíen y sean demasiado fuertes e incomodos a la vista o tonalidades tan bajas que ni si quiera se noten y tener que forzar la vista para leer.

Seguramente te has topado con sitios web que tienen 5 tipos de letra, de las cuales algunos textos tienen letras más grandes que otros, diferentes fuentes, algunas líneas en cursiva, en negritas o subrayadas, es verdad que jugar con los textos nos ayuda a llamar la atención y que nuestros escritos no sean cansados o resaltar fragmentos importantes, pero la realidad es que funciona, sólo si lo usamos con moderación y siguiendo buenas prácticas.

La comunicación escrita desempeña un papel vital en el diseño: es esencial para establecer una conexión clara entre el sitio web y el usuario y ayudar a los usuarios a lograr sus objetivos.

“Más del 95% por ciento de la información en la web está en forma de lenguaje escrito”.

A continuación, te comparto una pequeña lista de pasos a seguir, para hacer una buena elección de tipografía para usar en tu página web. 

Consejos para elegir la tipografía de tu página web.

 

1.- Usar tres tipos de fuentes como máximo

El uso de más de 3 fuentes diferentes hace que un sitio web se vea desestructurado y poco profesional. Toma en cuenta que demasiados tamaños y estilos de letra a la vez también pueden arruinar cualquier diseño.

Lo más recomendable es sólo usar dos, una para los títulos y sub títulos y otra para el resto de los textos, para hacer variaciones puedes poner algunos textos en cursiva o resaltar en negritas.

Si utilizas más de una fuente, asegúrate de que las familias de fuentes se complementen entre sí en función de su ancho de caracteres. Tome el ejemplo de combinaciones de fuentes a continuación.

Un buen ejemplo podría ser el siguiente: La combinación de Georgia y Verdana (izquierda) comparte valores similares que crean un emparejamiento armonioso.

2.- Utilizar fuentes estándar

Se recomienda utilizar fuentes estándar a las que los usuarios están acostumbrados a ver, ya que, están tan familiarizados con ellas que pueden leer más rápido y sin problemas.

Los servicios de incrustación de fuentes (como Google Web Fonts o Typekit) tienen muchas fuentes interesantes que pueden dar a tus diseños algo nuevo, fresco e inesperado. También son súper fáciles de usar.

3.- Longitud límite de línea

Tener la cantidad correcta de caracteres en cada línea es clave para la legibilidad de su texto. No debe ser su diseño el que dicta el ancho de su texto, también debe ser una cuestión de legibilidad.

Para tener una idea de nuestro límite de texto en los diseños, podemos basarnos en este consejo de legibilidad y longitud de línea del instituto Baymard:

“Debes tener alrededor de 60 caracteres por línea si quieres una buena experiencia de lectura. Tener la cantidad correcta de caracteres en cada línea es clave para la legibilidad de su texto”.

Para dispositivos móviles, debe elegir entre 30 y 40 caracteres por línea .

4.-Elegir un tipo de letra que funcione bien en varios tamaños de dispositivos.

Los usuarios accederán a su sitio desde dispositivos con diferentes tamaños de pantalla y resoluciones.

Es importante elegir un tipo de letra que funcione bien en varios tamaños y pesos para mantener la legibilidad y la usabilidad en todos los tamaños.

Asegúrate de que el tipo de letra que elijas sea legible en pantallas más pequeñas, también es importante evitar las fuentes que usan escritura cursiva como Vivaldi, ya que son muy difíciles de leer.

5.- Asegúrate de usar fuentes con letras distinguibles.

Muchos tipos de letra hacen que sea demasiado fácil confundir formas de letras similares, específicamente con «i» y «L”, como se ve en la imagen a continuación:

4. Elija un tipo de letra que funcione bien en varios tamaños

Los usuarios accederán a su sitio desde dispositivos con diferentes tamaños de pantalla y resoluciones.

Asegúrate de que el tipo de letra que elija sea legible en pantallas más pequeñas y trata de evitar las fuentes que usan escritura cursiva, como Edwardian Script ITC.

6.- Evitar textos largos en mayúsculas

Cuando su mensaje implica lectura, no obligue a sus usuarios a leer todo el texto en mayúsculas, la impresión en mayúscula retarda en gran medida la velocidad de escaneo y lectura en comparación con el tipo de letra minúscula.

7.- Cuidar el interlineado de los textos al construir los párrafos.

En tipografía, tenemos un término especial para el espaciado entre dos líneas de texto: inicio (o altura de línea). Al aumentar el inicio, aumenta el espacio en blanco vertical entre líneas de texto, generalmente mejorando la legibilidad a cambio de espacio en la pantalla.

8.- Utilizar contraste de color adecuadamente

No use los mismos colores o colores similares para el texto y el fondo. Cuanto más visible es el texto, más rápido los usuarios pueden escanearlo y leerlo.

Ejemplo de contraste adecuado:

Conclusión: 

Con estos puntos, podemos confirmar cuán importante es la elección de tipografía para comenzar con nuestro diseño para desarrollar una página web, y no sólo es cuestión de diseño y de usabilidad, también le facilitamos el trabajo a los programadores al elegir una fuente que sea compatible con todos los dispositivos.

Recuerda que realizar un sitio web no es cualquier cosa, si piensas en hacer una buena inversión, acércate a profesionales, en Imaquina, estamos encantados de ayudarte, tu proyecto es nuestro proyecto. ¡Contáctanos! 

Comentarios