16 étapes pour générer plus de leads sur vos formulaires

Soyons honnête, remplir un formulaire n’est pas l’interaction la plus ludique qu’aura un visiteur avec votre site. Malheureusement, c'est LA méthode la plus courante pour récupérer ses informations, que ce soit pour un téléchargement ou un achat. Ne pas optimiser et personnaliser vos formulaires est un manque à gagner certain pour votre entreprise.

Le formulaire est le lieu qui permet aux visiteurs de renseigner leurs informations personnelles en échange d'un produit/service : inscription sur le site, à la newsletter, à un événement, abonnement, commande, demande de contact, concours, enquête, paiement en ligne, réclamation, demande de renseignement, etc.

Un formulaire non optimisé est une barrière pour vos taux de conversion. Il peut ralentir vos visiteurs et créer de l’incertitude si les informations demandées ne sont pas nécessaires, voire de la frustration s’il est trop long à remplir.

« Côté visiteur, un formulaire optimisé ne doit pas être perçu comme une barrière, mais comme un échange naturel entre l'internaute et vous. -Anaïs Rousseau, Head of Customer Success @ Kameleoon.

1. Pour commencer, qu’est-ce qu’un bon formulaire ?

Il n’y a pas de règles fixes concernant les formulaires : ce qui marche pour certains ne fonctionne pas forcément pour d’autres. Il faut donc garder à l’esprit les points que je développe dans cet article sans pour autant perdre de vue vos objectifs, les intérêts de vos visiteurs et le contexte dans lequel vous proposez le formulaire. Ce ne sera pas une mince affaire ! ? Pour commencer, voici quelques questions à vous poser avant de créer un formulaire :

• Pour qui ? Quels individus sont visés par votre formulaire ? Quelles sont leurs attentes et leurs besoins ? Ont-ils des habitudes concernant le remplissage de formulaire ?
• Pourquoi ? Le but de votre formulaire est-il intéressant pour vos visiteurs ? Que leur donnez-vous en échange de leurs informations personnelles ?
• Où ? A quel endroit est positionné votre formulaire ? Comment apparaît-t-il ?
• Quand ? A quel moment de leur navigation sur le site les internautes accèdent-ils au formulaire ?

Et voici quelques questions que vos visiteurs ne doivent surtout PAS se poser en remplissant votre formulaire :

• Pourquoi devrais-je donner mes informations personnelles ?
• Qu’est-ce que je gagne à remplir ce formulaire ?
• Que va-t-il se passer si je complète le formulaire ?
• Puis-je faire confiance à ce site ?

2. Quel taux de conversion viser pour mon formulaire ?

Pour vous donner une idée du taux de conversion moyen en fonction du type de formulaire, voici quelques chiffres issus d’une étude réalisée par Formstack : Pas de panique ! Il s’agit seulement d’éléments de comparaison et l’essentiel est de vous focaliser sur vos objectifs. En fonction des modifications que vous entreprenez, votre taux de conversion évolue et vous devez vous concentrer sur vos résultats pour effectuer des tests a/b et trouver les optimisations qui seront les plus efficaces pour vous. Je vous propose maintenant de passer en revue les 16 points qui me semblent essentiels à prendre en compte pour optimiser vos formulaires ?.

3. 16 étapes pour optimiser vos formulaires

Quelle est la bonne longueur pour un formulaire ?

Vous avez certainement déjà entendu ce principe bien connu : « less is more ». On peut lire dans de nombreux articles que plus le formulaire est court, plus le taux de conversion est élevé. En effet, de nombreux tests démontrent cette hypothèse. Pourtant, il ne s’agit pas d’une vérité absolue et la quantité de leads obtenus n’en garantit pas la qualité. Le nombre de champs dépend du but de votre formulaire. Si vous voulez faire une enquête ou enregistrer un paiement, vous demanderez forcément plus d’informations aux internautes que s’il s’agit d’une prise de contact ou d’un concours. Comme le montre cette étude, un formulaire long peut avoir un taux de conversion supérieur à un formulaire court. L’essentiel est que le visiteur n’ait pas le sentiment de remplir trop de champs. Il existe quelques techniques simples pour vous aider à réduire la taille de votre formulaire, ou du moins à en donner l’impression :

