Formulaires Web : bonnes pratiques

Intérêt d’un formulaire

Les formulaires interactifs permettent aux auteurs de pages Web de doter leur page web d’éléments interactifs permettant par exemple un dialogue avec les internautes, voire de futurs clients.

Formulaires web

Il est primordiale d’attacher de l’importance quant à son formulaire et à son traitement.
Si la page d’accueil d’un site est un peu comme la vitrine d’un magasin, le formulaire est un peu comme la porte d’entrée du magasin. Si elle est trop lourde ou bloquée, le client potentiel ne prendra pas la peine de rentrer en contact avec le vendeur. Il en va de même pour un formulaire, on peut récupérer de nombreuses informations mais toujours dans l’intérêt du client.

Comment fonctionne un formulaire web ?

Le lecteur saisit des informations en remplissant des champs ou en cliquant sur des boutons, puis appuie sur un bouton de soumission (submit, envoyer) qui sera par un script qui transférera les données sur une base de données ou par mail ou les deux.

Il est primordial de distinguer clairement les champs de saisie obligatoires des champs de saisie optionnels (ou inversement). De manière générale, on indiquera les champs obligatoires par des astérisques qui renvoie à un signet indiquant que ce champ est requis.

En tant qu’utilisateur, je n’aime pas les champs obligatoires quand je ne saisis pas leur nécessité, alors veillez à ne rendre obligatoire que le strict nécessaire.
Je vous recommande la lecture de cet article : Un exemple de filtrage réussi.

Les champs doivent être correctement organisés, c’est-à-dire présentés dans un ordre qui soit pertinent pour l’ utilisateur. Les formulaires les plus élaborés peuvent contenir des champs conditionnels et correspondre à des scénarios différents, en fonction des critères retenus par l’utilisateur on adapte les champs du formulaire.

  1. L’internaute remplit le formulaire et le soumet. Dans certains cas les vérifications peuvent se faire lors de la frappe, bien avant l’envoi du formulaire comme avec LiveValidation par exemple (voir la capture ci-dessus). Les champs obligatoires et le format des données sont contrôlés au niveau du navigateur via un script ajax.

Ce premier contrôle permet d’éviter des échanges inutiles avec le serveur. Si des erreurs sont détectées, on affiche de nouveau le formulaire en ayant pris soin de conserver les données déjà rentrées par l’utilisateur et en mentionnant les champs erronés. Rien de pire que de se retrouver face un formulaire qui ne veut pas se valider sans qu’on sache pourquoi !

  • Les données sont envoyées au serveur et de nouveau contrôlées. Cette nouvelle vérification n’est pas facultative, car elle permet de garantir l’intégrité des données de la base et de filtrer des tentatives de piratage ou de destruction des données par injection SQL par exemple.
  • Un message de confirmation (e-mail) est envoyé avec le récapitulatif des informations saisies.  Il est appréciable de pouvoir conserver dans sa messagerie la trace des informations fournies.
  • Un page de confirmation ou de remerciements avec le récapitulatif des informations saisies est renvoyée au navigateur Web de l’internaute, ce qui clôture le processus.

Pour aller plus loin

Très prochainement une liste très complète de générateurs de formulaires sur ce site. Restez branché !

Mots recherchés:

Leave a comment


Ark is the most amazing premium template with powerful customization settings and ultra fully responsive template with modern and smart design.

Follow Us

Contact Form

Contact Info

Photo Stream

Copyright 2017 FRESHFACE © All Rights Reserved