Addaw, ir a inicio Donar

Técnica Técnicas generales WCAG 2.2

G84Explicar en texto el error cuando el dato no es un valor permitido

Nombre oficial en el W3C: Proporcionar una descripción textual cuando el usuario introduce información que no está en la lista de valores permitidos

En pocas palabras

Algunos campos solo admiten ciertos valores: una provincia, un tipo de documento o un código de curso. Si la persona escribe otro, la web debe explicar el error con un texto. El mensaje dice qué campo falla y muestra los valores que se aceptan o el que más se parece a lo escrito.

Por qué es importante

Un asterisco o una etiqueta en rojo no dicen qué está mal. Una persona ciega no ve el color, y otras no entienden la señal.

Sin una explicación, la persona prueba al azar o abandona el trámite. Un mensaje como «Provincia: “Mrucia” no existe. ¿Quería decir Murcia?» lo resuelve en un momento.

Cómo se hace

  1. Compruebe el dato al enviar el formulario o al salir del campo.
  2. Si no es válido, muestre un texto que nombre el campo y explique el problema.
  3. Incluya la lista de valores permitidos si es corta. Si es larga, sugiera el valor permitido más parecido.
  4. Ponga el mensaje junto al campo y asócielo con aria-describedby. Si hay varios errores, muestre además arriba un resumen con enlaces a cada campo.
  5. Conserve los datos ya escritos para que no haya que empezar de nuevo.

Cómo comprobarlo

  1. Escriba en el campo un valor que no esté entre los permitidos y envíe el formulario.
  2. Compruebe que aparece un texto, no solo un color o un icono, que explica el error.
  3. Compruebe que el texto nombra el campo e indica los valores válidos o sugiere uno.
  4. Con un lector de pantalla, compruebe que el mensaje se lee al llegar al campo.

Ejemplo

Error en el campo de provincia con una sugerencia de valor válido.

<label for="prov">Provincia</label>
<input id="prov" name="provincia" value="Mrucia"
       aria-invalid="true" aria-describedby="prov-error">
<p id="prov-error">Provincia: «Mrucia» no existe. ¿Quería decir Murcia?</p>
Ver el texto completo del W3C (traducción al español)

Esta es una traducción no oficial al español de la técnica G84 de Techniques for WCAG 2.2, del W3C. Puede contener errores. El único documento oficial y normativo es la versión original en inglés, publicada en el sitio web del W3C.

Aplicabilidad

Contenido que recoge datos introducidos por el usuario cuando debe introducirse un conjunto limitado de valores.

Descripción

Cuando los usuarios introducen datos que se validan y se detectan errores, es necesario describir al usuario la naturaleza del error de una forma a la que pueda acceder. Una posibilidad es mostrar un cuadro de diálogo de alerta que describa los campos con errores cuando el usuario intenta enviar el formulario. Otra posibilidad, si la validación la realiza el servidor, es devolver el formulario (con los datos del usuario aún en los campos) junto con una descripción textual en la parte superior de la página que indique que ha habido un problema de validación, describa la naturaleza del problema y ofrezca formas de localizar fácilmente el campo o campos con problemas. La parte «en texto» del criterio de conformidad subraya que no basta con indicar que un campo tiene un error poniendo un asterisco en su etiqueta o cambiando la etiqueta a color rojo. Debe proporcionarse una descripción textual del problema.

Cuando la entrada debe ser uno de un conjunto de valores permitidos, la descripción textual debe indicarlo. Debe incluir la lista de valores si es posible, o bien sugerir el valor permitido más parecido al valor introducido.

Ejemplos

  • El usuario introduce datos no válidos en un campo de formulario. Antes de que el usuario envíe el formulario, aparece un cuadro de diálogo de alerta que describe la naturaleza del error para que el usuario pueda corregirlo.
  • El usuario introduce datos no válidos en un campo de formulario y envía el formulario. El servidor devuelve el formulario, con los datos del usuario todavía presentes, e indica claramente en texto, en la parte superior de la página, que ha habido errores de entrada. El texto describe la naturaleza del error o errores e indica con claridad qué campo tenía el problema, de modo que el usuario pueda llegar fácilmente hasta él para corregirlo.

Pruebas

Procedimiento

  1. Introducir datos no válidos en un campo de formulario.
  2. Comprobar que se proporciona información en texto sobre el problema.

Resultados esperados

  • La comprobación n.º 2 es verdadera.

Cómo lo comprobamos en ADDAW

En cada auditoría de ADDAW revisamos esta técnica página a página y le entregamos los errores con capturas y la forma de corregirlos.

Solicitar una auditoría

Basado en la técnica G84 del W3C (WCAG 2.2). Explicación y ejemplos: ADDAW. Traducción no oficial del texto del W3C © W3C, licencia de documentos del W3C. ¿Ha visto un error? Escríbanos.