“No me hagas pensar: una aproximación a la usabilidad en la web” es uno de los libros más interesantes acerca de este campo que se pueden encontrar en el mercado. En este nuevo post te explicamos por qué.
Comprensión de las cosas
En “No me hagas pensar: una aproximación a la usabilidad en la web”, su autor, Steve Krug, apunta que la usabilidad no va de tecnología, sino de cómo la gente comprende y usa las cosas.
Esto es, consiste en decidir qué queremos que suceda después de que un usuario haga clic, pulse o arrastre; los temas de interacción y arquitectura de información (cómo cada cosa debe ser organizada), etc.
Así, la definición de usabilidad web que establece Steve Krug es la siguiente:
- Útil: posibilita algo que la gente necesita hacer.
- Comprensible: consigue que la gente pueda imaginarse cómo usarlo.
- Recordable: la gente no tiene que reaprenderlo cada vez que lo emplee.
- Eficaz: realiza el trabajo.
- Deseable: lo quiere la gente.
- Delicioso: usarlo es agradable e incluso divertido.
Qué hay que tener en cuenta para que un sitio sea fácil de usar
La respuesta, pese a lo que pudiera parecer, es sencilla: no se trata de que nada importante esté a más de dos clics de distancia, de hablar el lenguaje del usuario o de ser coherente… sino de que el usuario pueda decir: “no me hagas pensar”.
En ocasiones, en internet los interrogantes que nos surgen aumentan nuestro volumen de trabajo cognitivo y distraen nuestra atención de la tarea que tenemos entre manos. Unas distracciones que pueden ser leves, pero que en ocasiones se acumulan y pueden incluso llevarnos a abandonar esa tarea.
De este modo, el objetivo de cada página web tendría que ser el de resultar evidente, que el usuario medio con solamente mirarla pueda saber de qué trata y de qué forma usarla. La realidad del mercado digital es que la competencia está solamente a un clic. Por eso, si se frustra a un usuario, no dudará en irse a cualquier otro site.
Usabilidad web: cómo usamos una web
Muchas veces nos liamos intentando crear literatura de calidad pensando que va a ser leída al detalle, cuando la realidad es más la de los usuarios viendo los contenidos como si se tratara de un anuncio publicitario que pasa a 100 km/h.
Si quieres diseñar páginas eficientes, debes entender que la gente no tiene tiempo. Hay que convivir con las siguientes realidades de la usabilidad web:
No leemos páginas, las escaneamos
- Tenemos prisa. Usamos internet porque queremos ahorrar tiempo, con una idea muy concreta. Somos, por tanto, tiburones.
- Sabemos que no hay que leerlo todo. En la mayoría de los casos nos interesa sólamente algo muy concreto. Cosas que se ajustan a nuestros intereses y a la tarea que tenemos que solucionar. El resto es irrelevante.
- Somos buenos en ello. Una vez el ser humano aprende a leer, aprende a escanear entre la información, como hacemos al leer un periódico.
En definitiva, lo que leemos de una página depende de lo que tenemos en nuestra mente.
No tomamos decisiones óptimas, es suficiente satisfacer
En el diseño de una página tendemos a pensar que el usuario escanea, considera las opciones disponibles y elige la mejor. La realidad es otra. Ante un problema, se toma la primera solución que no tiene contraindicaciones.
¿Por qué los usuarios de internet no buscan la mejor opción?
- Normalmente tenemos prisa, lo que deriva en la búsqueda de la satisfacción por encima de la optimización.
- El sopesar distintas opciones no garantiza el éxito. Suele ser más rentable hacer caso de la primera suposición y usar el botón para atrás si no funciona.
- Adivinar es más divertido. Supone menos trabajo sopesar las opciones y es más rápido si la suposición es correcta. Además, se introduce el concepto de “la grata posibilidad de dar con algo sorprendente y bueno”.
No averiguamos cómo funcionan las cosas, simplemente nos apañamos
Así como nos inventamos nuestra propia historia para seguir adelante con el uso de un electrodoméstico, y no leemos las instrucciones sino que las hacemos propias, con Internet es lo mismo. Esto ocurre porque:
- No nos importa. Carece de importancia llegar a entender cómo es el funcionamiento de algo, siempre y cuando podamos usarlo.
- Si damos con algo que funciona, seguimos con ello. Solamente usaremos otra opción si por casualidad encontramos una solución B que nos satisfaga más.
Así pues, sabiendo que el usuario pasa velozmente por nuestro site, hay cinco claves a tener en cuenta para asegurarnos de que ve y entiende la mayor parte del sitio.
- Aprovechamiento y uso de las convenciones.
- Creación de una jerarquía visual clara en cada página.
- División de las páginas en zonas bien definidas.
- Dejar claro sobre qué se puede hacer clic.
- Eliminar el ruido visual.
- Formatear el contenido para facilitar el escaneo.
Vamos a detallar algo más cada uno de estos aspectos sobre la usabilidad web:
Los convencionalismos son nuestros aliados
Innova cuando sepas que tienes una idea mejor. Sino pégate a las convenciones, esas señales inequívocas y universales, como son la colocación estandarizada de elementos, cómo funcionan, cómo se ven…
Creación de una jerarquía visual clara
- Los elementos más importantes deben ser los más destacados.
- Lo que está relacionado por lógica también debe estarlo de forma visual.
- Los elementos se agrupan visualmente para mostrar que son parte de algo (como las noticias en las diferentes secciones del periódico).
División de las páginas en zonas claramente definidas
Resulta muy importante generar espacios visuales claramente definidos para que el usuario pueda decidir, rápidamente, cuál es el bloque que le interesa y cuál el que desea desechar.
Dejar bien claro aquello sobre lo que puedo hacer clic
En la mayoría de las situaciones, el usuario busca un sitio para hacer clic. O lo que es lo mismo, Internet es una herramienta de búsqueda. Identificar esa acción es primordial.
Mantener el ruido bajo control
Uno de los grandes enemigos, sin duda, del buyer journey.
- Ruido. Cuando todo grita para llamarte la atención.
- Desorganización. No hay rejillas alineando, organizando.
- Desorden. Evitar páginas cargadas de contenido. El ruido oculta el material útil.
Formatear el texto para que sea más fácil de leer
La manera de formatear el texto facilita su comprensión y por tanto, la usabilidad web.
- Usar muchos encabezados. Bien escritos, intercalados en el contenido. Éstos describen los bloques que preceden y ayudan por tanto al usuario a escanear lo que le interesa.
- Escribir párrafos cortos.
- Usar listas de bolos.
- Destacar en negrita los términos clave.
¿Por qué le gustan al usuario las opciones mecánicas?
Al usuario no le importa el número de clics que deba hacer mientras el camino sea sencillo y ofrezca confianza.
A la hora de ofrecer algo de orientación cuando sea necesario, ésta funcionará mejor cuando sea:
- Breve: una pequeña cantidad de información que ayude.
- Oportuna: debe estar situada de tal manera que se encuentre cuando se necesite.
- Ineludible: nunca debe pasar desapercibida.
Menos es más
Ya hemos hablado del escaneo en busca de la “palabra de enfoque” que dirija a la “acción”. Reducir el número de palabras que no van a leerse tiene, por tanto, efectos beneficiosos.
- Reduce el nivel de ruido del site.
- Hace que el contenido principal sea más relevante.
- Permite que los usuarios vean más contenido de un vistazo sin avanzar o retroceder.
Por ello, toma nota para mejorar tu usabilidad web:
El discurso excesivo (como las bienvenidas) debe desaparecer.
Hay que eliminar instrucciones innecesarias tales como “rellene el formulario”, “estos son los pasos a seguir”…
Cuidar el diseño de navegación. Un usuario no utilizará tu web, si no se siente cómodo para hacerlo.
Usabilidad web: sistemas de navegación
Para encontrar lo que buscas te sirves de un sistema de navegación y de tu habilidad para echar un vistazo rápido.
Las indicaciones y jerarquías ayudan a encontrar lo que buscas. A medida que vas avanzando en el embudo, dedicas menos tiempo a tomar la decisión sobre si quieres seguir buscando o prefieres pedir ayuda, por lo que mejora tu usabilidad web.
Esta decisión se basa en variables como estas:
- La familiarización con el sitio.
- La confianza en uno mismo.
- La capacidad de organizar las cosas de forma sensata.
- La prisa que uno tenga.
- Lo sociable que también resulte ser.
Navegación web 101
Al navegar por una web, se suele repetir este proceso: normalmente intentas encontrar algo guiándote por señalizaciones y jerarquías. Si no encuentras lo que buscabas, abandonarás. Y eres tú el que decide si preguntar primero o buscar.
Particularidades de búsqueda web
A diferencia de las búsquedas en el mundo real, hay una falta de sensación de la escala o grande que es el site, de la dirección a seguir y de la ubicación.
Propósitos ignorados en la navegación web
Los propósitos esenciales de la navegación web son dos: ayudar a encontrar lo que se busca e informarnos del sitio en el que estamos.
Pero la navegación tiene otros propósitos que a veces son ignorados:
- Nos dice lo que hay en cada lugar. Y lo hace con una jerarquía visible.
- Nos enseña a usar el sitio. Si la navegación es correcta, nos enseñará de forma implícita a usar el sitio.
- Nos permite confiar en las personas que la han creado.
Usabilidad web: convenciones de la navegación web
Por todo ello debemos asegurarnos de ajustarnos a las convenciones de navegación para ser eficientes.
Si el sitio está correctamente diseñado, el usuario debe responder de esta forma: “La navegación está aquí, algunas partes de la página cambiarán según dónde me encuentre, pero la navegación siempre estará aquí y funcionará de forma coherente”.
Las secciones y utilidades
Contienen los vínculos a la navegación principal y secundaria. Las utilidades conviene separarlas de las secciones.
El enlace a la home, simple visible
Normalmente enlazado por convencionalismo al logo.
Camino a seguir
Dado que mucha gente prefiere buscar en vez de echar un vistazo, es necesario tener un cuadro de búsqueda. Aunque, cuidado, debe arrojar correctamente los resultados. De nada sirve tener un buscador, si éste no funciona bien.
Jerarquías
Es fundamental contar con páginas de ejemplo que muestren la navegación en todos los niveles potenciales del sitio antes de empezar a discutir sobre otros temas de diseño.
Nombres de las páginas
- Cada página necesita un nombre. H1.
- El nombre ha de estar en el sitio adecuado, es decir, relacionado como parte del contenido de la página.
- El nombre debe estar destacado.
- El nombre debe tener relación con aquello a lo que se ha hecho clic.
Migas de pan
- Situarlas en la parte superior
- Utilizar el signo “>” entre niveles
- Poner en negrita el último término.
Checklist
Hay que responder de forma rápida a estas cuestiones:
- ¿Qué sitio es éste? Identificador del sitio.
- ¿En qué página estoy? Nombre de la página.
- ¿Cuáles son las principales secciones del sitio? Secciones.
- ¿Qué opciones tengo en este nivel? Navegación local.
- ¿Dónde estoy en el esquema de las cosas? Indicadores del tipo “estás aquí”.
- ¿Cómo busco algo?
Usabilidad web: situar a la gente en el camino correcto
Qué debe tener la página principal:
- Identidad y misión del sitio. Qué es el sitio y para qué sirve y si es posible por qué debemos estar en él y no en otro site.
- Jerarquía del sitio. Debe dar una visión global de lo que ofrece el sitio, tanto de contenido (qué tiene), como de características (qué puedo hacer) y organización.
- Búsqueda. El cuadro de búsqueda tiene que estar a la vista.
- Sugerencias. Convencer con sugerencias de lo bueno que hay en el interior.
- Promociones de contenido. Mejores contenidos, historias novedosas, ofertas…
- Presentación de promociones. Invitar a explorar secciones adicionales o probar nuevas funciones.
- Contenido actualizado. Señales de actividad.
- Transacciones. Anuncios, promociones y potenciados de la marca.
- Accesos directos a lo más visitado.
- Registro visible, si procede.
Además de todo ello, hay que dejar de forma clara lo que se está buscando y lo que no, mostrar dónde empezar la navegación y establecer credibilidad y confianza, además del objetivo y lo más importante del site.
Hay que responder al usuario, y de forma nítida, lo siguiente:
- Qué es esto.
- Qué tienen aquí.
- Qué pueden hacer aquí.
- Por qué debería estar en nuestra web y no en otro lugar.
Cómo transmitir el mensaje en la página principal
- La Tagline (o lema). Se trata de uno de los lugares más valiosos. Es la frase asociada al identificador corporativo. Tiene que lanzar un mensaje claro e informativo en el que se explique exactamente lo que es tu sitio o lo que hace. Debe contar con una extensión ajustada y expresar diferenciación a través de un texto enérgico e ingenioso.
- Mensaje de bienvenida: descripción general del sitio mostrada en un espacio destacado.
- Un espacio necesario para explicar lo que haces (sin emplear más espacio del necesario).
- No hay que establecer una frase relativa a la misión de la empresa como mensaje de bienvenida.
Móviles
¿Cuál es la diferencia de UX en un móvil? No mucha, salvo que los usuarios se mueven más rápido, por consecuencia leen menos en el móvil y se trabaja con menos espacio de pantalla.
Consistencia por compensación
Hay que considerar el diseño como limitaciones (cosas que tienen que hacerse frente a cosas que no pueden hacerse) y compensaciones (elecciones que hacemos para manejarnos en las limitaciones).
Pequeño espacio
Mobile First o el ejercicio de determinar qué es lo más importante sobre lo importante.
Fijarse en las prioridades de uso. Las cosas que se quieren usar con frecuencia o prisa deben estar a mano.
Las limitaciones de espacio se traducen en aplicaciones más profundas en niveles.
Refuerzo de los elementos de comprensión intuitiva (CTAs claros).
Sin cursor no hay texto desplegable (no hay diferencia entre mover y hacer clic).
Simplicidad en el diseño (diseño plano, evitando que los CTA sean confundidos como un elemento de diseño plano).
Ahorro en Mb (fuera de un entorno WiFi la conexión es lenta, por lo que es necesario evitar pesos de archivos y código redundante).
Atributos de usabilidad. Una persona con habilidad y experiencia más o menos normal o incluso por debajo de la media puede descubrir cómo usar algo (es comprensible) para conseguir otra cosa (es efectivo) sin encontrar dificultades (es eficiente).
Placer, comprensión y memorización serían por tanto los atributos principales de una solución móvil.
La usabilidad como cortesía común
Hemos hablado hasta ahora de claridad. Pero hay otro elemento igualmente importante, hacer las cosas bien, con consideración hacia el usuario. Además de preguntarte: ¿es mi sitio claro?, tienes que cuestionarte: ¿tiene cualidad humana?
Evita:
- Esconder información deseada: un teléfono, un coste de envío…
- Pedir información innecesaria.
- Colocar obstáculos en el camino.
- Sitios que parecen de aficionado.
Procura:
- Conocer bien las cosas que los usuarios quieren lograr de tu sitio web. Hazlas obvias y sencillas.
- Di lo que quieren saber. Sé honesto.
- Ahorra pasos al cliente, siempre que puedas.
- Anticípate a las preguntas que probablemente te hagan.
- Facilita la recuperación ante errores.