• Ne gardez que les champs essentiels.
• Utilisez des champs conditionnels, c’est-à-dire qui s’affichent seulement une fois un autre champ rempli.
• Avertissez clairement les internautes qu’ils ne sont pas obligés de remplir les champs optionnels.
• Réunissez les questions liées pour obtenir une meilleure visibilité.

Prenons l’exemple de Renault et de son formulaire de création de devis. A l’origine, les champs à remplir n’étaient pas organisés et perturbaient le parcours des visiteurs. Après un petit remaniement, le bloc « My Renault » a été déplacé en bas de page et l’intitulé « Information du véhicule » a été ajouté et regroupé avec « Choisissez votre concession ». Le résultat est sans appel : le nombre de champs n’a pas diminué, pourtant cette réorganisation a permis d’augmenter de 63 % le nombre de rendez-vous pris.

Réduire la taille d’un formulaire ne conduit pas toujours à une augmentation des conversions. Un formulaire à 5 entrées libres peut moins convertir qu’un formulaire à 10 champs de type menus déroulants. Pour le découvrir, rien de tel qu'un test A/B ! -Frédéric de Todaro, Head of Consulting, Kameleoon.

Formulaire en colonne ou formulaire par étape, que choisir ?

Intimement lié à la longueur, parlons maintenant de la forme du formulaire : en colonne ou sur plusieurs pages, quelle forme convertit le mieux ? Selon une étude menée par Formstack, le taux de conversion pour les formulaires en plusieurs étapes est de 13,85 % contre 4,53 % pour ceux tenant sur un page. Plusieurs éléments expliquent le succès des formulaires en plusieurs étapes :

• Les champs à remplir sont regroupés par catégorie ce qui rend la progression des internautes plus naturelle.
• La barre de progression permet de guider les internautes
• Les formulaires en plusieurs étapes sont moins chargés et laissent plus de place au design : images, grands titres, barre de progression…

Encore une fois, tout est relatif, et bien sûr, il ne serait pas judicieux d’opter pour un formulaire en plusieurs étapes si les internautes n’ont que 3 ou 4 champs à remplir. Concernant les formulaires sur une page, restreignez-vous à une seule colonne. Une étude de CXL a montré que les utilisateurs sont plus rapides pour remplir un formulaire d’une seule colonne. Cela s’explique notamment par le fait que les formulaires en plusieurs colonnes demandent plus d’attention de la part des internautes qui ne comprennent pas toujours l’ordre voulu ou ont tendance à chercher des liens entre les champs horizontaux. Des champs peuvent toutefois être ajoutés horizontalement s’il s’agit d’informations complémentaires (prénom-nom).

Utiliser des éléments visuels pour guider les internautes

En matière de design, et comme pour tous vos autres supports sur le web, l’important est de respecter la hiérarchie visuelle : elle permet de guider vos visiteurs durant la lecture et de mettre en évidence les éléments importants de la page. Plusieurs éléments sont à étudier lorsque l’on aborde la question du design :

• Jouer sur le contraste des couleurs
• Utiliser des éléments visuels (flèches ➡ , symbole de validation ✔, CTA ? )
• Mettre des images, des illustrations
• Aérer le formulaire avec des espaces négatifs (espaces vides)

Prenons l’exemple d’HelloBank! qui a testé plusieurs variantes pour son formulaire d’inscription : Suite à ce test, c’est la variante B qui remporte le meilleur taux d’inscription : les informations présentées sous forme de listing sont centrales dans la prise de décision des utilisateurs et permettent en un coup d’œil d’appréhender les bénéfices de l’offre. Puis le regard se porte sur le formulaire ... que les visiteurs sont plus nombreux à remplir avec cette variante. Comparé à la variante A ou F, on remarque que le design de la variante B guide le lecteur progressivement vers le CTA. Pour approfondir la question du design, nous vous conseillons de lire notre article sur le sujet.

