Après avoir découvert élément de formulaire et comment créer un formulaire interactive, voyons comment vous pouvez aider les utilisateurs à éviter de saisir à nouveau des données.
Exploitez tout le potentiel de la saisie automatique
Remplir un formulaire peut prendre beaucoup de temps. Par exemple, le fait de saisir à nouveau votre adresse à plusieurs reprises sur tous les sites où vous souhaitez effectuer un achat n'est pas une bonne expérience d'achat.
La saisie automatique peut vous être utile. Vous saisissez votre adresse une fois. Désormais, votre navigateur vous proposera de remplir automatiquement la même adresse pour les autres formulaires.
Vous avez déménagé dans une autre ville ? Ne craignez pas de conserver définitivement l'ancienne adresse comme option. Vous pouvez modifier les données d'adresse que votre navigateur a enregistrées afin de les maintenir à jour.
Comment fonctionne la saisie automatique dans le navigateur ?
Un champ d'adresse peut avoir une apparence très différente selon les sites. Comment un navigateur sait-il qu'il s'agit d'un champ d'adresse ?
Les navigateurs utilisent
pour identifier un champ d'adresse.
Quelles sont les valeurs des attributs name, type et id ?
La commande de formulaire comporte-t-elle un attribut autocomplete ?
Sur la base de ces informations, les navigateurs peuvent proposer de remplir automatiquement un champ avec des données saisies précédemment du même type. Les navigateurs peuvent même proposer de remplir automatiquement un formulaire entier.
Aider les navigateurs avec la saisie automatique
Voyons ce que vous pouvez faire pour aider les navigateurs à proposer les options de saisie automatique appropriées.
Utiliser des valeurs d'attribut raisonnables
Comme nous l'avons vu précédemment, les navigateurs peuvent identifier le type de données en examinant les attributs d'une commande de formulaire.
<label for="email">Email</label>
<input type="email" name="email" id="email">
Proposez-vous un champ dans lequel les utilisateurs doivent saisir leur adresse e-mail ?
Utilisez email comme valeur pour les attributs name, id et type.
Trois indications pour le navigateur indiquant qu'il s'agit d'un champ d'adresse e-mail.
Attribut de saisie semi-automatique
Il existe d'autres exemples où il peut encore être difficile pour les navigateurs d'identifier le type de données uniquement à partir des attributs name, id et type.
Pour ce faire, vous pouvez utiliser l'attribut autocomplete.
Avez-vous déjà saisi un nom dans le navigateur que vous utilisez ? Le navigateur vous proposera probablement de le remplir à nouveau pour ce champ dans la démonstration.
Pour en savoir plus sur l'utilisation saisie semi-automatique et de saisie automatique dans un module ultérieur.
Testez vos connaissances
Tester vos connaissances sur la saisie automatique
Sur quels attributs la saisie automatique est-elle proposée ?
nametypeautocomplete