17 erreurs de conception web à éviter pour un site plus convivial

En conception web, l’utilisabilité est un concept clé. La plupart des erreurs les plus courantes sont en réalité assez simples à corriger. Voici une liste d’erreurs à éviter lorsque vous créez ou modifiez votre site web.

Table des matières

But du site et sentiment de confiance

Erreur 1 : Ne pas communiquer le but de votre site web sur la page d’accueil

Lors de tests de convivialité, nous commençons par poser deux questions simples aux utilisateurs : D’après vous, quel est l’objet de ce site web? Que pensez-vous pouvoir y faire? Très souvent, les utilisateurs n’en ont aucune idée. À moins que vous ne soyez une ville, une université ou l’une des entreprises les plus célèbres du monde, il est préférable d’inclure ces informations dans votre image d’en-tête ou vers le haut de votre page d’accueil. Comme le souligne Steve Krug dans son livre Don’t Make Me Think, il faut éviter de faire de ce mot de bienvenue un énoncé de mission ennuyeux. Soyez concis et clair. Voici quelques exemples :

We provide research-based UX guidance, by studying users around the world. – NN/g

Ici, on écoute, on soutient et on accompagne les jeunes de 12 à 25 ans qui échangent des services sexuels contre toute forme de rémunération. Nos services s’adressent aux jeunes, mais aussi à la famille et aux professionnel·les qui souhaitent obtenir du soutien dans leurs interventions auprès des jeunes. – Piamp

La plate-forme des relations humaines— L’endroit où les centres d’intérêt donnent naissance à des amitiés
Quel que soit votre centre d’intérêt, de la randonnée à la lecture en passant par le réseautage et le partage de compétences, il y a des milliers de personnes qui le partagent sur Meetup. Des événements ont lieu tous les jours : inscrivez-vous pour en profiter. – Meetup

Erreur 2: Conception incohérente

Les sites web créés par des professionnels sont généralement plutôt cohérents lorsqu’ils sont livrés, mais leur présentation peut devenir quelque peu anarchique lorsque plusieurs personnes commencent à modifier la taille de la police, les couleurs, etc. Des éléments de conception cohérents aident les utilisateurs à comprendre la structure de votre site et à inspirer confiance. Veillez à ce que les polices, la palette de couleurs et les autres éléments visuels soient cohérents sur toutes les pages.

S’il peut être tentant de centrer votre logo ou même de le placer à droite pour apporter une touche unique à votre site web, ce n’est pas une bonne idée. Si la majorité de vos visiteurs parlent des langues orientées de gauche à droite, assurez-vous de garder votre logo du côté gauche. Pourquoi?

  • Les études démontrent que le retour à la page d’accueil est nettement plus difficile – environ 6 fois plus – lorsque le logo est placé au centre de la page plutôt que dans le coin supérieur gauche1.
  • Selon les recherches les utilisateurs sont plus susceptibles (89 % pour être précis) de se souvenir des logos lorsqu’ils sont affichés dans la position traditionnelle en haut à gauche, plutôt qu’à droite2.

Ainsi, si vous voulez que les utilisateurs retrouvent facilement leur chemin et se souviennent de votre marque, placez votre logo dans le coin supérieur gauche.

Erreur 4 : Cacher votre navigation dans un menu “hamburger” lorsque votre site est visité sur un ordinateur de bureau ou portable

Votre site web pourra sembler plus épuré, mais cacher la navigation principale d’un site web dans un menu hamburger peut la rendre considérablement plus difficile à trouver. Selon une étude menée par NN/g, les utilisateurs d’ordinateurs de bureau n’ont utilisé les menus cachés que dans 27 % des cas. En outre, les tâches sont plus longues et semblent plus difficiles à accomplir lorsque la navigation est cachée3.

Si vous masquez votre navigation parce qu’elle contient trop d’éléments, envisagez de la réorganiser et de la tester auprès d’utilisateurs.

Erreur 5 : Ne pas proposer d’alternatives au menu hamburger sur mobile

