« »

Accesibilidad y usabilidad en formularios

AccesibilidadEsto es lo que nos indica la pauta 10.4 (prioridad 3, es decir, mínima, pero no por ello completamente obviable) de las denominadas Pautas de Accesibilidad al Contenido Web 1.0 (WCAG 1.0), desarrolladas por la Iniciativa de Accesibilidad Web (WAI), perteneciente al World Wide Web Consortium (W3C):

WCAG 10.4: Hasta que las aplicaciones de usuario manejen correctamente los controles vacíos, incluya caracteres por omisión en los campos de edición y áreas de texto. (Prioridad 3).

Según esto, todos los campos de edición y áreas de texto deben contener algún caracter porque existen ayudas técnicas que no pueden poner el foco en los controles vacíos.

Si nos interesa cumplir con todas las pautas pero no queremos que se vea por defecto ningún caracter y estamos desesperados porque el truco de colocar   no nos funciona, he aquí una solución.

Una manera de incluir textos por defecto (y así cumplir con los estándares de accesibilidad) y al mismo tiempo evitar que sea un engorro para el visitante borrar el texto por defecto para introducir sus propios datos es utilizar JavaScript siguiendo la propuesta de HTML Source.

Lo que viene a decir es que, para conseguirlo, no hay más que descargar dos archivos .js: util-functions.js y clear-default-text.js

Luego, “llamamos” a esos archivos desde la cabecera de nuestro sitio (entre las etiquetas <head>):

<script type="text/javascript" src="util-functions.js"></script>
<script type="text/javascript" src="clear-default-text.js"></script>

Y luego, asociar la clase “cleardefault” a cada campo del formulario:

<input type="text" name="date" value="yy-mm-dd" class="cleardefault" />

Aunque se deshabilite JavaScript el sitio seguirá siendo usable, aunque no se borrarán los valores por defecto al colocar el cursor sobre ellos.

Espero que pueda ayudaros. :)

Comentarios

  1. Begoña | 18 Enero 2008 | 19:25

    He aplicado los pasos tal y como comentas pero sigue dándome errores de
    validación. Te mando la dirección para que mires el código por si hubiera algún error.
    http://www.treewebs.net/contacto.htm

  2. Calítoe.:. | 19 Enero 2008 | 08:50

    Saludos y gracias por tu interés en el artículo sobre accesibilidad y usabilidad en formularios.

    Gracias al validador Hera puedes comprobar qué falla exactamente en la página que me envías:
    http://www.sidar.org/hera/index.php.es?id=180484&pr=3&re=3

    Veo que precisamente no has incluido esos valores por defecto en el que se basa el planteamiento del artículo. El JavaScript sirve para poder incluirlos pero haciendo que desaparezcan al seleccionar cada campo del formulario para que no le resulten un engorro al visitante. Así:

    value=”Nombre”

    Espero que esto haya podido ayudarte. :)

Publicar un comentario