Quelques astuces pour améliorer son formulaire d’identification/inscription

S’il y a bien une chose qu’un technicien fait en permanence, c’est essayer d’identifier les erreurs, le tout étant d’identifier les bonnes.

Depuis quelques temps, je me suis amusé à me faire envoyer par mail chaque erreur qui se passe sur le principal site que je gère techniquement au niveau de l’identification/inscription.

Et les enseignements sont riches, comme toujours quand on traite des centaines d’informations et qu’on les recoupe.

Je vous livre tels quels les enseignements, que je vous laisse apprécier comme autant éléments de tests pour améliorer vos formulaires d’inscription / identification.

  • il est conseillé de n’avoir qu’un numéro de téléphone, obligatoire, sur la création de compte en vue d’une commande (on retrouve souvent deux champs de numéros de téléphone, dont un seul obligatoire)
  • il faut faire tenir le formulaire sur un seul écran, avec le bouton pour passer à l’étape suivante au dessus de la ligne de flottaison (visible sans besoin de scroll). Les champs obligatoires doivent être bien identifiés.
  • si erreur sur le formulaire, lors du rechargement de la page, il est possible et conseillé de remettre le « focus » (barre clignotante dans un champ invitant à la saisie) sur le premier champ en erreur, souvent celui du mot de passe qu’il faut de toute façon resaisir.
  • lorsque la personne a renseigné son e-mail et clique sur « mot de passe oublié », ça ouvre souvent une nouvelle fenêtre, on peut éviter à la personne de saisir à nouveau son adresse e-mail si elle l’a déjà fait ; cela lui permet de se rendre éventuellement compte d’une erreur de frappe.
  • Certains sites utilisent des processus de « mot de passe oublié » avec deux allers-retours par e-mail : le premier pour confirmer (via un lien à cliquer), le second pour récupérer un nouveau mot de passe généré par informatique (du genre « x8ZORjsF », les utilisateurs l’oublieront dans tous les cas). Autant, après le premier lien, inviter les utilisateurs à définir leur propre mot de passe, dont ils se souviendront pour la fois suivante. Cela fait un mail en moins par ailleurs (sauf à confirmer le changement de mot de passe)
  • lorsque l’on crée un compte avec un e-mail et un mot de passe, si un compte existe déjà avec ce mail et ce mot de passe, on ne devrait pas mettre d’erreur mais connecter directement la personne

Ces suggestions sont basées sur de vraies erreurs rencontrées sur un site de e-commerce. Si je les ai identifiées, c’est qu’elles étaient identifiables et revenaient donc suffisamment souvent. A vous de voir si cela vous semble logique et applicable sur votre propre site !


Publié

dans

par

Commentaires

6 réponses à “Quelques astuces pour améliorer son formulaire d’identification/inscription”

  1. Avatar de Fred
    Fred

    Ces recos sont intéressantes et très pertinentes je trouve. Par contre en pratique, si on utilise un CMS comme Prestashop ou Magento, c’est un casse-tête à mettre en place :/

  2. Avatar de Romain Boyer
    Romain Boyer

    Merci pour ce retour Fréd,

    je suis également sur Prestashop et je n’ai pas encore regardé l’implémentation mais je suis sûr que c’est faisable ; j’estimerais cela à 6 heures environ de travail.

    Il faut avoir un certain volume de commandes pour que cela soit intéressant aussi.

  3. Avatar de david
    david

    Merci pour cet article qui nous rappelle les erreurs à éviter… Par contre je trouve assez utile de mettre 2 champs pour le téléphone: mobile et fixe. Je trouve le dernier point très intéressant, beaucoup de sites devraient s’en inspirer.

  4. Avatar de William de Cuisinistic

    Merci pour tes infos Romain.
    La gestion du formulaire ‘inscription est assez longue et perilleuse sous Prestashop en effet, mais cela reste intéressant de se pencher dessus je pense !
    A bientot

  5. Avatar de bracelets événementiels
    bracelets événementiels

    Merci pour les infos.
    Cela dis le système « opc » (one step process) sur prestashop répond parfaitement à cette optimisation selon moi. Un peu de stylisation css et le tour est joué pour contenir son taux de transfo.

  6. Avatar de Viager
    Viager

    Merci pour ces conseils très enrichissants.
    Je suis arrivé sur votre site depuis google avec la recherche « optimiser formulaire ». Je ssuis content d’avoir trouvés ces conseils. je vous remercie a nouveau

Laisser un commentaire