Técnica Técnicas generales WCAG 2.2
G177Proponer la corrección cuando un dato del formulario no es válido
Nombre oficial en el W3C: Proporcionar sugerencias de texto correcto
En pocas palabras
Cuando el usuario escribe un dato que el formulario no acepta y se puede adivinar qué quería poner, la web le sugiere el texto correcto. Por ejemplo, un nombre de municipio bien escrito o las opciones posibles para un dato ambiguo. La sugerencia aparece junto al campo y es fácil de elegir.
Por qué es importante
Un error al escribir puede bloquear un trámite entero. Las personas con dislexia, con discapacidad intelectual o con problemas de visión cometen más errores de este tipo y les cuesta más encontrarlos.
Si la web solo dice «dato no válido», la persona tiene que adivinar qué falla. Una propuesta concreta le ahorra tiempo y evita que abandone el formulario.
Cómo se hace
- Identifique los campos donde se puede deducir el dato correcto: municipios, calles, nombres de productos, búsquedas o plazos.
- Cuando el dato no sea válido, compárelo con una lista de valores conocidos y busque los más parecidos.
- Muestre la sugerencia junto al campo con error o al principio del formulario. Por ejemplo: «¿Quiso decir Cartagena?».
- Si el dato es ambiguo, ofrezca las opciones posibles. Por ejemplo, ante «6» en un campo de plazo: «6 días, 6 semanas o 6 meses».
- Permita aceptar la sugerencia con un solo clic: un enlace, un botón o un botón de opción.
- Conserve lo que el usuario ya había escrito en el resto del formulario.
Cómo comprobarlo
- Localice los campos en los que se podría deducir el dato correcto a partir de uno erróneo.
- Rellénelos con errores a propósito, por ejemplo un municipio mal escrito, y envíe el formulario.
- Compruebe que aparece una sugerencia con el texto correcto.
- Compruebe que la sugerencia está junto al campo, o que hay un enlace a ella cerca del campo.
- Repita la prueba con un lector de pantalla (programa que lee en voz alta la pantalla) para confirmar que la sugerencia se anuncia o se encuentra fácilmente.
Ejemplo
Tras enviar un municipio mal escrito, el formulario propone la corrección junto al campo.
<label for="municipio">Municipio</label>
<input id="municipio" name="municipio" value="Cartajena"
aria-invalid="true" aria-describedby="sugerencia">
<p id="sugerencia">
No encontramos «Cartajena». ¿Quiso decir
<button type="button" data-valor="Cartagena">Cartagena</button>?
</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 G177 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 acepta la entrada de datos por parte del usuario, con restricciones sobre el formato, el valor o el tipo de la entrada.
Descripción
El objetivo de esta técnica es sugerir el texto correcto cuando la información facilitada por el usuario no se acepta y se conoce el posible texto correcto. Las sugerencias pueden incluir la ortografía correcta o un texto similar procedente de un conjunto conocido de textos posibles.
Según el formulario, las sugerencias pueden situarse junto al campo en el que se detectó el error, en otro lugar de la página, o bien mediante un mecanismo de búsqueda o una referencia cuyos resultados se muestren en otro URI. Siempre que sea posible, las sugerencias de corrección deben incorporarse de una forma que resulte fácil para el usuario. Por ejemplo, un envío incorrecto puede devolver una lista de posibles correcciones en la que el usuario pueda marcar una casilla de verificación o un botón de opción para indicar cuál era la opción que pretendía. Las sugerencias, o los enlaces a ellas, deben colocarse cerca de los campos de formulario con los que están asociadas, por ejemplo al principio del formulario, antes de los campos de formulario, o junto a los campos de formulario que requieren corrección.
Ejemplos
- Un campo de formulario pide al usuario que introduzca un periodo de tiempo que puede ir de días a años. El usuario escribe el número «6». El servidor devuelve el formulario tal como lo envió el usuario e incluye además un texto de sugerencia junto al campo de formulario: «Se ha detectado un error. ¿Quería decir: 6 días, 6 semanas, 6 meses o 6 años?».
- El usuario escribe el nombre de una ciudad con una falta de ortografía. El servidor devuelve el formulario tal como lo envió el usuario e incluye además, al principio del formulario, un mensaje que informa al usuario del error y un enlace a una lista de nombres de ciudades que el usuario podría haber querido escribir, determinada al comparar su entrada original con una base de datos de nombres de ciudades.
- Un planificador de trayectos de autobús permite a los usuarios introducir su origen y su destino, admitiendo direcciones postales, cruces de calles y lugares emblemáticos de la ciudad. Cuando un usuario escribe «Kohl», se le presenta una lista de resultados de búsqueda con coincidencias similares que dice: «Su búsqueda de "Kohl" ha devuelto lo siguiente». A continuación del mensaje, una lista desplegable muestra «Kohl Center», «Kohl's Dept. Store-East» y «Kohl's Dept. Store-West» como opciones entre las que el usuario puede elegir.
- Un buscador pasa un corrector ortográfico sobre lo introducido y, si detecta un error ortográfico, ofrece un enlace con alternativas. Cuando el usuario pulsa el enlace, la búsqueda se vuelve a enviar automáticamente con la ortografía correcta.
Pruebas
Procedimiento
- Identificar los campos de formulario en los que el texto correcto podría deducirse a partir de un texto incorrecto.
- Rellenar el formulario, introduciendo deliberadamente texto incorrecto en los campos de formulario identificados.
- Comprobar que se presentan al usuario sugerencias del texto correcto.
- Comprobar que las sugerencias se ofrecen junto al campo de formulario o que se proporciona un enlace a las sugerencias cerca del campo de formulario.
Resultados esperados
- Las comprobaciones n.º 3 y n.º 4 son verdaderas.
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.
Basado en la técnica G177 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.