Selon la même étude NN/g, environ 40 % des utilisateurs mobiles n’utilisent jamais le menu hamburger. Par conséquent, si vous devez utiliser le menu hamburger, il est important d’offrir des liens directs vers les principales tâches que les utilisateurs effectuent sur le site4.

Erreur 6 : Supprimer le lien “Accueil” de votre navigation

Si vous n’avez pas de fil d’Ariane ou si votre fil d’Ariane ne comporte pas de lien vers la page d’accueil, il est important d’avoir un lien vers la page d’accueil dans votre navigation, et ce même si le logo de votre site renvoie à la page d’accueil. Pourquoi? La présence d’un lien “Accueil” sur chaque page permet aux nouveaux visiteurs et aux utilisateurs perdus de retrouver plus facilement leur chemin5.

Erreur 7 : Ne pas tester votre navigation

La navigation est le pilier de votre site web. Un système de navigation peu intuitif peut dérouter les utilisateurs et les empêcher de trouver ce qu’ils cherchent. Il est donc important de simplifier la navigation et de créer une hiérarchie claire. Utilisez des libellés explicites et organisez les pages en catégories afin que les utilisateurs puissent facilement comprendre comment se déplacer sur votre site. Testez votre navigation avec des utilisateurs ou avec des amis et des membres de votre famille. Demandez-leur ce qu’ils s’attendent à trouver sous “Services” ou “Ressources”, par exemple. Souvent, ils hésiteront parce que ces intitulés manquent de clarté. Vous pouvez également réaliser des tests d’arborescence et des tris de cartes.

Contenu : repérabilité, lisibilité, accessibilité

Erreur 8 : Ne pas répondre aux questions des visiteurs

N’obligez pas les visiteurs à vous contacter pour obtenir davantage d’informations, car cela peut être agaçant. Au contraire, créez des pages qui offrent un contenu utile, comme des réponses aux questions des utilisateurs, des descriptions de produits et des images utiles. Veillez à ce que les informations importantes – coordonnées ou prix – soient faciles à trouver.

Erreur 9 : Placer des liens vers les tâches principales dans un carrousel ou sous une grande image d’en-tête

De nombreux maquettistes aiment les carrousels et les grandes images d’en-tête. Cependant, les études suggèrent que les utilisateurs perçoivent souvent le contenu d’un carrousel comme inutile. Pire encore, si le carrousel est animé, ils ont tendance à le confondre avec une publicité et à naviguer ailleurs6. Si vous le pouvez, évitez d’utiliser des carrousels et placez les liens vers vos tâches principales directement dans une image d’ent-ête statique plutôt qu’en dessous. Si vous devez absolument utiliser un carrousel, consultez les recommandations du NNGroup.

Erreur 10 : Ne pas rendre votre texte survolable

La plupart des utilisateurs ne lisent pas le texte de votre site web, ils le survolent. Comme l’a écrit l’expert en utilisabilité Steve Krug dans son livre Don’t Make Me Think, imaginez votre site web comme une publicité sur l’autoroute, où les gens passent à toute vitesse. Si vous voulez que les gens s’intéressent à votre contenu, veillez à ce qu’il soit facile pour eux de le parcourir rapidement. Divisez les paragraphes en petites sections, réduisez la longueur des lignes et utilisez des titres et des sous-titres. N’oubliez pas que l’utilisation excessive de caractères gras peut rendre la lecture difficile.

Erreur 11 : Mettre du contenu important uniquement dans des graphiques

Si les visuels peuvent être attrayants, n’oubliez pas que tous les utilisateurs ne peuvent pas accéder à l’information présentée dans ce format ou la comprendre pleinement. En proposant un équilibre entre le texte et les éléments visuels, vous pouvez faire en sorte que votre contenu soit accessible à un public plus large et qu’il transmette efficacement votre message. Pensez donc à incorporer un texte descriptif (accessible) sous vos graphiques afin d’améliorer l’expérience des utilisateurs.

Erreur 12 : Ne pas vérifier le contraste et la lisibilité

Un contraste élevé est important pour tout le monde, mais plus encore pour les utilisateurs ayant une déficience visuelle. Si le contraste entre le texte et l’arrière-plan n’est pas suffisant, il est difficile de lire le contenu de votre site web. En outre, les petites tailles de police et les polices élaborées peuvent également nuire à la lisibilité et doivent être évitées. Veillez à ce que la taille de vos polices soit au moins égale à 17 px et testez vos contrastes de couleurs à l’aide d’outils tels que le vérificateur de contrastes de couleurs des Web Content Accessibility Guidelines (WCAG).

Malheureusement, de nombreuses personnes auront du mal à lire le texte en petits caractères de ce site web municipal ou, à tout le moins, le trouveront frustrant à déchiffrer :

Erreur 13 : Utiliser un langage compliqué

L’utilisation de mots complexes et obscurs peut empêcher les visiteurs de comprendre votre message. Il est important de communiquer clairement et simplement. Évitez le jargon et les mots inutiles lorsque vous exprimez vos idées.

Erreur 14 : Utiliser trop d’animations

Les éléments dynamiques peuvent attirer l’attention, mais trop de mouvements sur une page sont source de distraction. Veillez à n’inclure que les animations nécessaires à la compréhension de l’interface et assurez-vous qu’elles ne nuisent pas au contenu. Soyez également attentif à la durée de chaque animation et envisagez d’ajouter des commandes pour la ralentir ou la mettre en pause si nécessaire. Personnellement, j’utilise rarement des animations.

Erreur 15 : Une présentation encombrée

Une présentation encombrée peut décourager les utilisateurs et les empêcher de se concentrer sur le contenu essentiel. Veillez à ce que votre mise en page soit épurée, simple et organisée. Utilisez des espaces blancs pour séparer les divers éléments et donner à votre site un aspect moins encombré. Évitez de surcharger la page d’accueil avec un contenu excessif. Pour améliorer l’expérience de l’utilisateur, évitez les publicités et les fenêtres contextuelles (pop-up).

Erreur 16 : Ne pas tester votre site web sur mobile

Vous modifiez probablement votre site web sur un ordinateur portable ou de bureau. N’oubliez pas de vérifier sa présentation sur un appareil mobile! Jusqu’à 55 % du trafic de votre site web provient probablement de téléphones. Veillez à ce que tout le contenu s’adapte à l’écran de l’appareil. Testez votre site web sur différents appareils et navigateurs pour vous assurer qu’il est uniforme sur différents systèmes.

Erreur 17 : Ne pas accorder suffisamment d’importance à la rapidité de chargement et à la performance de votre site web

Un site web qui charge lentement peut frustrer les visiteurs et les faire fuir. Il peut également avoir un impact négatif sur votre positionnement dans les moteurs de recherche et réduire les possibilités de conversion et de vente. Il est donc essentiel de veiller à ce que votre site soit optimisé en termes de vitesse en mettant en œuvre des techniques telles que la compression d’images, la mise en cache et la diminution du nombre de requêtes sur le serveur. Choisissez soigneusement votre hébergeur, votre thème et vos extensions.

Conclusion

En conclusion, il est important d’éviter ces erreurs courantes de conception de sites web pour garantir une meilleure expérience utilisateur. Continuez à perfectionner vos compétences en matière de conception et restez ouvert aux commentaires. Après tout, il est toujours possible de s’améliorer.

References

  1. Whitenton, Kathryn. Centered Logos Hurt Website Navigation. NN/g. ↩︎
  2. Whitenton, Kathryn. Website Logo Placement for Maximum Brand Recall. NN/g. ↩︎
  3. Pernice, Kara. Budiu, Raluca. Hamburger Menus and Hidden Navigation Hurt UX Metrics. NN/g. ↩︎
  4. Schade, Amy. Supporting Mobile Navigation in Spite of a Hamburger Menu. NN/g. ↩︎
  5. Loranger, Hoa. Homepage Links Remain a Necessity. NN/g. ↩︎
  6. Pernice, Kara. Designing Effective Carousels for Websites and Mobile Apps. NN/g. ↩︎

Avez-vous trouvé cet article intéressant? Inscrivez-vous à notre infolettre.

Laisser un commentaire