Adapter les champs du formulaire aux réponses

Sur un formulaire, les internautes peuvent répondre de deux manières : en écrivant dans un champ ou en sélectionnant des réponses.

Champs à remplir

Deux recommandations sont à garder à l’esprit concernant les champs à remplir :

• Ajustez la taille des champs en fonction de l’information demandée

• Utilisez un système de focus (cadre de couleur quand l’internaute clique sur un champ) qui permet aux internautes de se repérer dans le formulaire

Réponses à sélectionner

Si vous proposez des réponses à sélectionner dans votre formulaire, plusieurs solutions sont possibles :

• Les boutons radio
• Les cases à cocher (plusieurs choix possibles)
• Les menus déroulants
• Le remplissage automatique des champs (possible avec des navigateurs comme Google Chrome ou Firefox).

Toutes ces méthodes de sélection peuvent convenir, le tout est de savoir quand les utiliser :

• S’il n’y a que quelques réponses possibles (entre 2 et 6), choisissez les boutons radio ou les cases à cocher.
• Si vous avez plus de 6 réponses possibles, optez pour le menu déroulant ou le remplissage automatiques de champs. La meilleure solution reste le remplissage automatique car les menus déroulants perturbent la navigation des utilisateurs.

Choisir un titre pour votre formulaire

Le titre est le premier élément que rencontrent les internautes et qui leur donne envie (ou non) de compléter le formulaire. Vous devez toujours garder à l’esprit qu’un formulaire est un échange : les internautes vous livrent des informations personnelles et vous devez leur offrir quelque chose qui a de la valeur : téléchargement de ressources, offre promotionnelle, etc. Club Med propose par exemple de faire gagner un séjour à la montagne pour toute inscription à la newsletter. Second point primordial concernant le titre de vos formulaires : les internautes doivent savoir à quoi s’attendre une fois le formulaire validé. Si vous demandez une démo auprès de Kameleoon, voici le titre du formulaire que vous devrez remplir : Et dès le premier regard, vous savez exactement quelle sera la suite des événements : un spécialiste vous rappellera dès qu’il aura récupéré vos infos et vous proposera une démo de nos services.

Où placer le libellé des champs ?

L’une des frictions les plus courantes vient de la place des libellés dans le formulaire puisque cela perturbe la progression des internautes s’ils ne sont pas positionnés au bon endroit. Mais quel est le bon endroit ? UX Matters a mené une étude pour observer le déplacement des regards d’utilisateurs alors qu’ils étaient occupés à remplir un formulaire. En proposant trois types de formulaire, ils ont pu déterminer lequel était le plus naturel pour les internautes. Les résultats montrent que la meilleure position pour les libellés est au-dessus du champs et alignés à gauche car c’est la seule disposition qui permet aux utilisateurs de voir le libellé et le champ en même temps. Le libellé du champ peut également être mis dans l’espace réservé à la réponse (placeholder). Bonne ou mauvaise idée ? Certes, cette stratégie vous permet de gagner de la place, mais elle engendre des frictions et ne facilite pas la navigation des internautes (mémoire courte, impossibilité de corriger, impression de champ déjà rempli…). Faut-il bannir les placeholder ? Pas tout à fait. Ils peuvent être pertinents si les utilisateurs n’ont qu’un ou deux champs à remplir. Enfin, dernier cas de figure qui vous permet de faire un compromis entre taille du formulaire et visibilité : les libellés flottants.

Comment optimiser le CTA de votre formulaire ?

