¿Qué podría ser más fácil que crear un formulario HTML que capture direcciones de correo electrónico, por ejemplo, para un boletín de noticias o notificaciones? Escribir mal una dirección de correo electrónico en ese formulario, por supuesto, y luego hacer que su navegador recuerde esa dirección incorrecta para todos los formularios de registro que vendrán.
Si desea validar las direcciones de correo electrónico introducidas en su formulario, pero evita los complicados retoques y scripts, HTML5 le permite confiar en el navegador, sin esfuerzo y sin necesidad de recurrir a JavaScript.
Validar direcciones de correo electrónico con HTML5
Para que los navegadores de los usuarios validen las direcciones de correo electrónico a medida que las introducen en su formulario web HTML:
- Asegúrese de utilizar HTML5.
- Especifique el elemento de entrada del formulario de dirección de correo electrónico como tipo «email». (Ver abajo para un ejemplo.)
Los navegadores que no reconocen type=»email» deberían (y, hasta donde se sabe, todos lo harán) tratar el campo de entrada como un campo normal type=»text».
Advertencias de validación de direcciones de correo electrónico HTML5
Tenga en cuenta que la validación de la dirección de correo electrónico HTML sólo funcionará en los navegadores que admiten HTML5 y validan la entrada de elementos de formulario. Para otros navegadores y copias de seguridad, todavía puede validar las direcciones de correo electrónico utilizando PHP, por ejemplo.
Los navegadores compatibles con la validación de direcciones de correo electrónico HTML5 incluyen Safari 5+, Google Chrome 6+, Mozilla Firefox 4+ y Opera 10+. Safari 5 y Google Chrome 6-8 no aceptarán la introducción de direcciones de correo electrónico no válidas pero, a diferencia de otros navegadores, no ayudarán al usuario a corregir el error.
Ejemplo de validación de dirección de correo electrónico HTML5
Para que los navegadores de los usuarios validen las direcciones de correo electrónico con HTML5, utilice el siguiente código, por ejemplo: