![4 modèles de conception de formulaires inspirants [GRATUITEMENT].](/cdn-cgi/image/width=1024,quality=83,format=auto/api/_files/skUfFRwsVbubAsUUd7xwq7/download/)
Une étude menée par HubSpot a révélé que 82 % des personnes interrogées ont déclaré avoir abandonné l'entonnoir d'achat d'un site web en raison de formulaires médiocres ou incomplets et que 93 % de ces personnes avaient rencontré ces formulaires pour la première fois sur des ordinateurs de bureau.
Les formulaires sont un élément essentiel de votre site web et de votre activité, que vous réalisiez un sondage, offriez à vos clients potentiels un moyen de vous contacter ou encouragiez les inscriptions à la newsletter. Il existe de nombreuses façons de réaliser un formulaire web esthétique et efficace, mais il est toujours possible de l'améliorer. Les formulaires ne doivent pas être mornes.
4 Inspirational Form Design Patterns [FREE]
Un formulaire bien conçu ajoute de la valeur à l'ensemble du design sans nuire à son utilité. En outre, de tels formulaires sont beaucoup plus performants. Dans le nouveau cadre de conception d'interface utilisateur de Salesforce, Lightning, de petites modifications de la conception des formulaires peuvent améliorer la conversion des formulaires. Plongeons-y.
Formulaires sans boîte
Les formulaires Web sans boîte sont des formulaires Web qui ne comportent aucune boîte ou bordure visible. Cela fait paraître les formulaires web plus contemporains et modernes puisqu'ils n'ont pas l'aspect traditionnel des formulaires web avec des boîtes qui les entourent. Les formulaires web traditionnels avec des boîtes autour d'eux peuvent être considérés comme datés.
Les formulaires web basés sur des courbes tirent parti de l'utilisation de lignes et de coins courbes pour créer de l'intérêt. Les courbes se retrouvent dans les formes et les mises en page. Les boîtes courbes bien conçues n'ont pas nécessairement besoin de suivre les designs traditionnels en forme de boîte. Si elles sont correctement réalisées, les courbes peuvent même guider l'œil autour de l'ensemble du formulaire Web, ajoutant une tension entre l'espace négatif et l'espace positif. Cela ajoute beaucoup d'attrait visuel et peut aider à rendre un formulaire web d'apparence terne plus excitant et engageant.
Formes animées
La conception de formulaires animés est conçue avec une certaine animation dans le formulaire lui-même. Cela peut être fait à de nombreux niveaux différents, des animations simples qui aident à créer de l'intérêt et à attirer l'attention (comme les flèches et les boutons rebondissants) aux conceptions plus complexes et élaborées qui font ressortir le meilleur du design web animé comme les animations d'arrière-plan ou les transitions entre les pages. L'objectif principal de l'utilisation de tels effets animés est de rendre votre expérience utilisateur aussi attrayante que possible - ce que nous savons tous que les utilisateurs ont du mal à faire avec ces formulaires de site Web fastidieux !
Glissez-vous depuis le bas ou le côté
Ce modèle de flux Web permet aux utilisateurs de soumettre un formulaire de contact à tout moment sans nuire à l'apparence générale. Vous pouvez permettre aux consommateurs d'entrer en contact avec vous dès qu'ils sont prêts en ajoutant un bouton de contact au bas du site.
Vous pouvez également utiliser un menu coulissant pour permettre aux gens d'accéder à votre formulaire. Au lieu d'envoyer les visiteurs vers une page de contact, tirez le formulaire sur le côté de l'écran. C'est un excellent modèle pour les cas où quelqu'un pourrait vouloir chercher des informations sur le site tout en assistant.
Formulaire plein écran
Une excellente technique pour attirer l'attention sur votre formulaire consiste à éliminer les distractions. Plutôt que d'entasser votre formulaire dans un emplacement déjà tramé de votre site Web (comme le pied de page), essayez d'incorporer un point d'engagement pour le rendre plein écran. Cela aide votre utilisateur à saisir les informations qu'il souhaite de manière simple et ciblée, ce qui lui permet de le compléter plus facilement.
Formulaires en langage naturel
Si les formulaires Web pouvaient parler, ils pourraient ressembler à ceci : " Vous êtes sur le point de soumettre vos informations. Vous êtes sûr ? C'est obligatoire." Les formulaires sur le web ne sont pas toujours aussi simples que nous le souhaiterions. Aujourd'hui, nous attendons des expériences Web et des interfaces utilisateur qu'elles soient plus humaines et familières ; par exemple, l'interaction avec une page Web devrait ressembler davantage à une conversation qu'à une frappe. La saisie en langage naturel est l'un des moyens de donner aux formulaires Web un caractère plus conversationnel, c'est-à-dire qu'il ne s'agit pas simplement d'un autre texte écrit à remplir. Une interface en langage naturel aide les utilisateurs en posant des questions de manière à ce que les humains posent des questions. Elle vous permet de créer un contexte conversationnel tout en réduisant les malentendus en utilisant le modèle conventionnel d'étiquette de formulaire et de boîte de saisie. Elle offre également une sensation unique et bien conçue.
Conception de formulaire étape par étape (procédural)
Une conception de formulaire Web étape par étape vous permet de décomposer les sections d'information en parties digestes faciles à suivre. Ici, l'utilisateur reçoit des repères visuels pour remplir chaque champ.
Cette page Web a un chemin clair que les utilisateurs doivent emprunter à travers les étapes de son formulaire Web, avec à la fois des titres et des repères visuels qui les guident le long du chemin. L'utilisation de ce modèle de formulaire facilite la tâche des personnes qui pourraient hésiter à donner leurs informations en ligne.
Laisser les gens ajouter des informations par morceaux faciles à comprendre encourage l'élan vers l'avant et offre une expérience plus ciblée que le simple fait d'afficher tous les champs en même temps.
Un simple clic sur un bouton peut suffire dans certains cas. Mais parfois, vous voudrez afficher le nombre d'étapes nécessaires pour remplir le formulaire, afin qu'un utilisateur ne soit pas perdu tout au long de la procédure.
Conclusions
Le web est une rue à double sens, et nous devons créer un contenu web de valeur pour les utilisateurs et les garder engagés avec une conception de formulaire web passionnante. Les formulaires font partie intégrante de l'expérience de navigation sur le Web, alors pourquoi ne pas passer un peu plus de temps à réfléchir à la manière de rendre vos formulaires Web aussi attrayants que possible ? En réfléchissant à ces modèles et en ajoutant une touche plus humaine à nos conceptions de formulaires web, nous pouvons aider à réduire les taux d'abandon tout en encourageant un meilleur engagement avec moins de confusion.