Le bouton d’incitation à l’action (CTA) est l’élément final de votre formulaire et doit donc rassurer les internautes : ce n’est pas le moment de faire marche arrière. Concernant l’aspect visuel du CTA, choisissez une couleur qui contraste avec le reste du formulaire pour pouvoir être repéré du premier coup d’œil, comme ici avec nos formulaires de téléchargement de succès story. Second point déterminant : le texte du CTA. Pour inciter vos visiteurs à convertir, nous vous conseillons de tester des CTAs différents des classiques « envoyer », « soumettre », « s’inscrire » ou « télécharger ». Le CTA doit communiquer à l’internaute ce qu’il va obtenir du formulaire, optez donc plutôt pour des formules comme : « S’inscrire maintenant », « Envoyer ma demande », « Télécharger mon ebook », « Recevoir un devis », « Demander des informations » ou même « Obtenir un mois gratuit”. Pour devenir un pro du CTA, lisez notre article sur le sujet.

Quelles informations demander à vos visiteurs ?

Il ne faut garder que les champs essentiels. Mais quels sont les champs essentiels me direz-vous ? Les informations que vous demandez doivent être en adéquation avec ce que vous proposez :

• Avez-vous déjà ces informations ? Pouvez-vous les obtenir autrement ?
• Ces informations sont-elles utiles ? Si vous ne comptez pas appeler les internautes, ne demandez pas leur numéro de téléphone, si vous n’envoyez pas de courriers, ne demandez pas l’adresse postale, etc.

Je vous conseille de demander les informations de façon progressive en fonction du niveau de maturité du visiteur. Il peut renseigner son mail lors de l’inscription à la newsletter et partager plus d’éléments lorsqu'il interagit à nouveau avec vous (téléchargement d'un ebook, dans un contexte B2B par exemple). Quoi qu’il en soit, c’est à vous de juger les champs qui seront absolument nécessaires, pour le reste, retirez-les ou précisez qu’il sont optionnels.

Les champs à bannir :

• La confirmation de mot de passe : Ne demandez pas aux internautes de remplir deux fois leur mot de passe mais proposez de l'afficher pour vérifier qu’ils n’ont pas commis d’erreurs de frappe.

• La validation par captcha : Quelle meilleure façon de dire à vos visiteurs que vous avez un problème de spam ? Outre ce fait, le système peut s’avérer très décourageant lorsqu’après plusieurs tentatives, le site vous affiche un nouveau code à recopier. Si vous ne voulez pas vous passer d’un outil de vérification, optez pour des alternatives plus ludiques (choisir une image, jeux) ou pour le captcha en un clic de Google.

Concernant l’ordre des informations demandées, commencez toujours par la plus simple (nom, e-mail) pour aller vers la plus compliquée (carte de crédit). Vos visiteurs seront plus enclins à finir de compléter un formulaire s’ils ont déjà inscrit des informations. Au contraire, si la première information demandée est les numéros de carte de crédit, il y aura plus de chance pour que l’internaute quitte le formulaire.

Bannir les formats de réponse imposés

Quoi de plus énervant que de devoir respecter un format précis pour entrer une réponse ? Qu’il s’agisse du numéro de téléphone, de carte de crédit ou de la date d’anniversaire, laissez les internautes séparer les chiffres par des points, des slash ou des espaces et acceptez tous les formats pour les dates (JJ/MM/AA ou MM/JJ/AA). Même combat concernant les majuscules : Il existe des manières très simples de supprimer les espaces ou les caractères superflus avec quelques lignes de code ou en utilisant un système de masque de saisie (XX XX XXXX pour une date par exemple).

Aider vos visiteurs au remplissage des champs

Pour faciliter la tâche à vos visiteurs et réduire le nombre de champs à remplir manuellement, voici quelques astuces :

• Proposez de se connecter avec les réseaux sociaux. Précisez néanmoins qu’aucune publication ne sera mise en ligne sans leur accord.

• Pour le paiement en ligne, proposez aux internautes d’enregistrer leur carte pour qu'ils puissent payer en un clic la prochaine fois.

• Proposez un calendrier où les internautes peuvent se déplacer de mois en mois et sélectionner une date.

• Utilisez des solutions de recherches prédictives : il suffit d’entrer une lettre pour que des choix de réponses apparaissent.

