Dans cet article :

    Construire un formulaire web efficace

    Les formulaires sont présents sur quasiment tous les sites internet, au moins sur la page contact. Les internautes ont donc l'habitude de les remplir, mais vous ne devez pas perdre de vue que le remplissage d'un formulaire est une épreuve pour un internaute. Ce n'est ni amusant, ni distrayant, ni intéressant, il faut donc faire le maximum pour faciliter le remplissage des formulaires présents sur votre site web, notamment pour ceux qui vous permettent de récupérer des prospects.

    En attendant de trouver une solution miracle pour que le remplissage de formulaires soit amusant, voici quelques conseils d'ergonomie à mettre en place sur vos formulaires pour améliorer leur taux de conversion.

    Réduire le nombre de champs

    La première chose à faire est de supprimer tous les champs qui ne vous sont pas indispensables. S'il a bien une chose à retenir sur les formulaires, c'est que plus ils sont courts, plus les internautes sont enclins à les remplir. Autant que possible, limitez vos formulaires aux informations indispensables à l'exploitation des prospects.

    Ce n'est pas toujours évident d'enlever des champs car les services commerciaux qui vont récupérer les prospects générés par le formulaire préfèrent avoir un maximum d'informations. Si vous voulez les convaincre, vous pouvez mettre en place des tests de différentes versions du formulaire avec plus ou moins de champs et leur montrer les résultats. Vous pourrez ainsi trouver plus facilement un compromis sur les champs à supprimer quand ils auront compris que le volume de prospects sera plus important avec moins de champs à remplir.

    Nouveau call-to-action

    Améliorer la gestion des erreurs

    La gestion des erreurs (et donc, l'aide au remplissage) est cruciale pour que votre formulaire soit performant. Elle ne doit pas être agressive envers l'internaute et elle doit l'aider à remplir le formulaire facilement. Pour cela, il faut absolument proscrire les boites alertes javascript qui s'affichent à la validation du formulaire ou pire encore l'affichage des message d'erreurs après le re-chargement de la page. Vous pouvez aujourd'hui facilement mettre en place un système de gestion d'erreurs en ajax qui aide l'internaute au fur et à mesure du remplissage en indiquant les erreurs à côté du champ concerné. (par exemple avec Phatfusion et Mootools)

    Il est également important de formuler vos messages d'erreurs afin qu'ils ne soient pas agressifs.

    Aligner les labels

    Les labels de votre formulaire peuvent être alignés soit sur la gauche, soit sur la droite. Il n'y a pas de certitude sur l'alignement qui fonctionnera le mieux pour votre audience, mais il a été prouvé scientifiquement que le cerveau humain appréhende plus facilement l'alignement à gauche, tandis que l'alignement à droite demande un peu plus de travail de compréhension. Je vous recommande donc d'aligner vos labels à gauche, mais je vous conseille aussi de tester l'alignement à droite pour valider la préférence de votre audience.

     

    Alignement des labels 

     

    Mettre en avant la politique de confidentialité

    Si vous demandez à vos visiteurs de saisir leur adresse mail, il est pertinent de mettre un lien vers votre politique de confidentialité pour les rassurer sur l'utilisation qui sera faite de leur adresse. Cette préoccupation va sans doute  devenir de plus en plus importante pour les internautes.

    Colorer les lignes

    Afin d'améliorer la lisibilité de votre formulaire, notamment pour définir quel label correspond à quel champ, vous pouvez définir une légère couleur de fond sur chaque ligne du formulaire. Ainsi vous réduirez le temps de compréhension nécessaire à l'internaute et vous faciliterez le remplissage du formulaire.

     

    Mise en évidence du champ actif 

     

    Mettre en évidence le champ à remplir

    Dans le même ordre d'idée, il est pertinent d'indiquer à l'internaute quel est le champ actif, en modifiant la couleur  de la bordure du champ ou en ajoutant un indicateur juste à côté.

     

    Mise en évidence du champ actif

     

    Faciliter le remplissage des champs typés

    La tentation est souvent grande de mettre des limites fortes sur les champs de type email, adresse du site, date, téléphone... pour s'assurer que la donnée sera fournie au format souhaité. Attention à ne pas être trop restrictif car vous pourriez perdre des conversions si vos internautes perdent patience face à la rigidité du format demandé. Il est plus raisonnable d'être assez souple sur le format des données et de retraiter la donnée plus tard.

    Marquer les champs obligatoires

    Ça parait évident mais il faut quand même le préciser. Les internautes prennent l'habitude de reconnaître les champs obligatoires grâce aux indications fournies sur le formulaire. Faites-leur donc plaisir et indiquez-les. (Si vous avez suivi mon premier conseil, la question ne se pose pas puisque vous allez supprimer tous les champs qui ne sont pas indispensables ;-) )

    Regrouper les champs par thèmes

    Si votre formulaire est long et comporte beaucoup de champs, il est conseillé d'organiser votre formulaire en plusieurs sous-parties et surtout de bien regrouper les champs complémentaires. Par exemple, faites une partie adresse, une partie informations bancaires, une partie informations personnelles...

    Une bonne organisation des champs va permettre de réduire le temps de compréhension du formulaire par l'internaute et diminuer le risque de rebond. Dans l'exemple ci-dessous (formulaire d'inscription à Yahoo), trois parties ont été définies, ceci aère le formulaire et les champs complémentaires sont clairement positionnés ensemble : la compréhension est facilitée.

     

    Formulaire divisé en sous-parties sur Yahoo

     

    Découper les longs formulaires en étapes

    Enfin pour les formulaires vraiment longs, notamment dans les processus d'achat où il est impossible de réduire le formulaire à quelques champs, vous pouvez découper le formulaire en plusieurs étapes. Ceci évitera de décourager les internautes qui découvrent votre formulaire et paniquent devant le nombre d'informations demandées.

    Pensez bien à afficher en haut de page à quelle étape se trouve l'internaute pour qu'il puisse voir combien il lui en reste.

     

    Formulaire en étapes sur le Fnac Formulaire en étapes sur le Fnac

     

    Voilà, maintenant vous avez de quoi améliorer vos formulaires et augmenter votre taux de conversion. Gardez à l'esprit qu'un formulaire doit être le plus simple et instinctif possible pour bien transformer.

    Si vous souhaitez transformer plus de visiteurs en prospects, n'hésitez pas à nous contacter !

    Nouveau call-to-action

    L'auteur
    Eric Huertas
    Eric Huertas

    CEO et Consultant E-Business au sein de l’agence PumpUp, je mets à profit mon savoir faire au service des PME et Grands Comptes afin de structurer leur stratégie commerciale digitale et de rentabiliser leurs investissements web.

    Pour aller plus loin

    Quelle méthodologie pour travailler le SEO ?
    Quels sont les algorithmes SEO de Google ?
    Comment définir son budget SEO quand on est une PME ?