Le blogue d'Idéactif

9 février 2010

Comment optimiser un site web et plaire à 700 000 personnes en même temps?

Nathalie Berger @ 15:38

Le site Branchez-vous vient de mettre en ligne une version optimisée de sa page d’accueil. Celui-ci n’avait pas été rafraîchi depuis belle lurette. Je profite de l’occasion pour parler brièvement de mon expérience dans ce projet de refonte auquel j’ai pris part récemment, avec mon collègue Jean-François.

Un petit rappel. Branchez-vous demeure le premier et le plus populaire portail d’information et de technologies indépendant au Québec (il est en ligne depuis septembre 1995). Il est visité chaque mois par plus de 700 000 personnes selon comScore. Le capital de sympathie pour ce site est élevé chez les pionniers du Web québécois comme moi qui l’ont vu grandir. C’est vrai qu’il est parfois critiqué, mais il demeure quand même un des sites les plus visités au Québec, ce qui rendait le défi particulièrement intéressant pour nous.

La problématique la plus délicate : faire évoluer, sans trop bousculer.

  • Peu de médias en ligne au Québec, ou même de sites Web en général, peuvent se targuer d’exister depuis 15 ans. Il y avait donc à la base de ce redesign un souci de continuité pour ne pas dérouter les fidèles de la première heure (et ils sont nombreux!). Une grande partie des «habitués» ont dit apprécier la page et ne voulaient pas nécessairement la voir changer radicalement. Comment faire évoluer la page (design, présentation, structure) sans trop bousculer les habitudes? «If it ain’t broken, don’t fix it» diront certains. Comment distiller l’essentiel? Comment discerner ce qui est «intouchable» de ce qui peut être modifié?
  • Un site web comme celui de Branchez-vous est une entité organique qui vit dans un écosystème, qui a son histoire, son vécu, ses habitués, ses nouveaux utilisateurs/participants et aussi ses annonceurs. Comment faire pour améliorer le goût sans trop changer la recette? Et comment convaincre l’éditeur et le fondateur du site (Patrick Pierra, que tout le monde connaît et admire) qu’on ne fera pas trop mal à son «bébé»?
  • Comment faire découvrir la diversité des contenus du portail à de nouveaux utilisateurs ou des occasionnels, et les «convertir»?

L’accueil du portail Branchez-vous avant la refonte (février 2009)

Notre intervention en bref
Nous avons dans un premier temps analysé les données Google Analytics les plus pertinentes afin de comprendre le comportement des utilisateurs sur les pages clés.  Nous avons ensuite évalué les principaux facteurs qui touchent l’expérience utilisateur de ces pages et identifié ce qui pourrait être amélioré. Nous avons défini chacune des composantes de la page d’accueil en spécifiant leur cote de priorité, pour aider l’équipe à créer un consensus sur les composantes à retenir et à prioriser, avant de débuter la conception formelle (taille, emplacement, design visuel, etc.). Après discussion autour des pistes de solution avec les membres clés de l’équipe, nous avons « briefé » le designer graphique pour qu’il s’aligne en continuité avec les orientations de redesign préconisées. Ensuite, nous avons validé et commenté quelques versions de maquettes.

Nos recommandations convergeaient sommairement vers 6 axes principaux :

  • Améliorer la performance du téléchargement (voir à ce sujet un billet de mon collègue sur l’importance pour l’expérience utilisateur de la vitesse de téléchargement)
  • Réduire la surcharge cognitive, l’impression de densité informationnelle élevée (passer du concept «Présenter le maximum d’infos et de photos» à une approche «Présenter l’essentiel des actualités et orienter sur l’offre principale)
  • Rendre la structure plus facile à décoder rapidement (scannabilité / balayage de la structure)
  • Corriger le manque d’uniformité, d’homogénétié, de constance (titres de section à double vocation, photos, tailles de la typo)
  • Mieux différencier/distinguer les contenus. Beaucoup de contenants à gérer pour l’utilisateur
  • Mettre davantage en valeur les éléments que les utilisateurs influencent (pour accroître leur perception d’influencer le contenu et les inciter à participer)

L’accueil du portail Branchez-vous après la refonte (février 2010)

Accueil Branchez-vous après la refonte 2010

Qu’aurait-on pu faire de plus ou mieux?

Un site qui rejoint un si grand nombre de personnes aurait gagné à être mis à l’épreuve avant la mise en ligne, à mon avis. J’aurais bien aimé évaluer un prototype auprès d’utilisateurs durant le processus (tests de l’expérience utilisateur) ou faire un test A/B, aucun expert n’ayant la vérité infuse, surtout lorsqu’il s’agit de satisfaire autant de personnes différentes en même temps. Cela met en lumière la difficulté qu’on a au Québec d’inclure systématiquement la mesure (qualitative et quantitative) dans l’évolution et l’optimisation des sites Web. Nous avons encore du travail pour convaincre les responsables de sites de mesurer en continu leurs actions le plus objectivement possible et à l’aide d’une méthodologie rigoureuse. C’est aux professionnels du domaine à se questionner sur cet état de fait et à innover dans notre façon de démontrer les bénéfices de mesurer efficacement et les risques de ne pas le faire.

