No me hagas pensar (actualización) de Steve Krug

Steve Krug es un referente de la usabilidad web. Muchos diseñadores y desarrolladores web se han basado en sus consejos y recomendaciones para mejorar sus diseños Web con una navegación clara, sencilla e intuitiva. En esta actualización de su libro de referencia ‘No me hagas pensar’, editado por primera vez en el año 2000, se han actualizado algunos ejemplos y se ha añadido un nuevo capítulo sobre la usabilidad móvil. Se trata de un libro pequeño, fácil de leer, interesante y práctico, escrito con un lenguaje sencillo que aporta recomendaciones e ideas a diseñadores y equipos de desarrollo web.

Estas son algunas de las partes del libro que considerado más relevantes para tener en cuenta en el diseño y usabilidad Web:

No me hagas pensar

No me hagas pensar es la primera ley de la usabilidad de Steve Krug. Esta frase resume la esencia de la usabilidad web: claridad, sencillez e intuición.

Para Steve Krug, si una cosa es usable, una persona con una habilidad y experiencia media (o incluso por debajo) puede encontrar la manera de utilizarla para lograr algo sin que encuentre más problemas de los necesarios.

Las siguientes 7 preguntas nos ayudarán a comprobar si nuestro diseño es usable:

  • Útil: ¿hace algo que los usuarios necesitan hacer?
  • Comprensible: ¿permite a los usuarios imaginarse cómo usarlo?
  • Recordable: ¿evita que los usuarios tengan que reaprender cada vez que lo utilizan?
  • Eficaz: ¿realiza el trabajo?
  • Eficiente: ¿lo hace en una cantidad de tiempo y esfuerzo razonable?
  • Deseable: ¿lo quiere la gente?
  • Atractivo: ¿usarlo es agradable e incluso divertido?

Lo más importante a tener en cuenta para que un sitio web o una App sea fácil de usar es que no nos haga pensar. Se trata de que al observar una página web se pueda entender a primera vista. Debe ser fácil de usar y evitar que los usuarios se hagan preguntas de qué ven y cómo interactuar. Por ejemplo:

  • ¿dónde estoy?
  • ¿por dónde empiezo
  • ¿dónde han puesto…?
  • ¿qué es lo más importante de esta página?
  • ¿por qué lo han llamado de esa forma?
  • ¿es esto un anuncio o parte del sitio web?

Cómo usamos realmente la web

Nuestra forma de utilizar la web se basa principalmente en estos 3 puntos:

  • No leemos las páginas, las escaneamos.
  • No tomamos decisiones óptimas, simplemente nos satisfacemos
  • No averiguamos cómo funcionan las cosas, simplemente nos apañamos.

En general, dedicamos poco tiempo a leer en páginas web. Normalmente las escaneamos de forma rápida en busca de palabras o frases que capten nuestra atención. Lo hacemos por varios motivos:

  • Normalmente tenemos prisa
  • Sabemos que no hay que leerlo todo
  • Somos buenos escaneando

Escaneamos centrando nuestro interés en palabras y frases que coinciden con:

  • La tarea que tenemos entre manos
  • Nuestros intereses personales en ese momento
  • Las palabras integradas en nuestro sistema nervioso que nos hacen reaccionar repentinamente como: gratis, oferta, sexo o nuestro nombre.

Normalmente, ante un problema, deberíamos reunir toda la información disponible, identificar las posibles soluciones y escoger la mejor. En la práctica, tomamos la primera decisión razonable que nos viene a la cabeza porque:

  • Normalmente tenemos poco tiempo
  • Si nos equivocamos, las consecuencias no son importantes
  • Considerar varias opciones no garantiza el éxito
  • Adivinar es más divertido

Por ello, los usuarios en general toman la decisión de hacer clic en el primer enlace que encuentran en un sitio web en función de: su esquema mental, el tiempo disponible y de la confianza en el sitio web en el que se encuentran. Pocas personas dedican el tiempo necesario a leer las instrucciones de un nuevo producto, como por ejemplo una lavadora. En general, no nos importa entender como funcionan si podemos usarlas. Algo similar sucede con las visitas de los usuarios a una página web o una App. Si damos con algo que funciona, seguimos con ello. Una vez encontramos algo que va bien, solemos dejar de buscar otra solución. Sólo usaremos una solución mejor si la encontramos por casualidad.

Diseños para ser escaneados, no leídos

Teniendo en cuenta que la mayoría de los usuarios pasan rápido por nuestra página Web o App, es importante asegurarnos de que ven y entienden la mayor parte. Para ello podemos utilizar las siguientes recomendaciones:

  • Usar convenciones y patrones más usados y estandarizados.
  • Crear una jerarquía visual clara en cada página
  • Dividir las páginas en zonas bien definidas
  • Dejar bien claro sobre qué se puede hacer clic
  • Eliminar el ruido visual
  • Formatear el contenido para facilitar el escaneo

Todas las páginas deben tener una jerarquía visual clara con las siguientes características:

  • Los elementos más importantes deben ser los más destacados
  • Las partes relacionadas, también tienen que estarlo de forma visual
  • Los elementos se agrupan visualmente para mostrar su relación

