Est-ce une mauvaise idée d'avoir des champs de saisie après le mot de passe sur un formulaire de connexion?
J'ai été intrigué par cette déclaration de @ DanWilson sur Twitter:
Tous les développeurs Web: jamais jamais mettre quoi que ce soit après la zone de mot de passe et avant de soumettre le bouton d'un formulaire L'onglet DOIT aller directement pour soumettre.
Lorsque j'ai demandé des éclaircissements, il a ajouté:
car le modèle d'interface utilisateur est Nom d'utilisateur TAB Mot de passe TAB Entrée Clé.
Quelqu'un peut-il m'indiquer des preuves qui corroborent ou contredisent cette affirmation, même si elle est anecdotique?
La meilleure situation d'onglet et les situations courantes sont:
- entrée: email
- entrée: mot de passe
- case à cocher: me garder connecté dans (parfois cela est omis)
- bouton: soumettre (notez comment vous pouvez utiliser la barre d'espace, plus rapidement que d'entrer dans certaines situations)
Preuves:
- Google (connexion unifiée)
- Yahoo (connexion unifiée, comprend Flickr, Delicious)
- Twitter (notez également en quoi le flux visuel diffère du flux d'onglets pour être cohérent!)
- Facebook (ibidem)
- Baidu
- Wikipédia
- Craiglist
- Mon espace
- IMDB
Disjoncteurs notables:
- MSN
- eBay
Donc, avec ces sites, nous incluons probablement la plupart des internautes du monde et ils sont tous alignés sur le comportement que j'ai décrit.
Les ruptures flagrantes de ce modèle se produisent lorsque les concepteurs de formulaires utiles placent le lien Mot de passe oublié sur la tabulation après le mot de passe et avant le bouton de soumission. Cela se traduit inévitablement par le rafraîchissement de la page, un nouveau chargement de formulaire. Ensuite, lors du retour, conformément aux bonnes pratiques de sécurité, le champ du mot de passe (que j'ai tapé la première fois) est vide.
Bien que je respecte totalement la liberté esthétique des concepteurs et des développeurs et que je ne souhaite pas que le Web ait l'air homogène, le comportement du Web devrait l'être.
Dan Wilson
Pensez simplement à vos propres expériences - lorsque vous vous connectez à un site, que comptez-vous faire? Moi, je m'attends à faire exactement ce que Dan a dit - Nom d'utilisateur TAB Mot de passe TAB entrer. J'ai même vu des emplacements dotés de la fonctionnalité "Se souvenir de moi" qui maintiennent ce concept de base - Sur chase.com, pour accéder à la case à cocher "Se souvenir de mon nom d'utilisateur", vous devez en fait passer le bouton Soumettre pour vous concentrer sur la case à cocher. Je ne sais pas si j'aime vraiment ça, mais cela rend la connexion générale beaucoup plus rapide.
Un ajout que j'aurais à sa déclaration est que sur une page de connexion, le focus initial DOIT être sur le champ du nom d'utilisateur. Je ne peux pas compter le nombre de sites Web vers lesquels je me concentre mal (ou pas du tout) lors du premier chargement d'une page.
Je ne crois pas que le modèle UX dominant soit le nom d'utilisateur TAB Password TAB Enter. Pourquoi le TAB + Enter supplémentaire après avoir tapé le mot de passe? Enregistrez-vous une frappe et appuyez sur Entrée après avoir entré le mot de passe pour soumettre le formulaire. Comme le mentionne Chase, pour les formulaires de connexion: Nom d'utilisateur TAB Mot de passe Entrez.
Je considère que les formulaires comportant de faux boutons de soumission en utilisant input type = 'button' au lieu de type = 'submit' une pénalité UX plus offensive. Cela renforce l'habitude TAB + Enter de soumettre un formulaire alors qu'il devrait simplement être Enter.
Il n'est pas pertinent de répondre "Je n'utilise pas ce modèle". Que le modèle soit ou non le modèle dominant (et votre taille d'échantillon ne le montre pas), s'il s'agit d'un modèle significatif, il doit être respecté. Peut-être que seulement 10% des utilisateurs appuient sur un onglet avant d'entrer, mais vous ne voulez pas énerver 10% de vos utilisateurs pour quelque chose d'aussi simple à réparer que cela.
Pour les formulaires de connexion si la conception nécessite quelque chose entre le mot de passe et la soumission, vous pouvez toujours changer l'ordre des onglets afin qu'il ignore les éléments de mauvaise expérience lors de la tabulation. Voir https://www.bankofamerica.com/ qui est quelque peu similaire. Le tabulation va utilisateur/zone/soumettre, continuez à tabuler pour obtenir le lien pour la case à cocher et le lien.
Je pense que la question plus large (pour moi) est de placer un élément anti-action là où l'action devrait être. annuler/réinitialiser les boutons où les boutons de soumission sont normalement, etc. Nous sommes des créatures plutôt automatisées et lisons/faisons rarement attention aux légers changements.
Je suis d'accord avec John. Je pense que la plupart des gens appuient sur Entrée dans le champ du mot de passe (je le fais), ou cliquent/tapent sur le bouton Entrée.
Cependant, pour les quelques utilisateurs de Windows qui appuient sur Tab puis sur Entrée, Dan a raison: il ne doit rien y avoir entre le champ d'édition du mot de passe et le bouton Entrée.
J'ai choisi les utilisateurs de Windows parce que sur le Mac, la valeur par défaut est qu'en appuyant sur Tab vous amène au champ d'édition ou à la liste suivant. Cela ne vous mènera jamais à un bouton. Mes excuses aux utilisateurs de Linux; Je ne suis pas sûr des détails là-bas.