Un mensaje de error debería decir qué está bloqueando y cómo corregir el campo. "Entrada no válida" o un marco rojo sin texto no es suficiente, especialmente para una persona que usa el teclado o un lector de pantalla.

Dar una instrucción relacionada con el campo

Escriba "Indicar una dirección de correo electrónico que contenga @" en lugar de "Error 42". Coloca el texto cerca del campo y asocialo técnicamente con él. Los W3C recomienda Notificaciones claras, con una devolución global después del envío y una devolución cerca del control en cuestión.

Prevenir en lugar de sorprender

Especifique antes de introducir los formatos y la información obligatoria: longitud de un identificador, formato de fecha o tamaño máximo de un archivo. No muestre una restricción conocida solo después de varios intentos. Los ejemplos deben coincidir con los formatos aceptados reales y evitar requerir datos no necesarios para la tarea.

Mantenga las respuestas y guíe la devolución

Después de un servidor o error de validación, mantenga los campos ya ingresados cuando sea posible. Muestra un resumen de errores en la parte superior del formulario y las indicaciones locales. Coloque el foco en un lugar lógico para reanudar la corrección, luego deje que el usuario verifique los cambios antes de un nuevo envío.

Distinguir la corrección, el fracaso y el éxito

Un campo mal lleno no es una falta de disponibilidad del servicio. Si el envío falla por motivos técnicos, anuncielo sin reclamar que la solicitud ha sido recibida y entregue otro medio de contacto si es posible. Por el contrario, un envío exitoso debe proporcionar una confirmación explícita e indicar la secuencia esperada.

Prueba con errores reales

Pruebe un campo vacío, un formato plausible pero rechazado, un archivo que es demasiado pesado y una pérdida de conexión. Prueba en el teclado, en el teléfono y con tecnología de soporte si está disponible. Los Guía de formularios de contacto Ayuda a reducir los campos incluso antes de escribir sus errores.

ayudar a alguien a reanudar la entrada sin perderla

Un visitante envía un formulario con una dirección no válida y un campo obligatorio vacío. La página identifica cada problema junto a su campo, resume errores, conserva el texto introducido y facilita la búsqueda del enfoque. El visitante lo corrige y recibe una confirmación explícita.

Prueba con teclado y teléfono. Un "error 400" genérico o el color solo no explica cómo recuperarse.

Diseñe un formulario de contacto que realmente ayude →