Home > Blog > Formularios accesibles

Formularios accesibles

Publicado el 22/12/08
por Ricardo Gil

Es importante saber cómo se comportan los lectores de pantalla cuando acceden a nuestros formularios para que podamos construirlos mejor.

Vamos a centrarnos en el “modo formulario” tanto de JAWS como de Window-Eyes. Para explicar qué es el “modo formulario”, primero hay que saber que al tener en funcionamiento un lector de pantalla durante la navegación web, estos habilitan una serie de teclas de acceso rápido para algunas funciones básicas. Por ejemplo, el usuario puede pasar al siguiente párrafo pulsando “P”,  a la siguiente lista pulsando “L” o al siguiente encabezado pulsando “H”.

En un formulario, entramos en “modo formulario” para que al pulsar dichas teclas el lector de pantalla no haga nada y podamos introducir texto con normalidad en los campos.

¿Cómo navega el usuario entre los campos de un formulario?
Con el tabulador.
¿Cuál es el problema entonces?
Que en “modo formulario” los lectores de pantalla únicamente interpretan los elementos de formulario y enlaces. Es decir, ni párrafos, ni encabezados, ni ninguna otra cosa.

Así que si necesitamos poner textos explicativos para la introducción de texto en un campo, un lector de pantalla no lo leerá. O si después de validar el formulario ponemos el error de introducción del campo en un párrafo dentro del formulario, tampoco lo leerá.

¿Cómo podemos solucionarlo?
El autor de este artículo, Ted Page, Director de PWS, da cuatro soluciones. Poner el texto explicativo antes del formulario. Hacer un formulario en varias páginas. Enlaces con pop-ups accesibles al ponernos encima. Poner enlaces ocultos al texto explicativo que estaría fuera del formulario.

Personalmente incluyo una quinta opción. Incluir el texto explicativo como parte del label que anexionamos al campo y mediante CSS posicionarlo fuera del label como si fuera un párrafo a parte. Sí, habría que usar posicionamiento absoluto, pero no muerde.

Ventajas:

  • El lector de pantalla lo interpreta correctamente.
  • Tendríamos el texto en su lugar correspondiente.
  • No requiere ninguna acción por parte del usuario con lector de pantalla.
  • Visualmente, un usuario sin lector de pantalla no ve diferencias.

El artículo original aborda más cuestiones sobre los formularios accesibles, así que os recomiendo leerlo, si estáis interesados en el tema.

Artículos relacionados

¿Y ahora qué?

Por favor deja tu comentario, queremos saber tu opinión sobre este artículo. Trackback URL: Formularios accesibles.