Accueil > Interface > Ergonomie > Réussir votre formulaire d’inscription

Réussir votre formulaire d’inscription

lundi 10 octobre 2005, par Nissone

Le formulaire d’inscription est un des points les plus importants et les plus délicats ; que ce soit pour le fonctionnement du site (sécurité, informations) comme pour le futur inscrit (passage obligé et décisif pour devenir un nouveau membre).
Pour qu’il soit réussi, de nombreux points doivent être soignés. Cet article propose des idées, des remarques de bon sens, des informations importantes... tout pour optimiser l’ergonomie, le design, l’accessibilité, l’efficacité, etc. d’un formulaire d’inscription.

Les informations

Des informations concises et utiles

Le formulaire va d’abord donner une première impression au visiteur ; la page ne doit pas le faire fuir.

Il ne faut pas oublier que les internautes ne sont pas patients, qu’ils passent souvent leur temps à remplir des formulaires d’inscription, à devoir donner des informations sur eux, leur goûts, etc., pour accéder à des pages. Il vaut mieux éviter de demander des informations en trop grand nombre ! D’abord, cela va charger votre base avec des informations dont vous ne ferez probablement pas usage (Allez-vous vraiment téléphoner à vos internautes ?!) Ensuite, cela peut décourager celui qui voulait s’inscrire. Non seulement c’est trop long mais il est aussi en droit de se demander pour quelle raison on a besoin de savoir sa ville pour jouer à un jeu en ligne.
N’oubliez pas, d’autant plus, que s’il estime la question inutile ou trop personnelle, rien ne l’empêchera de remplir de fausses informations !

Aider à la saisie

Mentionnez, dés le début, les champs obligatoires et, comme précédemment, ne rendez obligatoires que ce qui doit vraiment l’être.
Une aide contextuelle est la bienvenue. Pour indiquer un format de date, préciser en quoi on a besoin de telle information, etc.
Attention, tout de fois, à ne pas surcharger le formulaire en renseignements : vos indications comme vos libellés, pour être efficaces, doivent être clairs, concis ... inutile de faire de la littérature ici.

La présentation

Une présentation adaptée

Ce premier point acquis, soignez la présentation de votre page.
Si le contexte de votre site nécessite un formulaire long, découpez le en plusieurs étapes que l’internaute pourra visualiser et identifier. Ainsi, il ne sera ni surpris ni lassé si, en validant sa page, il doit encore remplir d’autres renseignements.

Cheminement et actions

Dans ce type de questionnaire à étapes, il y a quelques règles à respecter.
Il est notamment nécessaire de permettre de revenir aux étapes précédentes. Au moment de la validation finale, un récapitulatif de l’ensemble des informations données, avec la possibilité de les modifier, est, là aussi, le bienvenu. Que ce soit pour l’accessibilité du site... comme pour le confort de tous.
Exemple de navigation d'un formulaire à étapes

Pour un formulaire long comme pour un formulaire court, n’oubliez pas d’afficher une confirmation après la validation. Rien de plus perturbant pour un internaute que de n’avoir aucune explication de ce qu’il va découler d’une action qu’il vient de faire !

L’ergonomie et le design

Une utilisation fluide et agréable

Après avoir travaillé le contenu, apporter un soin tout particulier à sa présentation et à son comportement peut être d’une grande aide pour l’internaute et, là encore, contribuer à l’effort de séduction que vous faites envers lui.

Découpez les types d’informations en zones, grâce aux balises et (c’est-à-dire la délimitation de la zone et son titre).
La balise < label >, nécessaire aux navigateurs vocaux, est aussi très utile et très agréable. Elle permet de mettre le curseur dans le champ de saisie voulu quand on clique sur son étiquette. Et surtout, ce dont on se passe difficilement dès qu’on y a goûté, elle permet de cocher / décocher un bouton radio ou une case à cocher en cliquant sur son libellé (la zone de clic est considérablement élargie).

Un design agréable mais aussi informatif

