Después de aprender sobre el elemento del formulario y cómo hacer que un formulario sea interactivo, veamos cómo puedes ayudar a los usuarios a evitar tener que volver a ingresar datos.
Aprovecha al máximo la función Autocompletar
Completar formularios puede llevar mucho tiempo. Por ejemplo, volver a ingresarla repetidamente en cada sitio en el que quieres comprar no es una buena experiencia de compra.
La función Autocompletar puede ayudarte. Debes ingresar tu dirección una vez. A partir de ahora, tu navegador te ofrecerá la opción de completar automáticamente la misma dirección para otros formularios.
¿Te mudaste a otra ciudad? No te preocupes de tener la dirección anterior como opción para siempre. Puedes editar los datos de la dirección que guardó el navegador para mantenerlos actualizados.
¿Cómo funciona Autocompletar en el navegador?
Un campo de dirección puede verse muy diferente en distintos sitios. ¿Cómo sabe un navegador que es un campo de dirección?
Los navegadores usan heurística para identificar un campo de dirección.
¿Cuáles son los valores de los atributos name, type y id?
¿Hay un atributo autocomplete presente en el control del formulario?
En función de esta información, los navegadores pueden ofrecer la opción de autocompletar un campo con datos del mismo tipo ingresados anteriormente. Los navegadores incluso pueden ofrecer autocompletar un formulario completo.
Ayuda a los navegadores con la función Autocompletar
Veamos qué puedes hacer para ayudar a los navegadores a ofrecer las opciones correctas de autocompletar.
Usa valores de atributos sensatos
Como aprendiste, los navegadores pueden identificar el tipo de datos observando los atributos de un control de formulario.
<label for="email">Email</label>
<input type="email" name="email" id="email">
¿Tienes un campo donde los usuarios deben ingresar su dirección de correo electrónico?
Usa email como valor para los atributos name, id y type.
Tres sugerencias para el navegador: Se trata de un campo de correo electrónico.
El atributo Autocomplete
Hay otros ejemplos en los que aún puede ser difícil para los navegadores identificar el tipo de datos solo a partir de los atributos name, id y type.
Puedes ayudar usando el atributo autocomplete.
¿Ya habías ingresado un nombre en el navegador que estabas usando? Es probable que el navegador te ofrezca la opción de volver a completarlo en este campo de la demostración.
Puedes obtener más información sobre el uso de autocompletar y autocompletar en un módulo posterior.
Verifica tus conocimientos
Pon a prueba tus conocimientos sobre Autocompletar
¿Según qué atributos se ofrece la función Autocompletar?
nametypeautocomplete