Una buena jerarquía visual nos ahorra muchos esfuerzos a la hora de procesar la página, y de organizar y establecer prioridades en los contenidos. Esto nos permite captar todo de forma casi instantánea.

También debemos eliminar el ruido visual para disminuir las posibles distracciones. Existen tres tipos de ruidos:

  • Ruido. Cuando todo en la página grita para llamar la atención del usuario el efecto puede ser abrumador
  • Desorganización. Suelen ser páginas diseñadas sin rejillas de alineación de los elementos de la página
  • Desorden. Especialmente en páginas principales con muchos elementos sin una organización lógica

Otra gran ayuda es formatear el texto para que sea más fácil escanear la información. Los usuarios dedican la mayor parte del tiempo en escanear texto buscando algo. La forma en la que el texto está formateado puede facilitar mucho encontrar lo que el usuario está buscando.

Las siguientes recomendaciones facilitan que las páginas puedan ser escaneadas:

  • Usar muchos encabezados
  • Escribir párrafos cortos
  • Usar listas con puntos
  • Destacar los términos clave (keywords)

Ayuda breve, oportuna e ineludible

A los usuarios no le importa el número de clics que tengan que hacer para alcanzar lo que buscan o realizar lo que persiguen mientras el camino sea sencillo y ofrezca confianza. Cuando no podamos evitar ofrecer un camino largo o complejo para completar una tarea será necesario proporcionar ayuda y orientación a los usuarios. Esta orientación funciona mejor cuando es:

  • Breve: una breve información que sea de utilidad
  • Oportuna: debe estar situada de forma que se encuentre cuando se necesita
  • Ineludible: nunca debe pasar desapercibida
1-Look-right

Ejemplo de ayuda breve, oportuna e ineludible en los pasos de peatones en Londres. Foto de Frank Denneman

Diseño de la página principal

La página principal de un sitio web es muy importante ya que suele a donde van los usuarios cuando se sienten perdidos. Estos son los elementos que tiene que tener una buena página principal:

  • Identidad y misión del sitio. La página principal tiene que decirnos de qué trata el sitio en el que estamos y para qué nos servirá.
  • Jerarquía del sitio. Proporcionando una visión global de lo que el sitio ofrece.
  • Búsqueda. Para agilizar las búsquedas o poder buscar lo que no sea evidente mediante la estructura.
  • Sugerencias. Que motiven a los usuarios a descubrir lo que encontrarán en el sitio.
  • Promociones de contenido.
  • Presentación de promociones.
  • Contenido actualizado.
  • Transacciones.
  • Accesos directos a las secciones más visitadas.
  • Registro para que los usuarios puedan darse de alta o identificarse.
  • Mostrar lo que se está buscando y lo que no se está buscando.
  • Mostrar dónde empezar.
  • Establecer credibilidad y confianza. La primera impresión es lo que cuenta.

En definitiva, la página principal de un sitio web debe contestar las cuatro preguntas que un usuario se hace la primera vez que la visita: ¿Qué es esto?, ¿qué tienen aquí?, ¿qué puedo hacer aquí? y ¿por qué debería estar aquí y no en otro lugar?

Check-list

  • No utilizar tipografía pequeña debajo contraste. dificultan la lectura.
  • No poner etiquetas dentro de los campos del formulario. Un buen documento de referencia sobre este punto es: Don’t Put Labels Inside Text Boxes (Unless You’re Luke W)
  • Conservar la distinción entre enlaces de texto visitados y no visitado.
  • No poner los encabezamientos flotando entre los párrafos. Los encabezamientos tienen que estar más cerca del texto que le sigue que del texto que les precede.

Libros recomendados

Sources of Power - How People Make Decisions - Gary Klein

The Design of everyday things. Revised and expanded edition - Don Norman

Letting go of the words - Janice (Ginny) Redishs

Forms that Work - Designing Web Forms for Usability - Carolina Jarrett

The Elements of Style - William Strunk

A Web for Everyone - Designing Accessible User Experiences - Sarah Horton

Cost-Justifying Usability - An Update for the Internet Age, Second Edition. Randolph G. Bias and Deborah J. Mayhew

The User Experience Team of One - A Research and Design Survival Guide. Leah Buley

Evil by Design - Interaction Design to Lead Us Into Temptation. Chris Nodder

Influence - The Psychology of Persuasion. Robert B. Cialdini PhD

100 MORE Things Every Designer Needs to Know About People. Susan Weinschenk

frases

  • Para vivir fuera de la ley tienes que ser honesto. Bob Dylan
  • La capacidad del cerebro humano no cambia de un año a otro, por lo que los puntos de vista del estudio de la conducta humana tienen una vida útil muy larga . Lo que era difícil para los usuarios hace veinte años, lo sigue siendo hoy en día. Jakob Nielsen
  • ¿Por qué las cosas están en el último sitio donde las buscamos? Porque cuando las encontramos, dejamos de buscarlas. Adivinanza infantil

Personas mencionadas

Otras referencias

Compartir:

2 thoughts on “No me hagas pensar (actualización) de Steve Krug”

  1. me parece un libro interesante,

    voy por la mitad ya que lo quiero leer poco a poco ya que me parece información relevante.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *