Une analyse du nouveau formulaire d’inscription d’eBay

Visiblement eBay serait en train de tester une nouvelle version de son formulaire d’inscription (sur un principe de tests A/B). S’ils pensaient faire ça de manière discrète c’est raté puisque Garrett Dimon nous propose une analyse détaillée de cette refonte : Better Web Forms: Redesigning eBay’s Registration.

C’est au niveau de la mise en page que le plus gros du travail a été réalisé :

EbayRegister.gif

Vous noterez sur ces deux images que les intitulés des champs ont été alignés à droite et que des lignes de séparation horizontales servent à faire des regroupements logiques. Il y a également eu un travail de fait sur le texte d’introduction ainsi que les intitulés de section.

Bien évidement cette nouvelle version est meilleure que la précédente dans la mesure où elle améliore la lisibilité et le guidage mais elle apporte également du confort grâce notamment à l’usage d’Ajax pour faire de la validation en sein de la page.

Je me demande bien quand cette version sera implémentée sur le site français…

8 commentaires sur “Une analyse du nouveau formulaire d’inscription d’eBay

  1. Les séparations horizontales me paraissent un bon choix. Globalement le formulaire parait beaucoup plus aéré comme ceci, puisque même avec les libellés à gauche, la page est un poil plus longue !

    Ceci dit, certaines études prouvent que les libellés au dessus du champ permettent de réduire la durée de lecture du formulaire (en évitant les allers-retours de l’oeil): cf l’étude d’eyetracking relayée par Luke Wroblewski, dont tu avais mis à disposition les recommandations il y a quelques mois.

    On remarquera quand même que le champ « date de naissance » est passé du côté « Tell us about yourself » et non du côté « ID » – ce qui paraît plus logique…

  2. Personnellement, je mettrais le bloc de choix des identifiants (avec le champ mail) en première position pour pouvoir avertir immédiatement l’internaute si on pense qu’il possède déjà un compte…
    (*) via une requête en Ajax, naturellement.

  3. « Les intitulés de champ ont été aligné à droite. »

    Ca m’a tout de suite rappelé ça: https://fredcavazza.wordpress.com/doc/tutoriels/formulaire/SVF_apres.htm

    Je trouve les formulaires en général plus difficile à coder que la majorité des éléments HTML. Le résultat est souvent différent pour chacun des 5 navigateurs principaux! En tout cas, l’utilisation d’Ajax est un véritable confort pour les formulaires, surtout lorsqu’ils sont longs comme ça. On est pas à une erreur près, et recharger la page (en voyant parfois certaines infos disparaître) parce qu’on a mal rempli un élément, c’est rageant.

  4. Parfait la séparation entre les bloc, nous avons ainsi un regroupement par idée logique. La lisibilité a été très nettement améliorée, principalement par l’alignement des champs et des titres de champs.
    Très bon travail en effet.

    Avons nous avec ce formulaire une validation automatique des champs ? A la manière dont j’ai réalisé le formulaire sur mon site perso :
    http://fmottet.com/contact.php

  5. Juste une precision, a part pour la verification du UserId, il n’y a pas d’ajax dans cette page; c’est du simple javascript (donc sans aller retour serveur)… et heureusement parce que l’ajax c’est cool, mais pas pour un formulaire d’inscription ;), qui ne necessite aucune verification dynamique cote serveur.

  6. @Olivier D. ze kat:
    je pense que ce placement est stratégique. Un utilisateur ne rechigneras pas à saisir sa véritable adresse mail aprés avoir rempli les informations « faciles » tels que nom, adresse, etc…

  7. Dans son analyse, Garrett Dimon indique que les libellés sont alignés à droite car les utilisateurs viennent rarement sur ce formulaire (uniquement pour s’inscire) et qu’il favorisait donc la lisibilité à un gain « marginal » de durée de saisie. Il ne remet donc pas en cause le fait qu’un alignement vertical est plus rapide comme précisé dans l’étude d’eyetracking relayée par Luke Wroblewski (qu’il cite je crois par ailleur dans son analyse).

    Bref, c’est intéressant de voir que les « experts » convergent. Mais si quelqu’un a un autre avis sur la question, ça m’intéresse…

Répondre

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion /  Changer )

Photo Google

Vous commentez à l'aide de votre compte Google. Déconnexion /  Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion /  Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion /  Changer )

Connexion à %s