Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

article.md 8.6KB

5 jaren geleden
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. title: Critique du livre Ergonomie Web
  2. slug: critique-du-livre-ergonomie-web
  3. date: 2008-05-28 01:45:44
  4. type: post
  5. vignette: images/logos/livre_ergonomie_web.png
  6. contextual_title1: Design centré sur l'activité ET sur l'attention
  7. contextual_url1: 20081015-design-centre-sur-activite-et-sur-attention
  8. contextual_title2: Critique du livre Designing the obvious
  9. contextual_url2: 20081008-critique-du-livre-designing-obvious
  10. contextual_title3: 12 règles d'ergonomie web par Amélie Boucher
  11. contextual_url3: 20071117-12-regles-d-ergonomie-web-par-amelie-boucher
  12. Après avoir assisté à l'atelier consacré à l'[ergonomie web](https://larlet.fr/david/biologeek/archives/20071117-12-regles-d-ergonomie-web-par-amelie-boucher/) lors de [Paris Web](https://larlet.fr/david/biologeek/archives/20071122-bilan-sur-paris-web-2007/), j'étais vraiment motivé pour lire [ce livre d'Amélie Boucher](http://www.ergonomie-sites-web.com/).
  13. **[edit du 3 juin]** : Yahoo! vient de sortir [une bibliothèque de stencils](http://developer.yahoo.com/ypatterns/wireframes/) tout simplement hallucinante ! Format svg disponible (entre autres), tout simplement génial.
  14. ### Préambule
  15. S'il y a une chose qui me manque depuis mon [déménagement](https://larlet.fr/david/biologeek/archives/20080202-retour-en-provence/) et mon [changement d'activité](https://larlet.fr/david/biologeek/archives/20071105-freelance-django-enfin-independant/), c'est de trouver le temps de lire. Les heures de métro avaient quand même du bon car elles me permettaient à la fois de me couper du travail et de lire. J'ai trouvé la solution pour la coupure (à venir) mais il faut absolument que je retrouve ces moments de lecture. Bon du coup la régularité de mes critiques de livres en pâtit.
  16. ## Le livre Ergonomie web
  17. Je ne vais pas tourner autour du pot, c'est vraiment un bon livre et je n'ai pas été déçu. **C'est un concentré de conseils, de méthodologie, de bonnes pratiques qui devrait être lu par toutes les personnes impliquées dans un projet web**. Il m'a aidé à évoluer à titre aussi bien personnel que professionnel dans un domaine qui m'intéresse de plus en plus. Je pourrais en ajouter des tartines mais je pense que vous avez saisi le concept !
  18. Le seul défaut que j'ai trouvé, c'est d'avoir déjà entendu parlé des [règles d'ergonomie web](https://larlet.fr/david/biologeek/archives/20071117-12-regles-d-ergonomie-web-par-amelie-boucher/) mais l'apprentissage par la répétition est intéressant et il y a d'autres exemples pertinents donc je ne me suis jamais ennuyé.
  19. Ce que j'apprécie particulièrement dans cet ouvrage, c'est l'humilité de l'auteur. Elle n'hésite pas à écrire que **tout le monde peut faire de l'ergonomie** et ça me plaît car j'en suis convaincu aussi, bien sûr l'expérience fait la différence mais chaque regard critique sur un site est intéressant. **L'ergonomie repose avant tout sur le bon sens et l'usage**.
  20. Concernant l'usage, les versions bêta des applications web estampillées 2.0 sont assez révélatrice du phénomène de maturation d'un site. **Le concepteur peut très difficilement anticiper quel sera l'utilisation du service et quels vont être les points sur lesquels se concentrer pour le rendre meilleur**. Après plusieurs mois/années de développement, son avis est faussé et il est très difficile d'avoir suffisamment de recul à ce moment là.
  21. Pour finir, c'est également truffé de petits exemples qui font la différence, infime mais tellement importante, entre une bonne application et une application que l'on utilise. Ai-je besoin de préciser que je suis fan ? :-)
  22. *En bonus, j'ai longtemps cherché un outil me permettant de réaliser des interfaces facilement pour faire des maquettes basiques afin de présenter l'ergonomie d'un site. Je teste [OmniGraffle](http://www.omnigroup.com/applications/omnigraffle/) depuis quelques temps et c'est vraiment ce que je cherchais, surtout associé au [stencil Django](http://graffletopia.com/stencils/362) !*
  23. <p>
  24. <img
  25. src="/static/david/biologeek/images/stencil_omnigraffle_admin_django.jpg"
  26. alt="Exemple d'interface d'administration Django avec OmniGraffle"
  27. style="margin: 0pt auto; display: block;"/>
  28. </p>
  29. ## Mauvaises pratiques web
  30. Ça fait un moment que je voulais parler de certaines mauvaises pratiques et la récente recherche d'une télévision sur des sites de comparatifs et de vente en ligne m'a permis d'établir une liste en moins de 10 minutes !
  31. ### Laissez faire le navigateur
  32. L'avantage d'un navigateur, au même titre qu'un agrégateur de flux d'ailleurs, est d'uniformiser certaines interfaces afin que le visiteur ne soit pas désorienté et se base sur l'acquis. Je recommande donc de :
  33. * **ne pas modifier à outrance les formulaires**, si les boutons ne ressemblent plus à des boutons l'utilisateur est perdu, plus rapidement que vous ne le croyez. Théoriquement le navigateur s'adapte à la plateforme afin d'afficher des boutons cohérents avec le système d'exploitation du visiteur (merci firefox 3), vous arriverez difficilement à faire mieux. De même les scripts pour redimensionner des textarea devraient être laissés au navigateur, Safari le fait très bien.
  34. * **ne pas utiliser des boutons pour modifier la taille du texte ou imprimer**, les navigateurs intègrent ces fonctionnalités et vous êtes en train d'apprendre de mauvaises habitudes à votre utilisateur, et ça c'est mal©.
  35. * **ne pas placer des boutons « Fermer cette fenêtre » sur les popups** (à bannir si possible), avec l'arrivée des onglets ça ne veut plus rien dire et ça peut faire peur à l'utilisateur qui a décidé d'ouvrir les popups comme de nouveaux onglets (ça va vraiment fermer la fenêtre avec tous mes onglets ouverts ?).
  36. ### Ne faites pas fuir le visiteur
  37. La proportion d'internautes qui arrivent jusqu'à votre site est déjà faible, si vous déployez en plus des trésors d'ingéniosité pour le faire partir, votre taux de conversion va dangereusement tendre vers zéro et vous en serez le seul responsable ! Vous allez donc :
  38. * **éviter les sons à l'ouverture d'une page**, surtout si vous vous adressez à un public pouvant potentiellement être intéressé par votre site durant les heures de travail (difficile de justifier certains sons dans un openspace...). D'une manière générale, je ne connais personne qui est agréablement surpris par un son dont il ne connaît pas l'origine et qui est généralement désagréable.
  39. * **proscrire les animations ou publicités trop coûteuses**, les pages qui me rappellent gentiment que je suis doté d'un dual core sont rapidement fermées et je ne risque pas de remettre les pieds sur ce site de si tôt ! Et je ne parle même pas du code js qui leak à n'en plus finir (un bon exemple : l'aide de voyages-sncf a fait ramer le site pendant au moins 6 mois mais bon ce site mériterait un billet à lui tout seul... 19 version pour en arriver là !)
  40. * **supprimer la page d'introduction**, que ce soit une animation flash ou un publicité, ça n'a aucune utilité si ce n'est distraire le visiteur. Et en plus c'est ringard. Vraiment.
  41. ### Gagnez ma confiance
  42. Que ce soit pour concrétiser un achat ou pour fidéliser un lecteur, le contrat ne pourra s'établir que si les deux parties y croient. Voici quelques écueils qui vont immanquablement me faire douter :
  43. * **un manque de cohérence**, je veux bien qu'il faille faire discount mais quand même, avoir ne serait-ce qu'une charte graphique un peu soignée et cohérente sur le site ça ne devrait pas avoir un impact négatif, si ?
  44. * **des informations négligées**, la différence (outre le prix) peut vraiment se faire à ce niveau, c'est ce qui va rendre le site plus attractif grâce à la pertinence de ses conseils/expériences/commentaires/etc.
  45. * **des images de piètre qualité**, c'est un point qui a une importance énorme pour un magasin en ligne, on ne peut pas toucher, sentir, examiner, il va falloir uniquement se baser sur des spécifications assez incompréhensibles. Le seul lien qu'il reste avec l'objet c'est une simple photo de 300*200 pixelisée (à laquelle on accède via une lightbox en carrousel alors qu'il n'y a bien souvent qu'une seule image...), difficile de se décider dans ces conditions.
  46. Ces quelques conseils sont assez subjectifs et je peux me tromper (j'ai jamais fait de tests utilisateur sur des sites de commerce en ligne) mais qu'est-ce que j'aimerais qu'ils soient respectés ! **Des fois j'ai l'impression que le web n'est encore qu'un vaste brouillon**. C'est ce qui le rend si passionnant, soit, mais qu'est-ce que c'est [fatigant](http://xkcd.com/386/).