Ergonomie web pour les nuls

L’ergonomie c’est quoi ?

L’ergonomie c’est le fait d’optimiser un site pour le rendre plus facile et plus agréable à naviguer. C’est également le rendre navigable pour tous et dans de bonnes conditions, puisque l’accessibilité est une donnée intégrante de l’ergonomie.

En d’autres termes, c’est faire en sorte qu’un site soit rapide à prendre en main afin que tout le monde puisse y naviguer confortablement et rapidement.

Ainsi, on distinguera l’utilisabilité qui consiste à rendre un site efficace et efficient au maximum afin d’augmenter la satisfaction des visiteurs, mais aussi l’accessibilité qui consistera à rendre un site navigable pour tous, même pour les non-voyants par exemple.

Les critères de Bastien et Scapin

Bastien et Scapin sont deux chercheurs canadiens, spécialistes de l’ergonomie web qui ont publié une liste de huit critères à respecter pour rendre un site ergonomique. Ils font office de référence aujourd’hui dans le monde entier et sont encore utilisé par de nombreuses agences spécialisées. Voici ces 8 critères :

  • Le Guidage, c’est-à-dire l’ensemble des moyens mis en œuvre pour orienter le visiteur
  • La Charge de travail, ou encore éviter les blocs et les informations inutiles
  • Le Contrôle explicite : quel contrôle ont les visiteurs sur leurs actions au sein du site ?
  • L’Adaptabilité : comment le site s’adapte aux besoins et préférences des utilisateurs
  • La Gestion des erreurs : éviter et/ou corriger les erreurs lorsqu’elles surviennent
  • L’Homogénéité et la Cohérence
  • La Signifiance des codes et dénominations : y a-t-il adéquation entre l’objet et l’information qui lui est liée ? Tout comme un feu rouge signifie STOP, un bouton violet doit avoir une signification similaire sur toutes les pages du site.
  • La Compatibilité : les termes employés sont-ils familiers pour les utilisateurs ?

La navigation d’un site web

La navigation d’un site Internet est un concept clé de l’ergonomie et sera au centre d’une expérience utilisateur agréable et réussie. C’est d’ailleurs le premier critère de la liste de Bastien et Scapin.

Il y a deux éléments à prendre en compte : multiplier les méthodes de navigation au sein du site et adapter la navigation afin de limiter la profondeur du site (3 clics maximum pour atteindre la page la plus profonde du site, dans l’idéal), sans pour autant la surcharger.

Afin de multiplier simplement les méthodes de navigation, vous pouvez par exemple vous orienter vers :

  • Un fil d’Ariane (aussi appelé « Chemin de fer ») qui permet de situer le client peu importe la page où il se trouve
  • Un moteur de recherche interne au site
  • Des liens contextuels, interne au contenu ou pas
  • Un nuage de tags
  • Du cross-selling, c’est-à-dire conseiller des produits similaires dans le cadre d’un site d’e-commerce

Pour adapter au mieux la navigation interne du site avec celle de l’internaute, il faut dans la mesure du possible éviter les méga-menus (les fameux menus de 200 liens, comme sur fnac.com ou amazon.com par exemple), et intégrer dans la navigation générique du site uniquement les liens principaux, ainsi que des liens spécifique à chaque catégorie par exemple.

L’utilisabilité

L’utilisabilité est une partie intégrante de l’ergonomie. Elle consiste à rendre un site plus efficient et plus efficace dans le but d’augmenter la satisfaction des visiteurs.

En d’autres termes, l’utilisabilité regroupe les bonnes pratiques qui permettent de rendre un site plus performant au point de vue expérience utilisateur, et donc théoriquement business.

Pour cela, une des bonnes pratiques de base (une nouvelle fois sur la fameuse liste de Bastien et Scapin) consiste à utiliser des signifiants. Cela signifie qu’on associe une forme et/ou une couleur à un type d’action. Par exemple rouge signifiera toujours qu’une action se trouve derrière un clic (ajouter au panier, inscription à une newsletter, etc.). Pourtant aujourd’hui encore, nombreux sont les sites qui créent des interfaces qui ne possèdent pas cette homogénéité.

D’autres principes sont moins évident à mettre en place (il n’existe pas de vérité ultime, vous vous en doutez bien) et souvent les bonnes pratiques sont créées et imaginées par les mastodontes du web. Par exemple la carte de France en page d’accueil du site leboncoin.fr était une nouveauté à l’époque. Aujourd’hui, la navigation par carte est devenu un réflexe instauré par le site, repris par de nombreux autres sites, et naturel pour les internautes.

