9 conseils pour obtenir un site ergonomique
Quand on crée son site web, on a tendance à se concentrer seulement sur le contenu et le design. On oublie souvent que d’autres paramètres on un impact sur l’experience de ses utilisateurs. L’esthéthique, les typographies, les couleurs, la vitesse de chargement des pages, la cohérence générale du site, tant d’éléments essentiels à l’utilisabilité d’un site. Dans cet article nous vous donnons les armes nécessaires pour appréhender l’ergonomie de votre site web.
Qu’est-ce qu’un site ergonomique ?
Qu’est-ce que l’ergonomie – Définition ?
L’ergonomie est définie par Alain Wisner, médecin et un des précurseurs de l’ergonomie en France, comme :
« L’ensemble des connaissances scientifiques relatives à l’homme et nécessaires pour concevoir des outils, des machines et des dispositifs qui puissent être utilisés avec le maximum de confort, sécurité et efficacité ».
Alain Wisner
L’ergonomie dans le web
Dès l’apparition du web, l’ergonomie s’est appliquée à ce nouveau canal. L’ergonomie d’un site web regroupe l’ensemble des recommandations dans le but d’optimiser l’expérience de l’utilisateur sur un site internet et d’améliorer son confort de navigation. Il s’agit de créer un site utile et facilement utilisable. En d’autres termes, il s’agit de penser à l’expérience des utilisateurs et de se mettre à leur place pour rendre leur expérience la plus agréable possible.
L’importance d’un site ergonomique
Une boutique physique désordonnée et surchargée aura tendance à faire fuir les clients. Ce principe s’applique également aux sites web. Un site compliqué à comprendre sur lequel on ne trouve pas ce que l’on cherche frustrera l’utilisateur, et de même que pour une boutique bordélique, l’utilisateur quittera votre site web pour aller chercher son bonheur ailleurs.
Voici certains des aspects peu ergonomiques qui risquent de faire fuire l’utilisateur :
- Un site lent à charger
- Un site où l’utilisateur ne comprend ce qui est proposé
- Un site mal structuré où l’utilisateur risque de se perdre
- Un site désordonné avec trop d’informations
- Un site illisible
Travailler l’ergonomie de votre site web est indispensable pour attirer les utilisateurs, les conserver le plus longtemps possible, les inciter à effectuer des actions ( lire le contenu, effectuer un achat ou encore utiliser les formulaires de votre site ) et les fidéliser.
Un site ergonomique pour booster votre réferencement SEO
Améliorer l’ergonomie de votre site web participe à booster son référencement sur les moteurs de recherche. Ces derniers ont pour objectif de faciliter les recherches des utilisateurs en leur proposant en priorité les sites web qui semblent les plus pertinents. Il faut remplir plusieurs critères pour améliorer son positionnement dans les moteurs de recherche, l’ergonomie de votre site web est l’un d’entre eux. Travailler sur l’ergonomie de votre site web vous permet d’améliorer :
- L’expérience utilisateur
- Votre image de marque
- Le trafic sur votre site et donc sa notoriété
- Le taux de conversion de votre site
- La fidélisation de vos consommateurs
Voyons maintenant les règles à suivre pour obtenir un site web ergonomique et faciliter la navigation sur votre site pour les utilisateurs.
Nos 9 conseils pour un site ergonomique
Sommaire :
- Ne pas surcharger la page d’accueil
- Structurer vos pages pour une meilleure lisibilité
- Votre site web doit avoir une structure cohérente
- Un menu intuitif pour un site ergonomique
- Faire un choix de police ergonomique
- Bien choisir les couleurs
- Optimiser la vitesse d’affichage de vos pages
- Penser à la navigation sur mobile et tablette
- Page Erreur 404
1. Ne pas surcharger la page d’accueil
La page d’accueil est la première vision qu’auront les utilisateurs de votre site, et c’est souvent la page qui aura le plus de trafic. L’impression que va donner cette page est donc cruciale pour que les utilisateurs aient envie de rester sur votre site et de naviguer sur ses différentes pages. La beauté de votre design a, certes, son importance, mais l’objectif de cette page est d’abord d’être claire et efficace.
Il faut se mettre à la place de l’utilisateur, les informations doivent être compréhensibles, précises et concises. Ne surchargez pas la page d’accueil d’information, une page trop dense perdra l’utilisateur qui ne saura plus où regarder et où cliquer. Simplifiez la vie des utilisateurs, ils doivent savoir très rapidement où cliquer pour trouver ce qu’ils cherchent, il faut privilégier la simplicité et la sobriété.
N’hésitez pas à utiliser le vide. On a souvent l’impression que le vide d’une page est fait pour être rempli, mais pas nécessairement. Les espaces blancs permettent à l’œil de l’utilisateur de se concentrer sur les informations importantes, et rendent le contenu plus facile à lire. Utiliser le vide permet de limiter au maximum les éléments de distraction. Bien entendu, il faut trouver un équilibre et ne pas laisser trop de blanc pour ne pas donner un sentiment de vide.
De même que pour la surcharge d’informations, ne surchargez pas votre page d’animations, un site qui bouge dans tous les sens ne donnera pas envie de rester. Privilégiez des animations pertinentes qui mettent en valeur votre texte ou aiguillent l’utilisateur dans son parcours. Par exemple, utilisez des micro-intéractions, des animations sur les boutons lorsque l’utilisateur y passe sa souris. Vous pouvez animer les boutons menant vers les produits, votre contact, vos réseaux sociaux, les autres pages, etc. Ces animations permettront d’ajouter de la vie à votre site tout en indiquant à l’utilisateur où cliquer pour trouver ce qu’il recherche. Pour résumer :
- Ne surchargez pas la page
- Privilégiez les informations importantes
- Guider l’utilisateur dans son parcours vers les autres pages
- Utilisez le vide à bon escient
- Mettez en avant les principaux éléments de navigation et d’interaction
Ces conseils pour la page d’accueil sont également valables pour toutes les autres pages de votre site. Vos pages doivent être sobres, claires et efficaces ! Gardez en tête la règle suivante : 1 page = 1 idée à faire passer. S’il y a plusieurs idées, il y a plusieurs pages.
2. Structurer vos pages pour une meilleure lisibilité
La hiérarchie des différents éléments d’une page doit être facile à comprendre dès le premier regard. Pour cela, pensez à hiérarchiser votre contenu. Par exemple, pour un article, adoptez une hiérarchie claire telle que la suivante :
- Grand titre – H1
- Titre 2 – H2
- Titre 3 – H3
- Paragraphe – p
Une hiérarchie des tailles de ces différents éléments permet de faciliter la compréhension du contenu pour vos lecteurs. Il en va de même pour tout type de page, la catégorie de produit, le nom du produit, sa description, etc. Tous ces éléments doivent être différentiables facilement.
Vous pouvez également ajouter un sommaire eu début d’article afin que l’utilisateur n’ait qu’à cliquer sur un titre pour accéder au contenu sans avoir à faire défiler toute la page. Il s’agit encore une fois de faciliter la navigation de l’utilisateur au maximum.
3. Votre site web doit avoir une structure cohérente
La structure de votre site est d’une importance capitale, l’organisation des pages et l’architecture des informations doivent être pensées pour faciliter la navigation de vos utilisateurs. Pensez à disposer les pages de votre site de sorte à ce que l’information soit accessible facilement. L’organisation de votre site doit être logique pour l’utilisateur, chaque page a un objectif précis, et celui-ci doit être indentifiable rapidement.
Par ailleurs, la structure doit être cohérente tout au long de votre site, le design des pages doit garder la même logique, le header doit rester le même sur toutes les pages du site. Donnez des repères homogènes à l’utilisateur pour le guider au cours de sa navigation.
4. Un menu intuitif pour un site ergonomique
Le menu de votre site web est un élément clé dans l’amélioration de la navigation de vos utilisateurs. Un menu clair et intuitif dès le premier coup d’œil permet de faire gagner du temps aux internautes, ils pourront facilement se diriger vers ce qu’ils cherchent. Le menu, comme mentionné précédemment, doit être présent sur la totalité des pages de votre site pour permettre à l’utilisateur de se repérer en tout temps.
Les titres de votre menu doivent être clairs et concis. En un simple coup d’œil aux titres de votre menu, les utilisateurs doivent être à même de savoir où se diriger pour trouver ce qu’ils cherchent.
Utiliser un fil d’Ariane peut être un plus dans l’ergonomie de votre site web. Il s’agit d’une aide à la navigation permettant aux utilisateurs de garder une trace d’où ils se situent dans votre site.
L’utilisation d’un fil d’ariane est d’autant plus pertinente pour les grands sites où il peut être difficile pour les utilisateurs de suivre la hiérarchie du site.
Par ailleurs, pensez à ajouter une barre de recherche à votre menu. Que vous ayez un grand ou un petit site, certains utilisateurs savent exactement ce qu’ils cherchent. Une barre de recherche est alors un plus qui fera gagner un temps précieux à vos utilisateurs.
5. Faire un choix de police ergonomique
Lire un texte sur un écran d’ordinateur fatigue rapidement les yeux, pensez donc à éviter les pavés de textes trop serrés et privilégiez des polices faciles à lire, pas trop exotiques. Des polices telles que Lato, Roboto ou Raleway sont utilisées très fréquemment sur les sites web.
Par ailleurs, pensez à ne pas vous disperser en termes de polices. Concentrez-vous sur 1 ou 2 polices pour rester cohérent. Vous pouvez ensuite jouer avec ces polices en utilisant leurs versions light, normal, gras, italique. Pour les titres, vous pouvez vous permettre un peu plus de fantaisie, mais privilégiez tout de même la lisibilité.
Quelques conseils à respecter en termes de texte :
- Soulignez seulement les liens
- Évitez des tailles de police trop petites pour favoriser la lisibilité
- Découpez vos textes en paragraphes et incluez des titres clés
6. Bien choisir vos couleurs
Dans un premier temps, les couleurs ont un aspect décoratif, elles impactent donc l’expérience de vos utilisateurs. Mais ce n’est pas la seule raison pour laquelle il ne faut pas les prendre à la légère.
La charte graphique doit être harmonieuse sur l’ensemble du site, pensez à utiliser la même charte graphique sur toutes les pages pour que votre site reste cohérent dans son ensemble. Pensez également à utiliser des couleurs que pourront voir les personnes daltoniennes.
Pour rester cohérent(e), une fois que vous avez choisi vos couleurs, pensez à créer une large palette avec celles-ci. Ainsi, vous n’avez besoin que de 2 ou 3 couleurs, mais avec un grand nombre de nuances différentes, ce qui permettra de rester cohérent et de ne pas éblouir l’utilisateur avec de nombreuses couleurs fatiguantes pour l’œil. Les changements radicaux de couleurs sont à éviter.
Vous pouvez toutefois utiliser des couleurs différentes dans un contexte précis : les icônes et boutons CTA (de l’anglais “call to action” qui dirigent l’utilisateur vers les actions à réaliser). Pour ces éléments, vous pouvez utiliser des couleurs vives qui permettront d’attirer l’attention de l’utilisateur.
Par ailleurs, pensez aux niveaux de contraste des couleurs. En effet, l’objectif principal reste que vos textes soient lisibles. Concentrez-vous donc sur le contraste entre les couleurs de fonds et celles des textes, pour vous assurer de la lisibilité de votre contenu. Privilégiez notamment des couleurs telles que le gris clair pour vos textes.
7. Optimiser la vitesse d’affichage de vos pages
Qui aime attendre qu’une page web charge ? Lorsque une page est trop longue à charger, un grand nombre d’internautes vont tout simplement changer de site. Aujourd’hui, nous sommes habitués à ce que les sites web chargent vite et nous nous agaçons vite si ce n’est pas le cas. Pensez donc à optimiser la vitesse de chargement de vos pages pour ne pas faire fuir vos utilisateurs et potentiels clients, mais également pour ne pas faire attendre les robots de Google qui décideront de votre référencement web. Pour cela, vous pouvez notamment :
- Diminuer le poids de vos pages (il s’agit souvent de compresser vos images)
- Supprimer les plugins obsolètes
- Réduire le nombre de redirections
- Minimiser les fichiers CSS et Javascript
- Activer la mise en cache du navigateur
- Réduire le temps de réponse du serveur
8. Penser à la navigation sur mobile et tablette
Aujourd’hui, plus de la moitié des recherches sur internet sont effectuées depuis un mobile ou une tablette et 73 % des connections Internet se font à partir d’un smartphone*. Un design responsive (adapté à la navigation sur mobile et tablette) est donc essentiel à l’ergonomie de votre site web. Avec un design responsive le visuel de votre site web sera automatiquement adapté aux supports utilisés pour naviguer sur votre site.
« Être responsive, c’est faire en sorte que votre site offre une expérience optimale dans le cas où l’utilisateur navigue depuis un ordinateur ou depuis un appareil mobile, sur téléphone ou sur tablette, tenu à l’horizontale (format paysage) ou à la verticale (format portrait). »
Thomas, UI Designer chez Gandi
Il est important de s’occuper de l’aspect mobile de votre site, car votre site peut être parfaitement optimisé sur ordinateur, mais pas adapté à l’utilisation mobile. Pour adapter votre site, vous pouvez notamment :
- Privilégier les photos carrées, qui sont mieux adaptées aux mobiles.
- Compresser vos images pour accélérer le temps de chargement sur mobile.
- Adapter les boutons et icônes, sans qu’ils soient trop petits pour une utilisation mobile.
- Vérifier que le design fonctionne sur mobile.
*(données extraites du rapport de We Are Social sur l’année 2020).
9. Page Erreur 404
Avoir des pages Erreur 404 sur votre site est à éviter. En effet, c’est frustrant pour les utilisateurs de vouloir accéder à une page qui n’existe plus. Toutefois, en personnalisant la page Erreur 404, vous rendez cette expérience moins agaçante et plus fun pour les utilisateurs, et vous pouvez lui permettre de rejoindre directement une autre page de votre site.
Obtenir un site ergonomique : pour conclure
L’ergonomie d’un site web repose sur des principes de clarté, de hiérarchie, de simplicité et de cohérence nécessaires à l’optimisation de l’expérience utilisateur. Respectez ces bases de l’ergonomie, pour convaincre les moteurs de recherche et être mieux référencé, mais aussi pour améliorer la navigation de vos utilisateurs, pour qu’ils restent sur votre site et passent à l’action.
Vous avez maintenant toutes les cartes en main pour concevoir un site web agréable et intuitif qui répondra aux besoins de vos utilisateurs tout en facilitant leur navigation.
Construisez votre site sur WordPress, le CMS le plus utilisé au monde. Avec WordPress concevez un site ergonomique facilement sans nécessiter de connaissances poussées en développement.
Chez Gandi, nom de domaine + Hébergement WordPress + 2 boites mails de 3 Go et 1 certificat TLS/SSL offerts !
Tagged in SEOWordpress