En línea, al perder el foco o al enviar: el momento importa
Valide en momentos que no resulten abrumadores.
En línea, al perder el foco o al enviar: el momento importa es una lección gratuita de Web Accessibility Academy en CoddyKit. Esta es la lección 4 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Web Accessibility Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Web Accessibility Academy incluye 4 lecciones en total.
Cuándo validar es importante
El mismo mensaje de error puede ayudar o molestar según cuándo aparezca. El momento de mostrarlo es también una decisión de accesibilidad. ⏱️
Al enviar es el punto de partida
Comprobar todo al enviar es predecible y nunca interrumpe al usuario. Es la opción predeterminada más segura para casi cualquier formulario.
Por qué la validación en línea puede perjudicar
Validar con cada pulsación de tecla marca un campo como incorrecto antes de que el usuario termine de escribir. Esa insistencia en línea frustra a todo el mundo.
Al perder el foco es el punto ideal
Comprobar el campo cuando el usuario lo abandona, es decir, en blur, le permite terminar de escribir y después le ofrece información en una pausa natural.
input.addEventListener("blur", validateField);No anunciar demasiado pronto
Un error que aparece mientras se escribe puede apoderarse del lector de pantalla. Espere a un momento real, como blur o el envío, antes de anunciarlo.
Confirmar y volver a comprobar en línea
Una vez que un campo ha fallado y el usuario lo está corrigiendo, volver a validarlo mientras escribe resulta útil. Confirma que el error está desapareciendo.
Dar tiempo para terminar
WCAG pide que no apresure a los usuarios. Evite los tiempos de espera que borren lo escrito y permita que cada persona complete el campo a su propio ritmo.
Indicar lo obligatorio desde el principio
Marque de antemano los campos obligatorios con required y una nota visible, para que los usuarios conozcan la regla antes de enviar el formulario, no después.
<input required aria-required="true">Mantener los mensajes específicos
Independientemente del momento, explique qué está mal y cómo corregirlo. Un mensaje claro es mejor que uno impreciso, aunque aparezca en el momento perfecto.
Apoyarse en el navegador
La validación nativa de HTML se ejecuta al enviar de forma predeterminada. Los atributos integrados, como type y required, le proporcionan un momento adecuado sin esfuerzo adicional.
<input type="email" required>Ser coherente
Elija una estrategia temporal y aplíquela en todo el formulario. Un comportamiento predecible permite a los usuarios aprender el patrón y confiar en él.
Comprobación rápida
¿Qué momento de validación es la opción predeterminada más accesible?
Resumen
Valide al producirse blur o al enviar, no con cada pulsación; vuelva a comprobar en línea mientras se corrige el campo, indique las reglas desde el principio y sea coherente. ✅
Aprende HTML con un tutor de IA — gratis
Escribe y ejecuta código real en tu navegador, obtén ayuda instantánea de un tutor de IA disponible 24/7 y continúa donde lo dejaste en la web o en la aplicación.
- Cursos
- 30
- Lecciones
- 120
Preguntas frecuentes
¿La lección «En línea, al perder el foco o al enviar: el momento importa» es gratis?
Sí — el texto completo de «En línea, al perder el foco o al enviar: el momento importa» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Web Accessibility Academy, actualiza a CoddyKit PRO. El curso de Web Accessibility Academy incluye 4 lecciones en total.
¿Qué aprenderé en «En línea, al perder el foco o al enviar: el momento importa»?
Valide en momentos que no resulten abrumadores. Practicas Web Accessibility Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar Web Accessibility Academy?
No se requiere experiencia previa. Web Accessibility Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 4 de 4.
¿Cuánto tiempo toma la lección «En línea, al perder el foco o al enviar: el momento importa»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de Web Accessibility Academy?
Sí. Cada lección de Web Accessibility Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- Asociar errores a campos con aria-describedby
- Marcar el estado no válido con aria-invalid
- Mover el foco al primer error
- En línea, al perder el foco o al enviar: el momento importa