Ceci dit, il s’agit tout de même d’une opération notable de rajeunissement et de simplification, qui contribuera certainement à rendre le site plus facile et agréable à utiliser, tout en rehaussant l’image de ce pionnier des médias en ligne. Bravo à toute l’équipe. Un autre 15 ans à BV? ;-)

Pour plus d’informations sur la conception de cette nouvelle page d’accueil, consultez le blogue de l’éditeur sur le site de Branchez-vous.

  • Share/Bookmark
Classé dans : Projets Idéactif — Nathalie Berger @ 15:38

25 janvier 2010

L’expérience utilisateur et les mots de passe

Jean-François Petit @ 17:58

Dans la catégorie « recherche sociale accidentelle », on a rarement fait mieux. Suite à un vol d’identité chez un fournisseur de service de Facebook et MySpace, 32 millions de mots de passe se sont brièvement retrouvés en ligne, accessibles à tous. Des chercheurs en sécurité informatique ont eu le réflexe de copier ces mots de passe afin d’en retirer de précieux indices sur le comportement des internautes face à cet élément clé de notre identité en ligne. Le tout est documenté dans cet article du New-York Times, If Your Password Is 123456, Just Make It HackMe. On peut aussi lire le rapport de la firme de sécurité qui en a fait l’analyse.

Mon dada, c’est la qualité de l’expérience utilisateur. Tout ce qui touche le comportement des humains en ligne me fascine. L’aspect « sécurité informatique » est important, mais ce n’est pas ce que je trouve le plus intéressant dans cette histoire. C’est plutôt le fait que ce crime, une fois dévoilé, se transforme ni plus ni moins en un énorme test utilisateur pour une seule micro-tâche. C’est comme si on avait pu demander à un échantillon énorme d’utilisateurs (32 millions de participants, représentatifs en plus!) de choisir un mot de passe et d’avoir pu ensuite analyser les résultats. C’est le rêve!

Mais quelles leçons UX peut-on retenir de tout ça? Étonnamment, la meilleure leçon ne provient pas des résultats, un peu prévisibles : que 20% des utilisateurs se partagent les même 5000 mots de passe, que 123456 est le mot de passe le plus populaire, etc.

La meilleure leçon provient, d’après moi, de la lecture des recommandations de la firme de sécurité, qui illustrent à merveille le fossé souvent encore très grand qui existe entre ingénieurs, analystes, programmeurs et les utilisateurs des système qu’ils conçoivent. On y suggère encore les classiques: avoir un mot de passe différent pour chacun des sites que vous visitez (!); créer des mots de passe d’au moins 8 caractères;  inclure des symboles du genre #, &, !; ne pas inclure des mots courants, etc.

Toutes des recommandations absolument sensées et que j’essaie de suivre moi-même. De l’aveu même de la firme de sécurité (le comportement était exactement le même dans  d’autres cas semblables en 1990 et en 2000), même après 30 ans de conseils du genre, la preuve est faite que ces recommandations ne sont jamais suivies. Pourquoi?  Tout simplement parce qu’elles sont quasi-impossibles à respecter d’un point de vue cognitif. C’est comme dire à un joueur compulsif qu’il ne devrait pas jouer. Il le sait, nous le savons, mais il le fait quand même.

Alors, quelle serait la solution qui tiendrait mieux compte des limites cognitives des pauvres mortels que nous sommes? Tout d’abord, comprendre les risques réels quand vient le temps de créer un mot de passe et comprendre qui en serait la vraie victime.

Les banques semblent avoir réglé le problème en combinant un mot de passe et un élément visuel ou cognitif que seul vous pouvez associer (une phrase et une image par exemple). Même si le mot de passe est faible, la combinaison mot de passe-phrase-image rend exponentiel le nombre de permutations. On se sent protégés et la banque aussi.

Tous les sites auxquels on s’inscrit ne gèrent pas notre avenir financier. Quelle serait la conséquence de voir mon compte Facebook ou Twitter « hacké » par un malfrat? Franchement, pas très grande d’un point de vue individuel, mais du point de vue de Facebook ou Twitter, c’est une catastrophe de relations publiques (allo, Mirador?). C’est à ce niveau que les firmes de sécurité font de bonnes affaires.

Dernièrement, j’ai conseillé un organisme bien connu qui veut ajouter une panoplie de fonctions Web 2.0 sur leur site qui requiert la création de comptes utilisateurs. Dans le concept initial, l’utilisateur ne choisissait pas son mot de passe; il lui était attribué par le système et envoyé par courriel. D’un point de vue d’un analyste en sécurité informatique, c’est le rêve. Un mot de passe tout point conforme aux normes les plus sévères. Mais du point de vue du spécialiste en expérience utilisateur que je suis, c’est un cauchemar, sans parler du point de vue de l’analyste d’affaires ou marketing. Pourquoi? Le mot de passe si gentiment fourni devient littéralement une clôture de 6 pieds qui entoure votre site Web. Très sécuritaire, mais pas très amicale pour vos clients. Il est vrai que le concept prévoyait qu’on pouvait modifier son mot de passe par la suite. Mais pourquoi faire passer vos utilisateur par Toronto pour aller à Québec en partant de Montréal?

Mon avis? Laissez les utilisateurs choisir leur mot de passe. Si vous devez absolument les générer via le système, soyez gentils et rendez-les un peu faciles à mémoriser (du type non-sens mais prononçable comme paddlipatum88!). Il n’est pas interdit de suggérer des mots de passe de ce genre à même l’interface. Surtout, évaluez bien qui court le plus grand risque de sécurité et quel serait le coût réel de ne pas voir revenir vos utilisateurs les plus précieux : ceux qui ont fait un effort de s’inscrire à votre site Web.

  • Share/Bookmark
Classé dans : Veille UX — Mots-clefs :, , , — Jean-François Petit @ 17:58

19 janvier 2010

Produire des wireframes : des outils à profusion

Jean-François Petit @ 16:59

Quelques fois par année, j’ai l’habitude de prendre quelques heures, voire quelques jours, pour me remettre à jour sur certains aspects de mon valeureux métier d’architecte de l’information (ou designer d’interaction, ou spécialiste de l’expérience utilisateur, ou web designer, ou même ergonome, c’est à votre goût). C’est ce que je viens de faire pour les outils de créations de wireframes et j’ai la tête qui tourne…

J’ai probablement créé mon premier wireframe vers février 1996, quand j’ai eu le mandat de concevoir le tout premier site du Cirque du Soleil (pitch gagné avec la firme eMarketing de Pierre Côté, pour un fabuleux budget total de 18 000 beaux dollars, tout inclus!). Durant de nombreuses années, les wireframes se faisaient à la mitaine, avec n’importe quel outil de dessin, voire même sur papier, ce que certains préfèrent encore. Plus tard, Visio sur PC et Omnigraffle pour Mac sont devenus les outils de choix, car plusieurs kits de modélisation (templates) étaient disponibles pour ces logiciels.

Il y a quelques années, des outils dédiés à la création de wireframe sont apparus, tels que Axure (pour quelques centaines de $$$) et iRise (pour quelques milliers de $$$). Maintenant, en date de janvier 2010, il existe des dizaines de logiciels dédiés, qui peuvent rouler en local sur votre ordi, en ligne dans le « cloud » ou en format hybride local et « cloud ». Certains permettent de créer des prototypes complets avec tous les widgets AJAX, d’autres permettent seulement des esquisses rapides pour l’idéation préliminaire. Certains même peuvent vous aider à préparer un prototype complet pour tests à distance (remote usability testing.) Le choix est en train de devenir intéressant.

Lequel choisir? Je vais vous décevoir, car je n’en ai aucune idée pour le moment. Pourquoi? Parce qu’il faut investir beaucoup de temps pour essayer ces différents outils et comprendre leurs avantages spécifiques et leurs limites dans le cadre de sa pratique personnelle. J’utilise encore le bon vieux Visio, mais mon travail nécessite de plus en plus de documenter de l’interaction et de moins en moins de la mise en écran (screen layout). Je vais devoir trouver un outil qui répond à mes besoins, mais je n’en adopterai pas un avant d’être certain que mes livrables seront encore meilleurs pour mes clients. Pas de gizmos wizbang pour moi. Je cherche du solide, du mature et je n’ai pas encore trouvé. Mais je suis sûr que ça viendra très bientôt.

D’ici là, voici quelques-unes des question que je me pose et que vous devriez vous poser avant de choisir un ou plusieurs de ces outils, mis à part le choix de plate-forme, PC, Mac ou autre.

1) Avez-vous le temps et la motivation pour apprivoiser le fonctionnement d’un nouveau logiciel?

Chacun des ces logiciels fonctionne différemment, possède souvent une panoplie de fonctions et requiert un certain temps d’apprentissage pour être efficace. Si vous débutez un projet avec des délais serrés, remettez à plus tard l’essai d’un nouvel outil (quoique certains vous diront que la pression de produire fait des miracles pour tester un logiciel à fond!).

2) Êtes-vous prêt à prendre le risque d’investir temps et (quelque fois) argent dans un outil qui n’a peut-être pas encore fait ses preuves?

Je remarque que beaucoup de ces logiciels proviennent de compagnies en startup. Il y a actuellement une intense compétition pour s’approprier ce petit marché niche et il est probable que plusieurs ne survivront pas. Ne mettez pas tous vos oeufs dans le même panier. Faites beaucoup de recherches sur les blogs, forums, Twitter, spécialisés en UX/AI/Webdesign, etc. pour aller chercher le sentiment général et le mérite de chacun des outils avant de choisir celui qui vous accompagnera. Mis à part iRise et autres outils de prototypage orientés Big Business, la plupart de ces logiciels sont abordables. Un outil mature comme Axure commande un prix plus élevé, mais la stabilité relative de l’entreprise vient avec.

3) Quel genre de design faites-vous le plus souvent?

Si votre pratique n’exige pas un haut degré de précision quant à la documentation, ou si vous créez des sites Web de quelques pages sans beaucoup d’interaction, un simple logiciel de dessin ou du papier et crayon peuvent suffire. Si toutefois vous devez concevoir des sites Web avec de nombreuses composantes interactives, des widgets Ajax, des séquences d’authentification, du Web 2.0 à profusion, regardez plutôt du côté des logiciels plus robustes qui offrent des fonctions de simulation conditionnelle (comme Axure).

4) Quelles sont les exigences de communication avec vos collègues, clients et partenaires?

Point d’une extrême importance qui est souvent négligé. Le rôle central d’un concepteur (peu importe son domaine) est de communiquer ses idées et de convaincre des gens qui n’ont pas toujours votre appétit pour les détails infinis qui troublent votre sommeil. Si votre logiciel ne vous permet pas de faire des bons vieux PDF imprimables, oubliez ça… Il faut que votre outil vous permette de transmettre vos idées à l’aide du plus bas dénominateur commun (i.e. imprimante et projecteur) dans tous les contextes (votre bureau, celui du client, la brousse, etc.).

5) Jusqu’à quel point voulez-vous simuler une application Web réelle, avec tout le « look and feel »?

Votre but est-il d’esquisser rapidement des idées durant un remue-méninge ou de créer un prototype hyper-réaliste avec des images, des vidéos et du CSS/XHTML de qualité déjà en place? Certains des outils les plus simples et les moins chers (comme balsamiq) font partie de la première catégorie et peuvent vous rendre vachement efficaces en un rien de temps. Il n’est pas interdit de combiner l’usage de deux logiciels selon vos besoins.

6) Est-ce que les tests d’utilisabilité (user testing) font partie votre processus de travail?

Vous savez sûrement que tester un prototype avec du « vrai monde » avant de coder fait toujours partie d’un bon petit déjeuner équilibré. Bien sûr, on fait tous ça ;-) La création de prototypes réalistes qui simulent des fonctions interactives clés devient alors une exigence incontournable. La règle d’or pour les test auprès d’utilisateurs: ne jamais leur demander de faire semblant d’utiliser un site Web; ils ne doivent pas se poser cette question. Ce qui met la barre très haute quant à la création d’un prototype testable, et aussi pour le logiciel qui prétendra créer ce genre de prototype facilement.

7) De quel budget disposez-vous pour l’achat et le maintien d’un logiciel de ce genre?

Certains outils sont gratuits pour un usage limité, d’autres coûtent la peau des fesses. Généralement, you get what you pay for, mais assurez-vous de payer seulement pour ce que vous avez besoin.

8) Travaillez-vous seul ou en équipe sur les mêmes documents?

Je travaille la plupart du temps seul sur mes documents, et c’est probablement le cas de la plupart de nous en tant que pigistes ou en petite agence. Par contre, en grande entreprise, ça peut être différent. Si plusieurs personnes peuvent travailler sur un même document simultanément, oubliez les solutions simples et peu coûteuses. Par contre ne confondez pas accès simultané (plus complexe) et travail collaboratif (annotations, révisions, etc.) Certains outils permettent ce genre de travail asynchrone.

Si ça vous tente, allez faire un tour sur mes signets delicious où j’ai commencé à répertorier certains de ces outils et des ressources connexes : delicious.com/jfpetit/wireframes.

  • Share/Bookmark
Classé dans : Outils et méthodes UX — Jean-François Petit @ 16:59

14 décembre 2009

Utilisabilité et développement durable : une évidence?

Nathalie Berger @ 13:57

Il est possible de visualiser et télécharger les présentations et vidéos des conférenciers de la Journée mondiale de l’utilisabilité, qui s’est tenue à Montréal et Québec en simultanée.

Des sujets variés — incluant les «design patterns», l’ergonomie, le marketing, l’ingénierie, l’adaptabilité des sites internationaux en contextes locaux — célèbrent l’apport de l’utilisabilité et de l’expérience utilisateur dans le développement de produits faciles à apprendre et à utiliser, efficients et efficaces.

Au programme également, une recherche exploratoire réalisée en partenariat par le HEC Montréal, l’Université de Montréal et Bell Canada. Celle-ci combine l’oculométrie aux mesures psychologiques et émotionnelles, afin d’évaluer la qualité d’un site Web. Comme dirait Sandrine, «toute une triangulation méthodologique (ou casse-tête de données selon certains…;-))». Bien sûr, l’oculométrie (ou la poursuite oculaire) a une application plutôt restreinte en réalité. En effet, avec les budgets restreints de la plupart des sites au Québec, on a en général bien d’autres facteurs à évaluer avant celui-là, qui auront plus d’impact sur le produit final. Mais c’est intéressant d’avoir l’occasion de se voir relater un cas de recherche appliquée, avec un protocole d’expérimentation formel, qui inclut cette dimension supplémentaire.

Cette belle soirée sur l’utilisabilité a permis à près de 90 membres de la communauté – spécialistes ou non – d’apprendre et d’échanger sur les bonnes pratiques du métier, dans un optique de développement durable.

  • Share/Bookmark

9 novembre 2009

Journée mondiale de l’utilisabilité le 12 novembre : développement durable

Nathalie Berger @ 16:30

logo_WUD_JMU

Utilisabilité et développement durable. Telle sera la thématique de la 5e Journée mondiale de l’utilisabilité (World Usability Day) qui se tiendra ce jeudi 12 novembre. Utilisabilité Québec se joint une fois de plus aux initiatives locales organisées un peu partout dans le monde, à la suite de l’association «mère» américaine, la Usability Professionals’ Association (UPA).

À Montréal et Québec, nous nous intéresserons tout particulièrement au thème suivant : Utilisabilité et développement durable : une évidence? À travers une série de conférences sur divers sujets — allant des «design patterns»,  aux mesures psychologiques et émotionnelles, en passant par l’adaptabilité des sites internationaux en contextes locaux — nous célébrerons l’apport de l’utilisabilité et de l’expérience utilisateur dans le développement de produits faciles à apprendre et à utiliser, efficients et efficaces. Et ce, partout dans le monde.

Pour ma part, l’angle qui m’interpelle particulièrement en lien avec cette thématique générale est le suivant : À l’ère du «budget-temps limité», comment développer des sites Web viables? J’en parlerai davantage dans un prochain blogue et j’introduirai d’ailleurs succintement la soirée de la JMU avec cet optique. Au plaisir de vous rencontrer jeudi soir! Ça débute à 18h au CRIM de Montréal et au Cégep de Ste-Foy pour Québec (diffusion simultanée entre les 2 villes). Également, un clin d’oeil sera fait à une de nos associations cousines, la FLUPA (section France-Luxembourg d’UPA), sous forme d’entrevues pré-enregistrées (décalage horaire obligeant). Une pause réseautage est prévue accompagnée d’un cocktail. Tous les détails sur le site d’Utilisabilité Québec.

logo-utilisabilite-quebec_2008

  • Share/Bookmark

8 octobre 2009

Le New York Times sur le Web, un exemple pour nos médias?

Jean-François Petit @ 11:25

Ça fait des années que je lis le New York Times sur le Web, et de mois en mois, je suis toujours agréablement surpris de constater la qualité globale de ce site. Évidemment, le contenu est hors-pair, mais ce qui m’impressionne de manière constante, c’est la qualité extraordinaire de leur design de l’interaction. Prenez par exemple cet article qui relate la généalogie de la Première Dame (First Lady) des États-Unis, Michelle Obama.

article génalogie Michelle Obama

Non seulement l’article lui-même est toujours impeccablement présenté (10 sur 10 pour la structure, la lisibilité, le découpage, l’usage de la photographie, etc), mais il est accompagné de documents qui ajoutent immensément à la qualité de l’expérience et surtout à notre compréhension du sujet. Ils ont compris qu’un site Web d’un média d’information n’est pas simplement un fourre-tout qui sert à recycler du contenu destiné à l’imprimé ou à la télévision. Ils y dédient des ressources (probalement démesurées par rapport à celles de nos médias, j’en suis bien conscient) afin de traiter le Web comme un média non seulement à part entière, mais aussi comme un média prioritaire.
nytimes_michelle_obama

C’est une nuance importante. Et c’est peut-être ce pas qui reste à franchir par les entreprises médiatiques du Québec et du Canada. J’ai la forte impression (et même la certitude pour certains cas) que le Web est encore vu comme un parent pauvre, un endroit où le contenu se retrouve une fois qu’il a été diffusé à l’antenne ou imprimé sur des arbres morts. On confie la création de ces sites à des personnes très bien intentionnées, mais qui, à mon humble avis, n’ont pas nécessairement tout le bagage nécessaire pour faire de ce médium un réel avancement par rapport à ceux qu’il est en train de remplacer. Il est temps que les « anciens » travaillent de concert avec les « nouveaux » plutôt technophiles qui se retrouvent du jour au lendemain responsables de choix stratégiques qui n’ont rien à voir avec la technologie. Il faut arrêter de tripper techno. Il faut tripper contenu.

Et le bon contenu prend du temps et coûte cher. J’entend déjà crier les blogueurs! Mais pourtant, on peut se dire blogueur et créer du contenu de très haute qualité. Je pense à Nelson Dumais, de Cyberpresse. Il a une plume impeccable est semble produire dix fois plus que ses collègues. Je suis certain qu’il met un temps fou à créer son contenu. Et en plus, il suscite des conversations qui mettent à profit les connaissances de tout son lectorat. C’est un peu ça l’avenir des médias. On sait qu’en bout de ligne, ça va rapporter. Mais ça prend du capital « patient » et surtout des liaisons beaucoup plus fortes entre le passé et l’avenir.

Pourquoi tout « scrapper » et recommencer à zéro? Le New York Times sur le Web constitue, en ce sens, un exemple à suivre, malgré leurs difficultés financières. À moins que je ne me trompe, une bonne part des spécialistes dans le domaine sont d’avis qu’ils vont survivre et prospérer, et je crois que c’est en bonne partie parce qu’ils ont su faire la transition sans tout vouloir détruire. Quand on entend dire que La Presse veut abolir sa version imprimée, que Québécor veut recycler son contenu à l’infini (pourquoi pas un nouveau slogan : le pouvoir infini du recyclage?), et que Canwest est sous la protection des tribunaux, il me semble qu’il y a urgence en la demeure.

  • Share/Bookmark
Classé dans : Opinion — Jean-François Petit @ 11:25

30 septembre 2009

La vitesse de chargement d’une page Web: même les plus petits sites Web sont affectés

Jean-François Petit @ 10:25

En juin, j’avais relaté une expérience très intéressante réalisée conjointement par Google et Microsoft (Bing) sur l’influence de la vitesse de chargement d’une page Web. On apprenait, chiffres à l’appui, que le simple fait de retarder le chargement d’une page de résultats de recherche de deux seconde faisait baisser la satisfaction (-4%) et les revenus (-4%). Deux chercheurs se sont posés la même question, mais pour des sites beaucoup plus modestes que ceux de Google et Bing. Les résultats semblent tout aussi probants:

La méthode utilisée est intéressante et est décrite brièvement dans cet article de O’Reilly Radar. Elle est loin d’être parfaite, mais elle a le mérite de mettre en lumière une composante souvent très négligée de l’expérience utilisateur.

  • Share/Bookmark
Classé dans : Veille UX — Jean-François Petit @ 10:25

22 septembre 2009

La rédaction Web : un facteur important de l’expérience utilisateur

Nathalie Berger @ 10:47

Pour ceux qui croient comme nous chez Idéactif que le contenu et la rédaction sont un facteur incontournable de succès d’un site Web, je vous invite à lire cet article intéressant de Boxes and Arrow The Content Conundrum – Bridging the gap between design and content.

«The more we separate our design activities from content development, the greater the risk of design failure» souligne bien l’importance de travailler ensemble et non en silo. Ça rejoint bien l’esprit de mon collègue Jean-François Petit qui est une fois de plus confronté à cette réalité dans l’un de ses projets en cours. Je trouve d’ailleurs qu’il accompagne très bien son client dans la démarche pour faciliter ce rapprochement contenu-design.

«It’s impossible to fully evaluate the effectiveness of a web experience without having the content represented and under the same microscope as the design.» Ça me parle aussi beaucoup car je répète à mes clients l’importance de tester l’utilisabilité et l’expérience utilisateur d’un prototype (ou site en production) avec un contenu le plus proche possible de la réalité. En effet, bien des problèmes d’expérience utilisateur relevés durant les tests sont reliés au texte (libellé, guidage, etc.)

Justement, le prochain 5 à 7 UX organisé par Utilisabilité Québec le jeudi 24 septembre prochain au Belmont portera sur cette  thématique « La rédaction Web : un facteur de l’expérience utilisateur ? ». Ce thème avait eu beaucoup de succès lors des conférences passées, dont celle de François Hubert et de Nick Usborne. Ne manquez pas cette possibilité d’échanger sur le sujet.

  • Share/Bookmark
Classé dans : Veille UX — Nathalie Berger @ 10:47

25 juin 2009

L’influence de la vitesse de chargement d’une page Web sur la qualité de l’expérience utilisateur (et les revenus)

Jean-François Petit @ 10:56

