L' ergonomie d'un site Internet

L’ergonomie fait référence à la lisibilité de ses pages, à leur composition, au design du site, à la structure globale du site et à sa navigabilité. L’une des premières impressions que les internautes peuvent ressentir en arrivant sur un site inconnu est celle d’une surcharge cognitive conjuguant des éléments de nature différente (graphiques, linguistiques et imagés) pouvant créer un sentiment de doute. La décision d’achat est généralement assujettie à des besoins en information. Il est donc impératif que le site facilite l’accès à l’information. La structure du site et la lisibilité des pages web doivent permettre à chaque visiteur d’atteindre rapidement les informations voulues. Par conséquent, il est nécessaire de hiérarchiser les informations par importance pour améliorer la visibilité globale (Ladwein, 2001). 

Ergonomie marketing digital

La navigabilité d'un site Internet

La navigabilité correspond à l’aisance d’un internaute à utiliser un site Internet. L’utilisabilité d’un site devra permettre aux internautes d’atteindre les buts de sa visite le plus rapidement possible. Les attributs d’utilisabilité influencent directement la satisfaction des utilisateurs (Cooper, 2014). Ils ne doivent pas être en trop grand nombre car trop d’éléments visuels affecte leur visite ou augmente le taux d’abandons. Nous avons par conséquent cherché à définir la navigabilité idéale du site en ayant une réflexion sur la construction d’une page web ainsi que sur la structure globale d’un site.  

 

  1. La construction d’une page web  

Pour construire une page web optimale, il est nécessaire de comprendre dans un premier temps la façon dont le cerveau humain traite l’ensemble des éléments d’une page, et plus particulièrement les informations visuelles puisque 80% des informations traitées par le cerveau d’un internaute proviennent de la vue (Mattelart, 1996). Les études oculométrique réalisées en 2003 par le Poynter Institute, révèle qu’en Occident, le regard des internautes se pose en priorité en haut à gauche de l’écran constituant ainsi la zone éditoriale prioritaire, puis se dirige diagonalement (figure ci-contre). 

 
ergonomie site Internet
oculométrie d'un site web

Un site internet, étant conçu pour les internautes, il est indispensable de mettre en haut à gauche, dans la zone prioritaire, les informations que ceux-ci souhaitent avoir en premier. Un internaute qui ne connaît pas un site va chercher à savoir si le site correspond bien à ces attentes. De fait, il est important de mettre dans cette zone l’activité principale de l’entreprise. Idéalement, ce sera le logo et le slogan qui seront placés ici. Le slogan va contextualiser en quelques mots l’analyse visuelle du visiteur de cette zone et répondre à son besoin d’être rassuré quant à l’adéquation de sa recherche et de sa présence sur le site.  

Dans le cas où le site ne correspond pas à ce que recherche l’internaute, celui-ci n’a pas de frustration liée à avoir perdu du temps à comprendre ce que le site pouvait lui apporter. Il peut en revanche profiter du temps gagné pour continuer à explorer la première page du site. Éventuellement, d’autres éléments dans la diagonale de la page pourraient attirer son attention et lui suggérer l’idée que le site peut lui procurer une bonne expérience.  

Le logo de l’entreprise sera également placé dans cette zone. Si la conception de celui-ci représente l’activité de l’entreprise, cela renforcera la compréhension du visiteur. Si le symbolisme choisi ne reflète pas l’activité de celle-ci, il n’en reste pas moins une représentation visuelle très importante pour les visiteurs qui reviennent sur un site. Plus qu’un repère visuel, le logo reflète l’entreprise et ses valeurs, et son image. Les études démontrent que les consommateurs adhèrent plus facilement à une identité forte ce qui justifie le choix de l’emplacement du logo dans cette zone éditoriale prioritaire.  

 Dans la zone secondaire, il parait judicieux d’insérer deux types d’éléments : 

  • Les premiers éléments permettront à l’internaute de comprendre comment il peut évoluer sur le site. C’est pour cette raison qu’est généralement disposé un menu de navigation.  
  • Les seconds qui vont compléter l’information de la zone prioritaire. L’activité de l’entreprise doit être clairement comprise par l’internaute.  

Enfin, dans la troisième zone, les éléments apporteront des informations préalablement données au visiteur et lui proposeront des solutions de navigabilité afin d’enrichir son expérience. 

Cette lecture étant très rapide, les éléments de ces trois zones doivent être parfaitement optimisés pour convaincre le visiteur que le site est fiable, simple et agréable à utiliser. 

B. La structure du site 

La structure doit permettre, d’une part une évolution rapide vers n’importe quelle page du site et d’autre part, une réponse à un besoin d’information des internautes. Différentes structures existent, mais celle en silo paraît idéal puisqu’elle permet de hiérarchiser les informations par priorité et de les regrouper également par thème ou catégorie. Cette approche par catégorie permet aussi d’avoir une similarité sémantique qui s’avère être une bonne pratique pour le référencement de son site Internet auprès des moteurs de recherches. Pour faciliter l’évolution, il est nécessaire d’établir des interconnexions entre les pages de différents thèmes. L’objectif est double : premièrement cela permet d’améliorer l’expérience de l’utilisateur puisque celui-ci n’est pas obligé de revenir sur la page d’accueil du site pour découvrir d’autres thèmes abordés par l’entreprise. Deuxièmement, cela l’amène vers des pages plus stratégiques. Cette interconnexion est d’autant plus importante qu’un internaute n’arrive pas toujours sur un site par la page d’accueil.  

C.L’accessibilité 

L’accessibilité fait partie intégrante de la navigabilité d’un site puisqu’elle fait référence à son utilisabilité pour tous les internautes. Elle est essentielle d’une part car c’est un chiffre d’affaires potentiel qu’on ne peut négliger puisque près de 20% de la population en France a un handicap (visuel, auditif, moteur). D’autre part, pour l’image du site puisque cela montre une volonté de considérer chaque personne malgré son éventuelle déficience. Pour chaque handicap, des solutions existent et doivent être mise en place : 

  • Le handicap visuel 

Il concerne 1,7 millions de français (Insee, 2007). Dans 33% des cas la déficience est légère, moyenne dans 55% des cas, profonde dans 12% des cas dont 3,6% d’aveugles. Pour que le texte d’un site Internet puisse être lu par tous, le choix des contrastes pour les personnes daltoniennes ainsi que la taille des caractères (myopie et presbytie) doivent être choisis avec soin.  

  • Le handicap auditif 

Les malentendants représentent environ 8% de la population française (Insee, 2007). Un sous-titrage à l’ensemble du contenu multimédia doit être proposé.  

  • Le handicap moteur 

Les causes d’un handicap moteur sont beaucoup plus variées (maladie de Parkinson, paralysie, …) et concernent 2,3 millions de personnes en France (Insee, 2007). Trois mesures doivent être instaurées pour que les personnes atteintes de ce type d’handicap puissent utiliser le site avec davantage d’aisance : 

  • Le site doit être entièrement utilisable sans souris, uniquement à l’aide d’un clavier. 
  • Les boutons d’actions doivent être suffisamment gros. 
  • Pour des actions importantes, il doit y avoir une confirmation de l’action. 
  • Le handicap cognitif  

Enfin pour les handicaps cognitifs qui concernent 700 000 personnes (Insee, 2007), une interface utilisateur doit intégrer des éléments tels qu’un fil d’Ariane pour le repérage et des icônes pour faciliter la compréhension. 

A cette conception d’un site Internet, il faut intégrer les éléments esthétiques qui vont constituer la personnalité du site. 

Le design d'un site Internet

Le design d’un site marchand représente l’ensemble des composantes visuelles et auditives capables de stimuler les sens de l’internaute. Sa perception holistique lui permet de caractériser un site Internet (Galan, Gonzalez, 2001). Cette impression générale influencera considérablement son comportement. L’atmosphère est l’élément qui a le plus d’impact sur le comportement d’achat du consommateur lors de sa visite du site. Les facteurs hédonistes12 sont des éléments essentiels contribuant à la qualité perçue d’un site (Zeithaml, 2002). Ce sont des facteurs qui rendent la consultation du catalogue agréable. 

  1. Les couleurs 

La couleur s’impose comme un élément essentiel de l’interface d’un site Web. Son attrait visuel étant évalué en 50 ms (1/20e de seconde). Les concepteurs de sites Web ont environ 50ms pour faire une bonne première impression (Lindgaard et al., 2006). Pour concevoir des interfaces de sites marchands colorées de manière efficace, il faut comprendre les principes des interactions au sein des couleurs elles-mêmes, les supports sur lesquelles elles sont projetées et les internautes. 

 Deux couleurs aux teintes similaires ont un faible contraste, de fait, la lisibilité du site sera moins facile. Par ailleurs, la perception de la couleur par les individus est complexe car elle n’est pas uniquement le fait physiologique ou psychologique. Elle est aussi conditionnée par la culture du pays de l’internaute, son niveau de culture générale, son éducation et son appartenance socioprofessionnelle. Par ailleurs, la perception évolue au fur et à mesure des expériences vécues par le consommateur. La psychologie des couleurs doit être comprise pour bien positionner un site Internet en fonction du produit vendu et de la cible choisie. Les travaux de Joe Hallock en 2003 illustrent la différence de perception de chaque couleur que les consommateurs peuvent avoir.  

