Inclusión. Accesibilidad y Usabilidad web.

Quiero un menú desplegable

Contextualizamos

Un cliente de un desarrollo en el que estamos trabajando nos pide que creemos menús desplegables, porque los responsables de la web opinan (sabemos que hay temas en las que todo el mundo puede opinar y tiene razón, como cuando hablamos de fútbol) son más cómodos y las otras webs del grupo los tienen. En el documento de requisitos técnicos aparecía el de cumplir el nivel AA de las normas de la WAI.

Ante la primera negativa que le damos, alegando motivos de accesibilidad y usabilidad, consultan con su departamento informático y la respuesta es que hagamos los menús desplegables y una versión sólo texto. Ante esta disyuntiva la decisión es clara.

Estando de acuerdo a priori con Juan Carlos García

“Si no tienes más remedio que hacer un menú desplegable (aunque, salvo capricho del cliente no parece haber una razón lo suficientemente buena para hacerlo)”

en su artículo Menús deplegables. Más problemas que soluciones, intento hacer un balance de las ventajas y desventajas que aportan, para decidir si realmente es una cuestión de moda (poco sites actualmente los utilizan, aunque Amazon sí, y se presupone que estudian a fondo la usabilidad de su web) o si hay argumentos objetivos para utilizarlos o no utilizarlos.

Problemas de usabilidad de los menús deplegables

• Opciones Ocultas: Las opciones del menú se encuentran ocultas, lo que hace que para conocer todas las opciones que te ofrecen tengas que recorrer todos los menús.
• Doble esfuerzo: Si quieres recorrer los elementos de una categoría tienes que desplegar el menú, una y otra vez, para seleccionar la siguiente opción. Lo que parecía una ventaja, tener a dos clics todos los elementos (desplegar el menú, y elegir la opción), se convierte en no tener nada a un clic.

Problemas de Accesibilidad en menús desplegables

• Uso JavaScript: Muchas soluciones empleadas son dependientes de que el navegador soporte javascript; es decir, en caso contrario no se pueden desplegar.
• Necesidad de Precisión: Para personas con problemas psicomotrices, la necesidad de utilizar el ratón de manera tan exacta se convierte en algo muy complicado, a veces imposible, y además frustante, ya que necesitan realizar muchos intentos para conseguir el objetivo de hacer clic en la opción que desean.
• Lectores de pantalla: Los menús desplegables cargan todas las opciones de las distintas categorías. Normalmente este menú está presente en todas las páginas, sean de la categoría que sean. Esto hace que el usuario que navega con un lector de pantalla tenga que soportar en todas las páginas la enumeración de categorías.

Solución a desarrollar

• Hacemos caso al cliente y creamos los menús deplegables.
• Utilizamos un sistema para menús desplegables que se despliegue aunque el navegador no soporte javascript y cumpla los criterios de accesibilidad.
• Introducimos el enlace de Saltar Navegación para evitar la repetición innecesaria de la opciones una y otra vez.
• Hacemos que la primera opción de cabecera del menú conduzca a una página en la que se describe la sección, y se ofrecen enlaces al resto de opciones que existen dentro esa opción del menú desplegable.
• Repetimos las otras opciones de navegación de esa categoría en cada una de las páginas de la sección.
• Reforzamos la navegación con la miga de pan.

En resumen: intentamos que la navegación por menús desplegables se convierta en otra opción más para navegar, pero que no sea la única.

Más información

• Menús desplegables. Más problemas que soluciones
• Menús Desplegables: Úselos con medida

---

Lo más leído

• ¿Cómo adapto un interfaz web para móvil?
• Landing Page. La primera impresión es lo que cuenta. 30 Tips
• Diseño de botones call-to-action, las claves del éxito
• Reducir el porcentaje de rebote, 10 consejos

¿Disfrutaste esta entrada? Por qué no dejas un comentario abajo y continúas la conversación, o te suscríbes a mi feed y obtienes los artículos como este enviados automáticamente cada día hacia tu lector de feeds.

Inclusión. Accesibilidad y Usabilidad web.