Principios de UX (II): Consistencia

Saber aplicar los principios UX en una página web no es una tarea sencilla. Hoy, hablamos de la aplicación de la consistencia en usabilidad web como uno de los criterios más importantes.

Cuando un usuario visita una web o aplicación espera encontrarse un sitio en el que encontrar el contenido que busca y realizar una determinada tarea sea un proceso sencillo. Este usuario espera encontrarse algunas similitudes con otros sitios o aplicaciones que ya conoce, lo que le va a permitir sentirse familiarizado con el nuevo sitio sin que le suponga un esfuerzo de aprendizaje. Parece un poco contradictorio, pero cuanto más se parezca el diseño de esta web a las demás, más rápido aprenderá a navegar por ella, lo que mejorará la experiencia de usuario. Esto es la consistencia en UX.

Consistencia y usabilidad

La consistencia se aplica a elementos que se han ido estandarizando en todo el universo WWW, como el botón flotante para “Añadir o crear” o el famoso menú “hamburguesa” para ocultar/mostrar un menú con varios elementos. Podemos mejorar la usabilidad si utilizamos estos estándares, ya que el usuario sabrá perfectamente cómo utilizarlos, pero… ¡qué aburrido sería el mundo si todas las webs fueran iguales! Si todas las páginas usaran el mismo color, tipografía, jerarquía visual… sabríamos navegar perfectamente por todas ellas, pero ¿dónde estaría la diferenciación y la creatividad que nos hacen avanzar? No, no queremos que todas las webs sean iguales, queremos diseños únicos y diferentes, que se adapten a cada marca. Por ello hay que aplicar la consistencia también cuando hablamos de diseños webs a medida: procurando que elementos con un aspecto similar también se comporten de forma similar. Cuando el diseño es consistente, el usuario puede usar su conocimiento en las distintas secciones de la web sin que le suponga ningún esfuerzo adicional, lo que permite que este se concentre en realizar la tarea que quiere realizar, en vez de que se distraiga pensando cómo llegar a esa meta.

Así somos los humanos, nos gusta sentirnos familiarizados con las cosas: la consistencia UX nos aporta seguridad y confianza.

La consistencia visual

La tipografía, el grid, los tamaños, la paleta de color, las imágenes utilizadas… Todos estos elementos deben de estar bien definidos en el diseño de interfaz, para poder usarlos de la misma forma en toda la web o aplicación. Es importante, por ejemplo, que todos los botones de CTA, “Call to Action”, sean del mismo tamaño y color, que los enlaces dentro del texto tengan un formato diferenciado, que el título principal de cada página tenga el mismo peso tipográfico y tamaño, etc.

Ejemplo de diseño de UI Kit (Diseño de Interfaz). Imagen: Deposit Photos.

Para ganar consistencia en usabilidad también hay que diseñar una buena jerarquía visual, teniendo en cuenta que los elementos más importantes tienen que ser más llamativos que el resto; elegiremos un grid y lo respetaremos en todas las páginas de nuestra web; respetaremos los márgenes y paddings de los distintos elementos (botones, títulos…). Tener una consistencia visual permitirá al usuario aprender rápido y tener una mejor experiencia en nuestro sitio.

Consistencia en la voz y tono (UX-Writting)

Debemos intentar que todo el sitio web hable con una única voz y con un mismo tono. Por ello, debemos cuidar también todos los textos que se puedan leer en nuestra página, sin olvidar el microcopy (los textos de los botones, los mensajes de error de formularios… es decir, de todos los elementos interactivos).

Todos los textos tienen que tener consonancia entre ellos, pero también las imágenes tienen que ser consistentes con este tono: No tendría sentido una web destinada a adolescentes en los que los textos hablen de “usted” y las imágenes sean meros recursos aburridos de banco de imágenes. Lo normal, para este público, sería mostrarse divertido y amigable, con un tono que hable de tú y use un lenguaje similar al que emplea su público objetivo:

Imagen: Fanta.

Como ejemplo, podemos ver la web de Fanta, web dirigida a adolescentes: usa colores vivos, imágenes divertidas y bien trabajadas y, en sus textos, utiliza un tono fresco y directo, usando incluso anglicismos: “Los barrios más cool de Europa”

¿Ya sabes cómo aplicar la consistencia en usabilidad?

Mantener la consistencia en tu web, mejorará su usabilidad, el usuario se sentirá cómodo y logrará sus objetivos de forma fácil (estos objetivos tienen que ir muy alineados con tus tuyos, por supuesto). Por eso te aconsejamos que encuentres tu tono de voz (y el de tu público) y lo apliques a todo aquello que comunique tu marca, especialmente tu web.