Les 10 commandements pour un bon formulaire (Partie 2)
Étiquettes : accessibilité, Communication Web, Web 2.0
Design, intégration,… Découvrez la suite des 10 commandements pour un bon formulaire pour optimiser ces derniers.
La semaine passée, nous avions commencés ensemble une liste des bonnes pratiques dans vos formulaires. On remet le couvert cette semaine avec des points touchants plus au design et à l’intégration qu’à la réflexion en amont.
Les 10 commandements pour un bon formulaire, c’est reparti!
Les consignes du mot de passe, clairement tu indiqueras
« Votre mot de passe doit contenir au moins: »
- 1 majuscule
- 10 lettres
- 1 caractère spécial
- 3 oeufs
Indiquez clairement les consignes obligatoires pour la sélection des mots de passe dans vos champs. L’utilisateur pourrait abandonner le process d’inscription si son mot de passe n’est pas validé après plusieurs tentatives. Surtout si vous n’avez pas indiqués clairement ce dont il a besoin.
Les captchas, tu oublieras
Je n’aime pas plisser les yeux pour déchiffrer un captcha incongru d’une suite de lettres telles que : « eijfb moruhghe ». Vos utilisateurs non plus. Et ne me parlez pas de cette mise à jour du plugin reCaptcha de Google avec ces images similaires à cocher, c’est encore pire. Préférez plutôt d’intégrer Akismet dans vos formulaires, il se chargera de filtrer vos spams sans besoin d’interaction avec l’utilisateur.
Le libellé de tes champs dans ces derniers, tu n’incluras point
Le titre de vos champs doit être en dehors de ces derniers. Rien de plus frustrant que de commencer à taper dans un champ et de voir l’information disparaître.
Le design, tu ne négligeras pas. Surtout pas.
La police, visible elle sera.
Vous avez trouvés une super police customisée? Très bien, gardez-la dans un dossier que vous n’utiliserez jamais. En typographie, veillez à toujours utiliser une police qui soit :
- Suffisamment grande
- Lisible sur tout support (choisissez une google web safe font)
- En accord avec votre site internet
Tes champs seront suffisamment grands sur mobile
Essayez d’appuyer avec votre pouce sur des champs trop rapprochés les uns des autres. Vous n’y arrivez pas, vous vous frustrez, vous quittez la page. Je vous conseille d’avoir des boutons d’au moins 44 pixels de haut et de large. Et pour les champs, c’est pareil, n’ayez pas de champ de moins de 44 pixels. C’est même la recommandation Apple.