• Appuyez-vous sur l’auto remplissage des champs grâce aux navigateurs (Google Chrome, Firefox…). Il faut pour cela choisir des libellés qui correspondent à ceux du navigateur et la réponse enregistrée est proposée à l’internaute lorsqu’il clique dans le champ.

• Mémorisez les informations que vous possédez déjà sur vos visiteur et pré-remplissez les champs pour lesquels vous possédez déjà les informations. Si vous avez déjà téléchargé des ressources sur Hubspot, vous avez pu noter que les informations enregistrées lors d’un premier contact ont été sauvegardées pour pré-remplir les champs. Cette méthode permet aussi de remplacer des champs déjà remplis par d’autre pour obtenir de nouvelles informations.

Valider ou corriger les réponses de vos visiteurs en temps réel.

Quoi de plus énervant que de voir des messages d’erreur s’afficher après avoir validé ses réponses ? Vous alliez obtenir ce pourquoi vous avez complété le formulaire et… retour à la case départ. Pour résoudre ce problème, il suffit de mettre en place un système de validation ou de correction en temps réel. Ainsi, dès qu’un champ est rempli, un signal visuel indique à l’internaute si sa réponse convient ou non. Avec cette méthode, les internautes peuvent se corriger immédiatement et n’ont pas à revenir en arrière par la suite. Faîtes en sorte que la correction n’apparaisse qu’après la saisie, au risque de perturber l’internaute. Pour prévenir les erreurs, n’hésitez pas à donner des indications aux internautes :

• Affichez des ❓ à côté des champs où vous voulez aider les visiteurs

• Afficher des encarts visibles sans avoir à cliquer sur un bouton

Utiliser des formulaires ludiques

Malgré toutes les optimisations possibles, certains internautes seront toujours réticents pour remplir un formulaire. Pourquoi ne pas tester une forme plus ludique ?

Mad lib :

Vous rappelez-vous de l’époque où votre professeur vous proposait des textes à trous pour vos exercices de grammaire ? Il n’y avait que quelques mots à écrire et cela était beaucoup plus simple… Vous voyez où je veux en venir ? Le but est de rendre votre formulaire plus vivant et interactif comme le fait le site de partage audio Huffduffer : Sous la forme d’une histoire courte, les internautes renseignent leurs informations et progressent naturellement grâce au processus de lecture.

Chatbot :

Jetons maintenant un œil à une campagne menée par Meetic pour transformer plus de visiteurs en clients : l’usage d’un formulaire camouflé et interactif par le biais d’un chatbot. Le chatbot est une fonctionnalité adaptée au contexte car il permet aux visiteurs de discuter avec Lara, qui les accompagne dans la création de leur compte et les rassure en répondant à leurs questions. Au lieu de remplir les cases d’un formulaire classique, les visiteurs font face à une véritable conversation et le tutoiement permet d’établir un climat amical. Avec cette campagne de personnalisation, l’objectif de Meetic est atteint ! Le nombre d’inscriptions a significativement augmenté chez le type de visiteurs ciblés.

Diffuser le formulaire à la bonne cible

Lorsque vous proposez un formulaire à vos visiteurs, vous recherchez soit à collecter un maximum de données, soit à récolter des leads qualifiés (quantité vs qualité).

Obtenir un maximum de contact :

Si votre but est de partager votre formulaire au plus grand nombre :

• Faîtes en sorte de rendre votre formulaire accessible depuis toutes les pages de votre site : utilisez les barres latérales, les encarts de haut de page (header) ou de bas de page (footer) ou des pop-in.
• Créez une landing page et partagez-la sur les réseaux sociaux pour atteindre les internautes qui ne sont pas sur votre site.

Obtenir des leads qualifiés :

