Ajax et évaluations qualité

Par Élie Sloïm, le 5 janvier 2006, dans .

Vous êtes très nombreux a avoir lancé des démarches qualité ces derniers jours sur la version multi-utilisateurs de mon-opquast.

Pour l’instant, nous avons eu peu de retours, ce qui semble parfaitement normal à peine quelques jours après le lancement, et finalement, pour une version beta, ce n’est pas forcément mauvais signe.

Deux de nos utilisateurs proches (Laurent Denis et Tristan Nitot, que j’essaye généralement d’écouter attentivement 😉 nous ont cependant fait quelques remarques sur l’utilisabilité des feuilles d’évaluation. La couche d’interaction AJAX qui a été mise en place pour accélérer les évaluations est certes utile, mais il me semble possible de faire beaucoup mieux. Je souhaite donc vous faire part de mes réflexions, et pour ceux qui le voudront bien, je vous remecie par avance des commentaires que vous ferez sur ce message.

Ma réflexion est la suivante : lorsque vous êtes en train d’évaluer vos sites, de quoi avez-vous vraiment besoin pour les effectuer de façon confortable et rapide ?

Vous devez pouvoir :

  • Modifier le statut (conforme, non conforme, etc.) associé à une bonne pratique en un clic si possible
  • Ajouter directement un commentaire sans avoir à cliquer plusieurs fois pour faire apparaitre la boîte de saisie

Mais dans le même temps, vous devez accéder aux informations suivantes :

  • Libellé de la bonne pratique
  • Moyens de contrôle de cette bonne pratique

Et bien sûr, dans le même temps, vous devez pouvoir :

  • consulter et naviguer sur le site que vous évaluez sans trop de manipulations.

En ce qui concerne le premier point, c’est à dire la modification du statut et du commentaire, nous pourrions faire apparaître une boîte de saisie contenant le statut et la boite de saisie du commentaire. En ce qui concerne le statut, l’utilisation de cases radio serait sans doute plus économe en nombre de clics que la liste déroulante actuellement utilisée.

En ce qui concerne le libellé et les moyens de contrôle, j’aimerais avoir votre avis. Doivent il apparaître dans la boite d’évaluation que je décris ici? Si oui, doivent ils apparaître au dessus ou au dessous du choix du statut et de la boite de saisie du commentaire ?

Pour finir, le site évalué doit-il pouvoir être affiché dans une nouvelle fenêtre, doit on provoquer cette ouverture (je ne suis pas pour) ou proposer systématiquement le lien permettant de l’ouvrir.

Voilà l’état de mes réfléxions sur ce sujet, essentiel car il est au coeur de notre application. Si vous trouvez quelques minutes pour me donner votre avis, je vous en remercie par avance.

Elie Sloïm

Directeur du projet.

4 commentaire(s)

  1. Deux sites innovants et conformes aux standards: Fuzz et Mon Opquast

    Deux jolies nouveautés ces jours-ci sur le Web francophone : Mon Opquast et Fuzz.fr.

  2. Bravo, l’utilisation d’AJAX apporte un confort d’utilisation non-négligeable (car il était très fastidueu de faire des aller-retour pour chaques critères).

    Par conte, je constate des très légers défauts de comportement :
    – le petit picto en forme de crayon pour éditer le status du critère ne s’affiche pas sous IE et s’affiche en sur-impression sur Firefox (pourquoi ne pas prévoir une marge à droite plus importante pour qu’il s’affiche sans faire de conflit visuel) ;
    – losque l’on clique sur "Editer", la page est recentrée de façon trop brutale sur Firefox, c’est un peu perturbant de cliquer à un endroit et d’éditer à un autre (pourtant sur IE il n’y a pas ce "recentrage") ;
    – il faut "quiter" le champ pour que la modification soit enregistrée, très perturbant lorsque l’on ne sait pas où cliquer ou quand on veut enchaîner l’édition des status (pourquoi ne pas utiliser un appel javascript onChange plutôt que onBlur ?) ;
    – idéalement, lorsqu’un critère vient d’être modifié, il faudrait un petit retour visuel pour confirmer l’action (pourquoi ne pas utiliser la fameuse Yellow Fade Technique de 37Signals ?).

    Voilà pour mes quelques remarques. Il semble que le bon compromis soit un comportement à mi-chemin entre celui d’IE et de Firefox. Mais comme je suis loin d’être un expert en javascript, je ne peut pas me permettre de donner des leçons !

    Bon courage,

    /Fred

  3. 1 – statut et du commentaire :
    – statut et commentaire dans la même boîte : Oui
    – case à cocher au lieu de select : A voir en vrai mais à priori Oui encore une fois…

    2 – libellé et les moyens de contrôle :
    – s’il s’agit d’implémenter une véritable boite similaire à celles générées pour les icônes d’aides pourquoi pas… Dans ce cas les infos sur les moyens de contrôle me semblent devoir être placés en dessous.

    3 – Lien pour ouvrir le site évalué :
    – Proposer le lien pour l’ouvrir me semble pas mal.

    D’autre part voici quelques remarques d’ordre plus technique :

    1- Script DOM/MSIE : Les différents tests du type if (MSIE) else (DOM) devraient être inversés pour donner if(DOM) else (MSIE)… Pourquoi ? Pour que les clients qui implémentent le DOM et un peu des fonctions à la MSIE (genre Opera) puissent avoir le meilleur :-). Pour exemple sous Opera 9p1 les icônes d’aide n’affichent pas la petite boîte mais ouvre le lien classique (sous Opera 8.5 c’est la boite qui s’affiche).

    2- Avec Opera 9p1 j’ai eu droit à quelques plantages sur des affichages successifs du formulaire d’édition. Peut être du à la première remarque sur les tests MSIE/DOM.

    3- Ouverture et fermeture des boites de type "aide" : Pour le moment les boites ne peuvent se fermer que sur le clique du bouton "fermer". Pour améliorer un peu l’accessibilité et l’ergonomie je propose de fermer ces boites au moins sur le "blur" des liens qui les ont ouvertes. (Je navigue beaucoup au clavier grâce à la navigation au curseur de Gecko [F7] ;-)). Ou encore mieux… sur la pression de la touche "echap".

    Une remarque sur l’ergonomie et l’accessibilité :
    Pour les navigateurs dignes de ce nom une icône d’édition apparaît sur le hover des cellules… Pour ma part, je suis tenté de cliquer dessus pour faire apparaître le champ à éditer alors qu’il ne s’agit que d’un style. Je trouverais pas mal d’insérer une véritable image et un véritable lien (via le DOM) pour limiter l’effet "cliquez-moi dessus". D’autre par l’insertion de ces éléments permettrait de rendre ce point un peu plus accessible par une navigation au clavier. En effet l’implémentions des effets sur les TD rend le tout difficilement accessible lorsque Javascript est activé.

    Sur ces points de scripting et si vous en avez besoins je peux vous donner un coup de main si nécessaire.

  4. En réponse à Harmen sur l’accessibilité : je viens de faire une étude sur Ajax, et l’accessibilité motrice dont tu parles (clavier plutôt que souris) risquerait de poser des soucis pour l’accessibilité aux aveugles.

    Les notifications de changement de contenu après chargement de la page laissent à désirer (autrement dit, les blocs en Ajax risquent de rendre l’expérience très confuse pour un aveugle sans formation préalable).

    L’idée de permettre de tabuler sur un lien sans interaction JS avancée est à mon avis plus sûre pour les aveugles.

    Ceci dit, je suis plus souvent au clavier qu’à la souris, donc il faudrait effectivement réfléchir à une voie moyenne, et tu as raison de soulever la question. Mais la réponse est loin d’être évidente.

Les commentaires sont fermés.