Esta web utiliza cookies para que podamos ofrecerte la mejor experiencia de usuario posible. La información de las cookies se almacena en tu navegador y realiza funciones tales como reconocerte cuando vuelves a nuestra web o ayudar a nuestro equipo a comprender qué secciones de la web encuentras más interesantes y útiles.
Mejorar la legibilidad y comprensión para hacer mejores productos
Diseño UX
03/8/2021
|
Torresburriel Estudio
La legibilidad (legibility) es la facilidad con la que una persona puede leer y comprender un texto. Depende de cómo están construidas las frases, pero también de los elementos tipográficos o la presentación y estilo de la página, lo que la relaciona también con la presentación visual del contenido.
Por otra parte, la comprensión (readability) es la facilidad en la percepción del contenido escrito, y combina la percepción visual con la claridad del texto.
Hablando desde el punto de vista del diseño UX hay varios aspectos que influyen en la legibilidad y comprensibilidad de los textos:
- Fondo
- Tipografía
- Jerarquía visual
- Espacio negativo
- Textos
Fondo
El color de fondo tiene un gran impacto en la capacidad de distinguir los elementos y el contenido de una interfaz.
Normalmente es más fácil leer contenido oscuro sobre un fondo blanco, aunque también se pueden invertir los colores y diseñar en modo oscuro. El esquema de color juega un papel muy importante en la legibilidad y puede tener un impacto negativo para la experiencia de usuario si la selección de colores no es la adecuada. ¿Quieres profundizar más en el tema? Este hilo de Twitter te ayudará a ello:
Justo ese hilo trata muchos temas de accesibilidad cuando elegimos los colores de nuestro producto. Podemos utilizar herramientas para verificar que el contraste y otros aspectos de la legibilidad cumplen los estándares para que sea accesible para todo el mundo.
Tipografía
La elección de la tipografía influye directamente en la rapidez y facilidad con la que los usuarios podrán leer e interpretar el producto.
Dentro de la tipografía hemos de tener en cuenta aspectos como el tamaño de la fuente, la alineación del texto, el interlineado e interletrado, la longitud de línea e incluso la distancia que hay entre los diferentes elementos.
Como puedes ver en la imagen superior, la elección de la tipografía facilitará o incluso impedirá la lectura de los textos de tu producto.
Jerarquía visual
La jerarquía visual es la forma de organizar el contenido para que estén claros los niveles de prioridad de cada apartado. Cuando la creamos conseguimos que haya una diferencia entre los elementos y el diseño sea más organizado, fácil de entender, y, además, sea atractivo visualmente.
Para diseñar la jerarquía visual tenemos que tener en cuenta los tamaños de los elementos, el color y el contraste, la jerarquía tipográfica, las diferentes tipografías, el espacio negativo y la composición. (Ver también: Tree test para validar una jerarquía de contenidos)
Espacio negativo
El espacio negativo (o espacio en blanco) son las zonas del diseño que se dejan vacías. Lo podemos encontrar alrededor de los objetos o dentro de ellos, y se utiliza para crear las composiciones del diseño. Por cierto, no tiene que ser blanco, sino que basta con que pase desapercibido, para ayudar a reducir la fricción que pueden provocar los textos.
Si utilizamos bien las cantidades de espacio negativo, podemos facilitar la interpretación del contenido. Por ejemplo, un texto corto debajo de una imagen nos indica que están conectados, como es el caso de la leyenda de una imagen.
Utilizado de forma correcta, el espacio negativo nos ayudará a mejorar la experiencia general de nuestro producto, sirviendo a los objetivos de negocio .
Textos
Y por supuesto los textos también son una parte muy importante para mejorar la legibilidad de un producto. Es tan importante que cuenta con su propia disciplina dentro de la experiencia de usuario: UX Writing.
Los textos tienen que ser claros, concisos, útiles y coherentes para todas las personas.
Consejos para mejorar la legibilidad y la comprensibilidad
- Sé breve y coherente en toda la interfaz. Si has elegido un término para describir una acción específica, utilízalo siempre que haya que realizar esa acción.
- Plasma una idea en un bloque de texto. Para facilitar el escaneo los textos tienen que ser cortos y con una idea concreta en cada párrafo.
- Utiliza números y listas. Los números son más fáciles de interpretar que el texto, lo que facilita la legibilidad y el escaneo del texto. Las listas también funcionan muy bien, ya que nos ayudan a organizar la información de forma clara y captan la atención de las personas.
- Marca visualmente la información clave del texto. El texto en negrita, cursiva o resultado en color ayuda a llamar la atención.
- Comprueba el contraste. El contraste es una de las claves para que un producto sea usable. Nos permite distinguir los elementos e interpretarlos rápidamente, así que tenemos que poner especial atención en este punto y hacerlo accesible para todas las personas.
Aunque hemos separado en diferentes apartados los puntos que tenemos que tener en cuenta para mejorar la legibilidad, todos ellos están estrechamente relacionados y dependen unos de otros.
En definitiva, si quieres mejorar la legibilidad de tu producto lo más aconsejable es crear un sistema tipográfico que te ayude a mantener la coherencia en todo tu producto, y además al tener unas pautas definidas facilitará el diseño.