De manière plus générale, les réactions des internautes français ne seront pas systématiquement similaires que les réactions des internautes américains. C’est pourquoi de nombreuses sociétés françaises se sont écroulés en voulant copier les bonnes pratiques américaines, souvent bien plus intrusives et tape à l’oeil qu’en France.

Vous imaginez que les différences sont encore plus drastiques quand on s’attaque à des marchés plus exotiques comme le marché chinois, qui encore aujourd’hui reste un marché extrêmement difficile à attaquer.

L’accessibilité

Il existe plusieurs niveaux d’accessibilité, mis en place par la W3C (World Wide Web Consortium). La W3C est un organisme chargé de définir les bonnes pratiques liées à l’Internet. C’est par exemple lui qui définit les règles du HTML ou du CSS, qui sont repris par la majorité des navigateurs Internet.

Ainsi, un site pourra être plus ou moins « accessible » en fonction des pratiques mis en place.

On distingue ainsi 3 grands niveaux :

  • Le niveau numéro 1 (ou niveau A) : ce qui doit être fait. Par exemple, avoir des signifiants qui ne sont pas uniquement construits autour des couleurs (par exemple rouge pour l’interdiction), afin de ne pas handicaper les daltoniens, notamment (potentiellement 10% des internautes en France)
  • Le niveau numéro 2 (ou niveau AA) : ce qui devrait être fait. Par exemple avoir des contrastes clairs et nets.
  • Le niveau numéro 3 (ou niveau AAA) : ce qui pourrait être fait. Laissez le choix de taille du texte aux visiteurs ou encore le choix du contraste.

N’hésitez pas à visiter le site officiel de la W3C, catégorie accessibilité si vous souhaitez davantage d’information sur ces niveau de validation (vous y trouverez également des badges à ajouter à votre site, si vous le souhaitez, sans grand intérêt toutefois).

Optimiser les performances d’un site

Un site ergonomique doit en théorie être optimisé pour inciter les internautes à naviguer et donc à consommer.

Toutefois, la performance d’un site tient parfois à un quelques détails.

Ainsi, le fait d’avoir un CTA (un Call To Action, ou un bouton d’action, ex : « Acheter ») avec un fond vert ou un fond rouge, pourra augmenter jusqu’à 50% les performances de la page.

Un autre exemple concerne le texte du bouton : « Achetez » transformera en théorie plus que « Acheter ».

Les formulaires en particulier sont un terrain de travail privilégié des ergonomes. On sait par exemple que le fait d’inclure le champ « email » en premier dans un formulaire aura tendance à réduire les abandons car c’est le champ que les internautes sont les plus réticents à compléter. Ainsi, s’ils le remplissent, ils auront alors généralement tendance à aller au bout du formulaire.

C’est ces quelques détails qui viendront optimiser un site. Il est notamment conseiller de mettre en place des tests A/B (cf. Web analytique pour les nuls) afin de tester différentes possibilités et constater celles qui fonctionnent le mieux.

Quelques petits tests pour mettre son site à l’épreuve

Il existe de nombreux petits tests pour mettre son site à l’épreuve. Les plus connus sont notamment le test de la grand-mère et l’image flash.

Le test de la grand-mère consiste à faire visiter son site par une personne peu adepte d’Internet. Il faut ensuite lui fixer des objectifs tels que passer une commande, ou trouver tel ou tel produit sur le site. En fonction de son attitude et de la complétion ou non des objectifs, il faut en tirer des conclusions sur la complexité du site et la facilité de compréhension.

Le deuxième test, celui de l’image flash, consiste à naviguer avec une connaissance sur son site, uniquement pendant 2 à 3 secondes : on affiche la page d’accueil 2 à 3 secondes puis on la ferme.

On peut alors poser différentes questions à la personne qui n’avait jamais vu le site, ni n’en avait entendu parlé (autrement dit, qui ne savait pas avant de quoi il s’agissait) : « quel est le nom du site ? » ou encore « à quel besoin le site apporte-t-il des solutions ? », ou encore « quel est l’élément qui t’as le plus marqué dans la page ? », voire « de quoi te souviens-tu ? ».

De la même manière, des conclusions seront à tirer, et c’est un moyen gratuit et facile d’identifier de gros problèmes potentiels.

Il existe d’autres tests, comme flouter son site et constater s’il est toujours possible de différencier les blocs, généralement synonyme d’une bonne ergonomie.

Une chose est sûre, sur Internet, quand bien même les internautes sont de plus en plus habiles, ils sont également de plus en plus fainéants et s’ils ne comprennent pas l’intérêt d’un site en moins d’une seconde, alors forte est la probabilité qu’ils le quittent.

Partagez avec vos amis...










Submit