Pour ce qui est du design lui-même, les feuilles de style vont vous permettre de rendre votre formulaire plus « sexy », apporter quelques agréments supplémentaires.
Vous pouvez, par exemple, les utiliser combinées au javascript, pour modifier l’apparence d’un champ de saisie quand le focus est sur lui. Rien ne vous empêche non plus d’appliquer un style particulier à vos champs obligatoires ; de personnaliser vos champs de saisie aux couleurs de votre site, etc. Tant que vous ne faites pas de votre page un arc-en-ciel de couleurs doublé d’un feu d’artifice d’effets ! Mettez-vous à la place de l’internaute et simplifiez-lui la vie.

Le fonctionnement

La fiabilité des informations

Votre formulaire est maintenant d’une présentation irréprochable ; attaquons-nous à son fonctionnement (fiabilité, enregistrement)

Il va, bien évidement, falloir vérifier les informations qui vous ont été indiquées : la présence du « @ » dans l’email, une date au format voulu, etc.
Pour limiter les erreurs, vous pouvez avoir recourt au menus déroulants, à un calendrier cliquable, etc. Le tout est de minimiser la frappe de l’internaute (sans pour autant alourdir le formulaire inutilement).

Faire une première vérification en Javascript peut vous permettre de limiter les sollicitations au serveur. Par contre, ne serait-ce que dans le cas où le Javascript est désactivé, il faut quand même faire une deuxième vérification côté serveur avant d’enregistrer les informations dans la base. A vous de juger, donc, en fonction du nombre d’informations à vérifier, de votre serveur, etc.

Une petite astuce bien pratique est de désactiver le bouton de validation final dès qu’il a été cliqué une première fois. Cela permet d’éviter les inscriptions en doublons des internautes qui cliquent deux fois (soit que la page suivante est lente à charger et qu’ils s’impatientent ; soit qu’ils double-cliquent par habitude).

La confirmation

L’envoi d’un mail de confirmation va vous permettre de vérifier la validité du mail - si celui-ci est nécessaire pour le déroulement du jeu - en confirmant et achevant l’inscription via celui-ci.
C’est également le moyen de rappeler à l’internaute ses paramètres de connexion. D’abord, même si votre envoi est immédiat, il peut très bien finalisé son inscription plus tard ; mais ainsi, il garde aussi une trace, dans ses mails, au cas où il perdrait son mot de passe ... ou votre URL !
N’oubliez donc pas de rappeler, dans votre mail, le nom du jeu, son adresse, éventuellement comment se connecter et les informations personnelles de votre nouvel inscrit : login et mot de passe.
Si nécessaire, vous pouvez également aiguiller votre nouveau joueur vers la prochaine étape de jeu, ce qu’il peut dès à présent faire. Ceci dépend surtout de la complexité de votre game-play.

La legislation

Les informations légales

Un dernier point à aborder, et non des moindres, est la partie légale.
En premier lieu, un site qui récolte des informations sur des personnes -et c’est le cas d’un formulaire d’inscription - doit être déclaré à la CNIL. C’est totalement gratuit. Mentionnez alors votre numéro de déclaration dans votre page et rappelez au visiteur qu’il garde un droit de consultation et de modification des informations qu’il aura remplies.

Le règlement interne

Le formulaire est aussi l’occasion de faire lire et accepter le règlement du jeu et du site par le futur inscrit. N’autorisez la validation du formulaire que si le champ correspondant au règlement a été rempli.

La newsletter

Enfin, si vous proposez une newsletter, sachez que la Loi sur l’Economie Numérique, vous interdit d’inscrire l’internaute par défaut. Il doit lui-même cocher une case indiquant qu’il souhaite être abonné à la newsletter.
Si le fonctionnement de votre jeu oblige à recevoir des mails, précisez-le.

Un formulaire prêt et complet ;-)

Fonctionnement, ergonomie, accessibilité, ... ; séduction, look, fiabilité, ... votre formulaire est maintenant fin prêt !
Il ne me reste plus qu’à vous souhaiter beaucoup d’inscrits ;)