Error Summary
Resumen de Errores
Un resumen de errores es una lista breve en la parte superior de un formulario. Cada elemento explica un error y enlaza con su campo.
submit -> validate -> focus summary -> link each message to its invalid field#email · Ingrese una dirección de correo electrónico completa#password · Usa al menos 12 caracteresname@••••••••submit -> validate -> focus summary -> link each message to its invalid fieldA11YOtro ejemplo
Un formulario tiene dos errores. Enviar mueve el enfoque al resumen. Elegir Correo electrónico mueve el enfoque al campo de correo electrónico.
Partes principales
- 01Encabezado de resumen
- 02conteo de errores
- 03elemento de error vinculado
- 04identificador de campo
- 05Mensaje de campo en línea
- 06Ruta de enfoque
Úsalo cuando
Úsalo después de que un intento de envío encuentre varios errores. Mantén un mensaje en línea al lado de cada campo afectado.
No lo uses cuando
No reemplaces los mensajes de campos con un solo aviso vago. No borres la entrada válida de la persona después de que falle la validación.
Nombre usado en código
submit -> validate -> focus summary -> link each message to its invalid field Antes de lanzarlo
Give each field a label that code can read. Link hints and errors, and keep entered values. Check autofill, keyboard order, validation timing, submit states, failure recovery, zoom, and languages.
Outcome: Complete the task with Resumen de Errores (Error Summary). User context: Un formulario tiene dos errores. Enviar mueve el enfoque al resumen. Elegir Correo electrónico mueve el enfoque al campo de correo electrónico. Recommended pattern: Resumen de Errores (Error Summary). Why it fits: Úsalo después de que un intento de envío encuentre varios errores. Mantén un mensaje en línea al lado de cada campo afectado. Do not use it when: No reemplaces los mensajes de campos con un solo aviso vago. No borres la entrada válida de la persona después de que falle la validación. Product requirements: Define the default, loading, empty, error, success, and recovery states. Keep user input. Give clear feedback after every action. Accessibility and resilience: Use semantic HTML, full keyboard access, and visible focus. Make the layout work when zoomed and support reduced motion. Follow the project’s current rules. Do not add a new UI library unless the project already uses it. Acceptance criteria: The main task works with keyboard only and at 320px width. Focus and status changes are announced. Check loading, failure, retry, cancel, and reduced-motion paths. Evidence and limits (evidence boundary): Es oficial para esa fuente. Otras plataformas o equipos pueden usar el término de otra manera. Unknowns to confirm: Product wording, data source, analytics events, supported devices and languages, and platform limits.
Revisa esta petición
Review how Resumen de Errores (Error Summary) is used now. Definition: Un resumen de errores es una lista breve en la parte superior de un formulario. Cada elemento explica un error y enlaza con su campo. Release checks: Give each field a label that code can read. Link hints and errors, and keep entered values. Check autofill, keyboard order, validation timing, submit states, failure recovery, zoom, and languages. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.