Cuando se trata de diseño web, una gran tipografía es uno de los factores que influyen en una buena experiencia de usuario. A menudo se le suele prestar mayor atención a la barra de menú, esencial para que el usuario pueda navegar por el sitio, pero un gran número de factores son los que se toman en cuenta al momento de evaluar la experiencia de usuario. En este artículo nos centramos en la tipografía y te damos algunos consejos para poder mejorar la UX mediante el uso apropiado de las fuentes.
Selecciona fuentes en base a su legibilidad
La legibilidad es uno de las principales características que se busca en toda fuente web. No sólo se debe analizar las particularidades de cada fuente para verificar que ningún carácter puede ser confundido por otro, sino también se debe reforzar la legibilidad de tus texto eligiendo el tamaño y color adecuado.
Una opción popular en el diseño web es el uso de fuentes sans serif para cuerpo de texto pues usualmente éstas poseen mayor legibilidad que otro tipo de fuentes. Deberás elegir una fuente sencilla que sea altamente legible y evitar los formatos especiales como negritas o itálicas que sin duda captarán la atención de tu audiencia por ser una opción inusual, pero complicarán la lectura del texto en general.
Considera las fuentes que poseen una altura X mayor
La altura de los caracteres de la fuente que elijas para tu diseño puede afectar la facilidad de lectura de tu contenido. Mientras más altas sean las minúsculas de la fuente, serán más legibles. Usualmente, en este tipo de fuentes la diferencia de altura entre mayúsculas y minúsculas es menor que en otras, pero no por ello menos notoria. Es decir, no tienes que preocuparte que los usuarios no distingan entre mayúsculas y minúsculas, una situación que sin duda puede ser confusa para muchos usuarios.
Haz uso de un interlineado adecuado
Otro punto a tener en cuenta para poder reforzar la legibilidad es el interlineado, particularmente importante para dispositivos móviles, donde un interlineado mayor contribuye a la fácil lectura de los textos. Por supuesto, todo ello depende de diversos factores como la altura de la fuente que estás empleando, la cantidad de texto, el tamaño de la fuente, al ancho de la pantalla para la que estás diseñando, etc. Ya que son varios elementos los que influyen en el interlineado no existe una fórmula que funcione en todos los casos. Deberás lograr el interlineado perfecto para cada dispositivo en base a las pruebas que realices.
Trabaja con proporciones
Debido a la gran cantidad de dispositivos que existen en la actualidad desde los cuales se puede acceder a internet, es mejor trabajar en proporciones al momento de desarrollar wireframes. Por supuesto, parece que sólo es más carga de trabajo para ti, pero podría ser de gran ayuda más adelante; ya sea que decidas empezar a diseñar en base a un ordenador o en base a un smartphone.
Aplica las proporciones también a las fuentes. Por ejemplo, si ya has encontrado el interlineado ideal para tu diseño en ordenadores, analiza cómo es que se enlaza con el tamaño de fuente y cómo es que funcionan los porcentajes en ese caso. Hacer este cálculo matemático te ayudará a establecer las proporciones adecuadas para tus fuentes cuando estés diseñando para otros dispositivos de mayor o menor tamaño.
Selecciona fuentes con ancho de bastón uniforme
El ancho de bastón también influye en la legibilidad de la fuente. Si son muy delgados existirán problemas de contraste y la lectura se complicará para los usuarios. Por otro lado, las fuentes de bastones muy gruesos pueden ser causantes de estrés visual en los usuarios, de modo que su vista se cansará más rápidamente al intentar leer el texto.
Las fuentes que poseen bastones de ancho variable son bastante atractivas, pero también pueden presentar problemas de legibilidad, particularmente cuando la diferencia entre los anchos de bastones es realmente notoria.
La solución a estos diferentes problemas en optar por fuentes que posean un ancho de bastón uniforme, al menos en el cuerpo de texto. Sabemos que quizá quieras optar por fuentes más artísticas o decorativas en la página de inicio, una elección completamente válida, pero cuando se trata de cuerpo de texto, te sugerimos seleccionar las fuentes más sencillas.
Limita el número de fuentes que usas en tus proyectos
En un proyecto de diseño es muy recomendable usar como máximo dos tipografías. Cuando seleccionas muchas fuentes diferentes para tus textos, puedes llegar a confundir a tus usuarios y por sobre todo, les dificultas la lectura. Esa es una situación que debes evitar a toda costa, el texto que colocas en tu sitio es parte esencial del mismo, y por lo tanto debes asegurar la legibilidad de todos tus textos.
También puedes optar por una fuente que posea diversas variaciones, de esa manera mantienes una línea gráfica y eliges una variación para los títulos y las palabras que quieras destacar de tu texto.
En conclusión…
Seleccionar fuentes es otra tarea compleja que debe realizar todo diseñador. Pero no basta con elegir una tipografía legible, es esencial verificar el tamaño e interlineado adecuados, modificar el kerning si es necesario, optimizar el contraste entre el fondo y la fuente, trabajar sobre la jerarquía tipográfica, etc. Como ves, hay muchos detalles que debes afinar para poder optimizar la tipografía en un sitio web.