Vous pouvez choisir de faire apparaître le formulaire à un public en particulier grâce au ciblage de votre audience. Avec cette méthode, le but est d’obtenir des leads plus qualifiés. C’est notamment ce qu’a entrepris Routard.com qui voulait augmenter le nombre d’inscription à sa newsletter tout en la dirigeant vers des contacts vraiment intéressés et non pas à l’ensemble des visiteurs. Initialement, le formulaire s’affichait en bas de page dans le footer. Désormais, il s’affiche sous forme de pop-in uniquement aux visiteurs ayant consulté au moins 3 pages. Avec la nouvelle version de la newsletter qui s’affiche sous forme de pop-in, le taux d’abonnement a augmenté de 76 % et les inscrits sont plus susceptibles d’être des contacts qualifiés car ils ont déjà consulté plusieurs pages.

Optimiser le formulaire sur mobile

Comme pour votre site web, vous devez adapter le format de vos formulaires pour les appareils mobiles. Ce n’est plus un secret pour personne : aujourd’hui plus de 60 % du trafic d’un site a lieu sur mobile (SalesForce Report). De nombreux éléments peuvent perturber la navigation sur mobile si votre formulaire n’est pas adapté : texte trop petit, menus compliqués, contenu non-centré, etc. Voici quelques éléments qui vous serviront pour obtenir le formulaire le plus ergonomique possible sur mobile :

• Adaptez la taille des champs et des boutons de votre formulaire : ils doivent être cliquables avec le doigt !

• Optimisez le clavier des utilisateurs en ajoutant des raccourcis sur le clavier principal : caractères spéciaux pour l’adresse e-mail, clavier à chiffres pour les réponses chiffrées , sélection de date, etc.

• Simplifiez la saisie au maximum : proposez aux internautes de se connecter avec les réseaux sociaux, utilisez des solutions d’auto-remplissage, proposez la géolocalisation pour l’adresse ou la prise de photo pour joindre des documents ou renseigner les chiffres de carte bancaire.

Anticiper les inquiétudes de vos visiteurs

Remplir un formulaire, c’est une forme d’engagement, et si vos visiteurs ne se sentent pas en sécurité ils se détourneront immédiatement. Pour rassurer vos visiteurs, l’idéal est d’insérer un lien vers votre politique de confidentialité. Vous pouvez également inclure une phrase leur indiquant qu’ils ne recevront pas de spam.

Utiliser le social proof pour convaincre vos visiteurs

Avant d’être un levier marketing, le social proof est un puissant phénomène sociologique. Il s’agit du fait qu’un individu est fortement influencé par le comportement et les choix du plus grand nombre. Si l’on en revient aux formulaires, vous pouvez par exemple mettre en avant le nombre d’abonnés à votre newsletter pour défendre sa qualité ou le nombre d’acheteur d’un produit pour le mettre en avant. Voici par exemple la landing page permettant de s'inscrire à la newsletter de Conversion Matters, notre blog incontournable de l'optimisation de l'expérience utilisateur. Comme vous pouvez le voir, nous sommes déjà nombreux, on attend plus que vous !

4. A/B testez vos formulaires !

Avant de vous lancer tête baissée dans l’optimisation de vos formulaires, vous devez identifier les éléments qui vous coûtent peut-être des conversions en réalisant un audit ergonomique et analytique.

• Quels champs causent le plus de rebond ?
• Quels sont ceux qui génèrent le plus d’erreurs ?
• Quels sont les plus longs à compléter ?
• Lesquels doit-on rendre obligatoires ?

Autant de questions que de réponses que vous obtiendrez via votre audit.

Dernier conseil du jour : Remettez toujours en question ce que vous faites, même si ça fonctionne. Les goûts et les tendances évoluent, si votre page convertit aujourd’hui, ce ne sera peut-être plus le cas demain. Grâce à notre éditeur graphique intelligent pour l'A/B testing, faire des modifications sur vos formulaires sera simple et rapide. Et si les formulaires vous effraient, vous pouvez toujours nous passer un coup de fil ! Et vous ? Avez-vous des bonnes pratiques à partager ? N’hésitez pas à partager vos réussites, vos échecs et comment vous les avez surmontés dans la zone de commentaires !