Optimiser l’ergonomie et la navigation sur un site web
Le terme « usability » est un terme employé par les ergonomes anglo-saxons. Il peut être traduit par : « utilisabilité » ou, dans un sens plus large, par le mot : « ergonomie ». C’est par abus de langage que nous employons parfois le terme « ergonomie » au lieu du terme « utilisabilité ».
Au sens strict, « ergonomie » signifie : la science qui a pour objet elle-même alors que l’utilisabilité est une caractéristique de l’objet lui-même.
Dans cette étude, nous utiliserons à plusieurs reprises le terme ergonomie pour signifier parfois le mot « utilisabilité » tout comme le font les profession- nels du secteur. On caractérise l’utilisation d’un support informatique par son utilité et par son utilisabilité.
La clef du succès se résume à concevoir un site web facile à utiliser par des utilisateurs clients potentiels !
Optimiser l'ergonomie de son site
Lors de la phase de conception du site, il convient de définir son processus de fonctionnement et de l’adapter à son public.
En effet, un site est toujours dédié à un public bien particulier. À ce titre, il faut apprendre à connaitre ce public et adapter le contenu à ses besoins. Inciter ses internautes à s’exprimer, les inviter aux dialogues permettra d’améliorer les services proposés et de montrer l’intérêt que la marque porte à ses clients. Les réseaux sociaux et les community manager des entreprises en sont un très bon exemple.
Certains sites vont même un peu plus loin, en laissant la parole à leurs clients de manière transparente afin d’améliorer l’ergonomie et, in fine, à autant que faire se peut satisfaire leurs desiderata.
Les différents points liés à l’ergonomie du site sont :
• La gestion des erreurs que vous pouvez retrouver dans cet article: design d’intéractions IxD;
• La gestion du contenu sur petit écran (mobile, tablette).
Depuis plusieurs années, les interactions utilisateurs avec les supports tels que tablettes tactiles ou smartphones se sont multipliées. Ce phénomène pousse les concepteurs à créer des interfaces adaptables aux tailles d’écran de petite taille. La conception pour ce type d’appareil est contraignante car l’espace est réduit et le contenu doit être graphiquement valorisé.
Le choix des informations à mettre en avant sur des supports mobiles reste bien différent du contenu trouvé sur la version « desktop ». L’utilisation du tactile induit la création de zones cliquables.
Soigner l’ergonomie de la navigation sur un site internet
Il esxiste deux inconvénients fréquents sur les interfaces de type mobiles, tablettes et ordinateurs : le temps de chargement et le fait de se perdre sur le site durant le parcours.
Un site qui ne permet pas d’avoir une vue globale peut désorienter, dérouter l’utilisateur et l’amener donc à un acte d’abandon.
« La navigation n’est pas une fin en soit mais un moyen d’atteindre un objectif. »
Il convient de guider l’utilisateur afin de simplifier le processus de navigation. Pour cela, il est important de transposer les différents repères que nous utilisons dans le monde physique sur l’interface virtuelle :
• « Où est l’utilisateur ? »
• « D’où vient-il ? »
• « Qui y a-t-il ailleurs ? »
Indiquer où est l’utilisateur
Deux principales techniques existent pour indiquer à l’utilisateur où il se situe :
1 . L’adresse de la barre de navigation
2 . Les noms de pages en relation direct avec l’adresse URL
Indiquer d’où il vient
Grâce à un fil d’Ariane :
L’adresse de la barre de navigation
Changement la couleur des liens déjà cliqués pour indiquer à l’utilisateur qu’il a déjà cliqué à cet endroit.
Contenu global du site : (que trouve-t-on sur le reste du site ?)
Il est essentiel de présenter à l’utilisateur les différents services que peut lui apporter le site. Pour cela, il est préconisé de fournir à l’internaute une vue globale du site au travers de la barre de navigation.
Ce procédé permet à l’utilisateur d’identifier des rubriques et les fonctionnalités qu’il pourrait être amené à vouloir utiliser.
L’agencement de la barre de navigation se construit dans l’ordre d’utilisation des services ou des fonctions. Plus un service est utilisé, plus il doit être mis en avant. Ainsi, les utilisateurs expérimentés pourront accéder à une navigation dite
« directe ».
Il est conseillé de laisser l’utilisateur maître de sa navigation et lui permettre, s’il le désire, d’arrêter le processus de navigation. Cela peut s’inscrire dans un plan marketing et n’empêche pas le « push » d’éléments d’incitation à la vente par exemple.
L’expression « boucler la boucle » est parfaitement adaptée à cette situation. Il faut absolument que le parcours soit complet, même si l’utilisateur décide de s’arrêter avant. On retrouve généralement ce type de problème dans les processus d’achat. Souvent, après le paiement, l’utilisateur arrive sur une page sans aucun bouton. Il convient donc de lui permettre par exemple de retourner sur la page d’accueil ou au début d’un nouveau processus.
La navigation web
Il existe de nombreux modes de navigation sur les sites internet. Mais on remarque néanmoins qu’un modèle de présentation est fréquemment utilisé sur les écrans d’ordinateur :
• Logo : en haut à gauche (logo cliquable vers la page d’accueil) ;
• La zone utilitaire : barre de recherche / aide / connexion ;
• Navigation primaire : barre de navigation numéro 1 ;
• Navigation secondaire : colonne à gauche ou sous la barre de navigation principale.
La règle des 3 clics : Parmi les bonnes pratiques du web, la règle des 3 clics s’appliquent dans la recherche d’informations principales.
On estime en effet que le site est plus performant si l’utilisateur clique le moins de fois possible pour atteindre son objectif.
Il faut prendre en compte dans nos analyses cette donnée pour créer une navigation fluide, simple et intuitive.
La navigation sur mobile
Les dimensions des mobiles sont sensiblement différentes de celles des tablettes tactiles dont la surface de contact est plus grande. De ce fait, il n’est pas pos- sible d’avoir le même type de navigation et d’interactions avec l’utilisateur sur ces deux types de supports. En effet, il faut s’adapter au format du support, aux habitudes d’utilisation et aux besoins des clients. En fonction de ces paramètres, il convient d’adapter la barre de navigation aux contenus pertinents.
De plus, la matérialisation de ce menu de navigation sur mobile peut s’afficher de différentes formes (pictogrammes, menus déroulants, effets design plus poussés etc.) La forme et la taille des éléments doivent être facilement accessibles au toucher en fonction des morphologies humaines. Le menu sera ainsi souvent placé en bas (accessibilité pour la validation), ou sous forme de gros boutons / zones cliquables.
Une navigation supplémentaire peut être déployée sur un site Internet pour certains parcours avec des tâches complexes ou utilisées peu fréquemment avec un risque d’interruption de parcours.
Le processus d’achat en est un très bon exemple : il faut indiquer à l’utilisateur les différentes étapes du parcours de manière ordonnée. Cette technique permet de simplifier la descente dans le tunnel d’achat et d’afficher l’ensemble du pro- cessus pour rassurer le client. Ce type de navigation s’accompagne de boutons d’actions qui permettent d’accéder aux étapes suivantes.
Recommandations pour faciliter la navigation
Les icônes / pictogrammes
Utiliser des icônes standards : (graphisme déjà connu par les utilisateurs = Facebook, Twitter etc.) accompagner ces icônes de leurs noms et éviter d’en afficher trop car au delà de 12 la mémorisation de celles-ci se dégrade.
Le texte
L’utilisation de puces pour hiérarchiser l’information permet d’améliorer la lisibilité du contenu et sert à l’internaute de points de repère (à utiliser à bon escient sans trop surcharger la page).
Aide à la navigation et présentation des produits pour les sites d’e-commerce
La présentation des produits en vente sur un site e-commerce est importante car elle permettra de conditionner l’acte d’achat. Pour optimiser cette présentation, il est essentiel de respecter certaines règles qui permettront d’améliorer la performance du site :
• L’affichage graduel des renseignements concernant le produit : afficher dans un premier temps les informations tels que le prix, la disponibilité du produit, les informations qui caractérisent le produit;
• Incitation à l’achat du produit en mettant en avant l’ajout au panier grâce au positionnement d’un bouton de type « Call to action » visible et évident;
• La fiche produit doit être rédigée avec une identité rédactionnelle personnalisée (c’est ici que le site va pouvoir se différencier des concurrents);
• Une transparence sur les détails de livraison à ce niveau de navigation va pouvoir déclencher l’acte d’achat (ce qui signifie que le bouton de validation des achats doit se situer à proximité);
• L’utilisateur a pour habitude de visualiser la « zone panier » en haut à droite de la page web, il convient de respecter ces codes. De même, il est préférable d’indiquer directement dans cette zone le nombre d’articles et le prix total;
• Au sein même du panier, il est important de permettre au client de modifier ses choix notamment supprimer ou ajouter des produits;
• La page panier doit être simple et efficace. Il faut pour cela limiter le nombre de liens présents afin de réduire le nombre d’interactions possibles. Il est conseillé de n’afficher que :
– « Terminer ma commande » ; « Modifier mon panier » ; « Continuer mes achats »;
– Éventuellement, il peut être intéressant d’y mettre des liens de cross- selling (c’est un affichage de produits complémentaires afin d’ inciter à une dépense supplémentaire);
– Penser au cas où le panier est vide à orienter l’acheteur potentiel vers les pages du site qui génèrent du trafic ou les pages ciblées à ses besoins.
Conclusion
Au final, il s’agit avant tout de réduire le temps et l’espace entre le besoin, l’envie, le désir et leur satisfaction. Pour cela il faut sans cesse améliorer l’interface par un savant mélange d’UI, d’UX et de webmarketing. La nouvelle notion de design émotionnel, qui vise à créer un affect entre l’homme et l’interface, est aujourd’hui une stratégie marketing incontournable.
L’utilisation de l’analyse du comportement utilisateur telle que l’eye-tracking, les tests d’expérience utilisateurs, l’A/B-testing ainsi que les questionnaires de satisfaction permettent jour après jour d’optimiser le site internet. Ces données nous permettent de mieux connaître les attentes des clients et d’y répondre de façon plus spécifique. Sur ce même principe, un site internet doit être adapté à son public. Il ne suffit pas de traduire un site pour satisfaire un client étranger : la culture influe sur le comportement.
Vous pouvez également retrouver toute une étude sur les habitudes de navigation par pays dans la dernière partie du livre blanc : Ergonomie du web et e-business à télécharger 100% gratuitement.
by 