Une couleur n’est jamais unanimement associée à une caractéristique ou une émotion. En revanche, on distingue nettement des tendances auxquelles une couleur est associée. Par exemple, le bleu est associé à la haute technologie, à la qualité, à la fiabilité et à la sécurité. Plus globalement, les couleurs froides procureraient plus de plaisir aux consommateurs que les couleurs chaudes, mais celles-ci stimulent davantage l’intellect comme le jaune (Bellizzi, 1983 cité par Aboubaker Ettis, 2016).  

Les supports sur lesquelles elles sont projetées peuvent donner un rendu différent. D’une part, du fait des caractéristiques de chaque support, qui vont pour certains atténuer les teintes des couleurs, mais également lié encore une fois à la façon dont le cerveau traite les éléments cognitifs. Ainsi, « un consommateur serait plus enclin à acheter sur un site mobile avec un contraste positif (texte clair sur fond sombre), ce qui est le contraire de la plupart des sites actuels utilisant le noir comme couleur de texte sur des arrière-plans lumineux tels que le blanc » (Pelet, 2017).  

B. La typographie 

La typographie assume un rôle croissant dans la conception Web (Uxpin, 2017). Elle a un double rôle. Elle participe dans un premier temps au design du site. Chaque caractère typographique à une forme bien caractéristique. Un ensemble de caractères constituent une police d’écriture qui a, elle aussi des propriétés qui lui sont propres tel que l’espacement entre chaque lettre. L’impact sur le design est donc important : une police d’écriture avec ou sans empattement (le serif) modifie l’aspect visuel d’un texte tout comme une police arrondie. En fonction des produits vendus sur un site marchand, il est important d’utiliser une police adaptée. Pour décrire un produit végétal, il sera plus approprié d’utiliser une police ronde rappelant leurs formes ondulées (Bardelli, 2018). 

Une police d’écriture a également un impact sur la lisibilité. La forme et l’espacement entre chaque lettre ont un effet sur la facilité de lecture d’un mot. La police Arial semble plus facile à lire que la police Time new roman à taille identique (Bernard et al., 2003, cité par Pelet et Taieb, 2017). Sur un ordinateur, les polices de caractères sans empattement sont préférées car elles sont perçues comme plus lisibles sur les écrans. 

C. L’aération 

L’aération d’un site web a également plusieurs utilités et elle participe à enrichir le design du site.  En fonction du produit et de la clientèle, les espaces devront être plus ou moins importants. Un site web positionné sur une clientèle luxe adoptera un style plus minimaliste qu’un autre dont les produits seront davantage destinés à une consommation de masse. Il ne faut pas pour autant les supprimer car même si pour certains ils constituent un gaspillage d’espace précieux, ils facilitent néanmoins la lisibilité du contenu d’un site Internet. Un espace permet de valoriser un contenu. Il devra être utilisé pour les titres, entre les paragraphes, entre les boutons d’actions et les contenus multimédias. Associés à une bonne compréhension de la lecture des yeux, les espaces permettent de mettre en évidence un contenu important pour le lecteur ou un contenu que l’entreprise souhaite mettre en valeur. 

 

Le design doit provoquer un plaisir sensoriel et faciliter l’apprentissage du consommateur. Ces efforts peuvent être vains si le site ne jouit pas d’un support technique efficient. 

Bibliographie :

Ettis, Saïd Aboubaker (2016). “La Couleur de l’atmosphère Des Sites Web Marchands et Le Comportement d’approche : Rôle Médiateur de La Stimulation et Rôle Modérateur Des Motivations Hédonistes.” La Revue Gestion et Organisation 8, no. 2, September 1, 2016,   75–86. https://doi.org/10.1016/j.rgo.2016.09.001. 

Galan, Jean-Philippe, Christine Gonzalez (2001). “Un cadre théorique de l’impact des éléments de conception du site Web sur les réponses des consommateurs.,” mai 2001. 

Ladwein, Richard (2001) “L’impact de la conception des sites de e-commerce sur le confort d’utilisation : une proposition de modèle,” Congrès International de l’Association Française du Marketing, Deauville, vol 17.

Pelet, J.E. (2018). E-commerce, comment concevoir, réaliser et piloter votre site. Dunod., 2018. ISBN : 978-2-10-078779-1