Enfin des données! C’est ce que doivent s’exclamer tous ceux et celles (comme nous chez Idéactif) qui essaient de convaincre leurs clients que le temps de chargement d’une page Web a une réelle influence non seulement sur la qualité de l’expérience utilisateur, mais également sur les revenus potentiels. Dans des études séparées, mais présentées conjointement (vidéo ici, analyse O’Reilly ici),  effectuées par Google et Microsoft (Bing), on apprend, chiffres à l’appui, que le simple fait de retarder le chargement d’une page de résultats de recherche de deux seconde fait baisser la satisfaction (-4%), les revenus (-4%) et d’autres indicateurs de mesure tels que le nombre de clics et le délai avant de cliquer. Cette baisse peut apparaître peu significative, mais pour Bing, les pertes montaient tellement vite qu’ils ont décidé de mettre fin à l’expérience prématurément!

bing-google-page-time-test

Résultats des tests de délais (source: O'Reilly)

Parmi les points à retenir:

  • L’importance d’avoir des pages « rapides » n’est plus seulement un cliché qu’on répète sans savoir pourquoi…
  • Des délais aussi courts qu’une demi-seconde peuvent avoir des impacts sur les indicateurs liés aux revenus
  • Les coûts réels de ces délais augmentent avec le temps et persistent même après un retour à la normale (l’utilisateur apprend vite mais désapprend lentement)
  • Si possible, utiliser un rendu de page progressif et sélectif si le poids total d’une page ne peut être réduit
  • La taille (en kilo-octets) des élément retournés en réponse à une requête est relativement moins importante que l’ordre de priorité avec lequel on les retourne et à quel moment ils sont présentés à l’utilisateur

Que peut-on retenir de cette expérience dans notre pratique avec nos clients qui, avouons-le, ont un peu moins de traffic que Google ou Bing? Pour ma part, j’ai fait quelques analyses de page avec un outil comme Yslow pour certains clients et il est clair que même au Québec, certains sites Web à fort trafic auraient tout avantage à optimiser leur code pour réduire le temps de chargement. Ce qu’on entend souvent de la part des développeurs, c’est que la haute vitesse est disponible presque partout et que la taille des pages n’a plus d’importance.

Pourtant, même en haute vitesse, une page comme celle de l’accueil de Radio-Canada, vue par deux millions de personnes par mois et  qui vient pourtant d’être refaite de fond en comble, peut atteindre un poids supérieur à 1 méga-octet! (Yslow lui donne une note de E, un échec.) Comparez ça avec l’accueil de CBC (407 Ko) et celui de la BBC (430 Ko.) Ça peut télécharger très vite dans des conditions idéales, mais c’est sans compter les délais souvent très longs imposés par les incontournables « adservers » qui ajoutent des requêtes externes au site en question. Ces délais, bien connus par ceux qui gèrent des sites populaires, ne semblent pas alarmer personne. Imaginez si vous étiez empêchés de tourner une page de votre journal ou de votre revue favorite à cause d’une publicité. Impossible me dites-vous, mais c’est pourtant très courant sur le Web…

  • Share/Bookmark
Classé dans : Veille UX — Jean-François Petit @ 10:56

26 mai 2009

Groupes de discussion, tests d’utilisabilité ou tri de cartes?

Jean-François Petit @ 13:16

Même en 2009, il y a encore une méconnaissance importante des bienfaits respectifs des groupes de discussion (communément appelés focus groups), des tests d’utilisabilité et du tri de cartes (également appelé classement de cartes, ou son équivalent en anglais, card sorting) comme méthodes de développement et d’évaluation de sites Web. Il faut d’abord préciser que chacune des ces activités devraient être réalisées à des moments bien précis du développement, et qu’elles ne mesurent pas toutes l’utilisabilité. Il faut également comprendre qu’elles sont indépendantes l’une de l’autre et qu’elles peuvent être utilisées ensemble dans une séquence bien déterminée ou séparément au besoin.

Gare aux interprétations hâtives

Les groupes de discussion utilisent souvent des maquettes ou des prototypes très préliminaires comme objet d’étude. Cette méthode qualitative génère habituellement des opinions, qui peuvent être quelques fois très différentes des actions mesurables. Par exemple, un participant peut exprimer l’opinion qu’il aime la page qu’on lui présente et la trouverait facile à utiliser. Cela peut être vrai ou faux, mais il est impossible de le savoir vraiment, peu importe la taille du groupe. Cette méthode ne peut pas vraiment mesurer l’utilisabilité d’un site ou de toute autre produit interactif.

Les tests d’utilisabilité servent justement à mesurer objectivement la facilité ou la difficulté d’utilisation. Ils doivent être effectués à l’aide de prototypes les plus près de la réalité possible. Il est dangereux de demander à un participant de « faire semblant » d’utiliser un site Web alors que ce qu’on lui présente ressemble à des schémas de pages (wireframes) ou est un prototype à peine fonctionnel. Il est possible d’utiliser des prototypes en papier ou des schémas de page, mais à condition de tester des éléments de contenu précis et non pas une réelle suite d’interaction.

Lors de ces tests, on voit souvent des cas où un participant exprime une opinion positive à propos d’une page ou d’une fonction, mais après avoir essayé de l’utiliser, il devient évident qu’il rencontre des difficultés inattendues. Même après avoir vécu des difficultés importantes, certains participants répondront que leur expérience a été positive et facile quand on leur redemande leur opinion. Comment différencier tous ces résultats et retenir l’essentiel? C’est là qu’un spécialiste entre en jeu. Il peut distinguer entre les opinions, les faits et les inévitables « effets de tests », qui poussent souvent les participants à être un peu trop gentils et optimistes. Ils se sentent observés et veulent souvent bien paraitre, ce qui est parfaitement humain et normal. La prudence est de mise lors de la phase d’interprétation, qui est déterminante pour la suite. C’est pourquoi on recommande d’avoir au moins deux personnes présentes qui observent et prennent des notes lors des tests d’utilisabilité; il est alors plus facile d’en arriver à un consensus sur les résultats.

Les facteurs esthétiques ont leur importance

Les tests permettent donc de mesurer la facilité d’utilisation et de s’assurer qu’une opinion soit validée par des actions mesurables. Par contre, un groupe de discussion est tout indiqué en début de projet pour mesurer des perceptions face à un nouveau produit ou face à une entreprise ou organisme. Par exemple, on pourrait y présenter un site existant et demander l’opinion des participants sur leur perception (est-ce trop simpliste? élitiste? inintéressant?, etc.) dans le but de corriger le tir pour une version améliorée. Les groupes sont également intéressants pour évaluer la part esthétique d’un site, qui est aussi très importante. Un des gourous de l’utilisabilité, Don Norman, a beaucoup écrit sur l’importance de l’esthétique et son influence sur la perception. Les utilisateurs qui trouvent un site beau et bien fait auront tendance à être mieux disposés envers ce site. Ils lui accorderont plus de crédibilité et feront probablement un effort additionnel pour l’utiliser à son plein potentiel. S’ils rencontrent une difficulté dans leur parcours, ils seront plus enclins à persévérer et à mener à bien une tâche, sans l’abandonner en cours de route. Par contre, il est très rare d’avoir une maquette très complète incluant tout le design graphique en début de projet, et c’est souvent à cette étape qu’on fait appel aux groupes de discussion. Selon le budget disponible, il faut choisir la méthode qui nous apportera les meilleures données au bon moment.

Le tri de cartes est une méthode quantitative

Le tri de cartes est une méthodologie qui est bel et bien quantitative si elle est bien exécutée. Elle repose entièrement sur l’interprétation que font les participants des éléments de contenu qu’on leur demande d’organiser en groupes et sous-groupes. Contrairement aux groupes et au tests d’utilisabilité, il ne s’agit pas d’une méthode d’évaluation (il y a des exceptions toutefois), mais plutôt d’un outil de conception qui devrait tomber dans la cour des architectes de l’information, et non pas celle des ergonomes. L’interprétation des résultats de tri de cartes doit aussi être sujette à caution. Si un ou plusieurs des participants ne connaissent pas la signification exacte de certains éléments, ou qu’ils les interprètent d’une façon erronée, ils risquent de placer ces éléments dans une catégorie qui ne fera pas de sens pour personne. Par exemple, lors d’un tri de carte que nous avions faits pour le site des Archives de Radio-Canada, certains élèves de secondaire (un groupe cible prioritaire) avaient classé « Crise d’octobre » sous la catégorie « Science et technologie ». À quoi pensaient-ils en faisant ce choix? Impossible de le savoir, car cette méthodologie ne prévoit généralement pas des entrevues post-test, et il faut donc se fier à la tendance générale et non pas à des cas particuliers. D’où l’importance d’effectuer correctement l’échantillonnage et d’avoir au moins 30 sujets par groupe homogène (par exemple, 30 étudiants du même niveau scolaire) pour obtenir des résultats statistiquement significatifs.

Pour en savoir plus sur le tri de cartes, je vous conseille cet article de Ergolab.

  • Share/Bookmark
Classé dans : Outils et méthodes UX — Jean-François Petit @ 13:16
Articles plus anciens »

Fill RSS Fil RSS de ce blogue

À propos de ce blogue

La conception, l'évaluation et l'optimisation de sites Web constituent le coeur de nos activités quotidiennes. Ce blogue traitera donc principalement de qualité de l'expérience utilisateur, des méthodes d'évaluation, de l'architecture de l'information, du design d'interaction, et d'analytique Web. On y raconte aussi un peu notre vie quotidienne en tant qu'entrepreneurs et consultants Web dans un contexte québécois.