Créer un blog rentable et réussir sa vie

Partager sur facebook
Partager sur twitter
Partager sur pinterest

21 conseils en webdesign et ergonomie à appliquer immédiatement sur votre blog

 je vous propose 21 conseils en webdesign pour améliorer l’ergonomie et l’apparence de votre blog. Le but du jeu : faire en sorte que la navigation soit agréable pour vos visiteurs tout en tenant compte des contraintes des moteurs de recherche.

Les erreurs de design web sont fréquentes et elles peuvent vraiment affecter le comportement des visiteurs sur votre site. Alors, apprenez à les éviter !

21 conseils en webdesign pour donner à votre blog un look plus travaillé

L’ARCHITECTURE GLOBALE DU SITE

1. Mettez les éléments clés là où vos visiteurs vont les chercher.

En tant qu’internaute, nous avons une certaine expertise en webdesign. Même si au premier abord vous n’en avez pas conscience, vous savez instinctivement comment sont construites la plupart des pages web. Cette connaissance vous permet de gagner du temps lorsque vous naviguez car vous savez tout de suite où trouver telle ou telle information.

Par exemple, vous savez que les mentions légales sont en général placées en bas de page. Vous savez que le menu, lui, se trouve plutôt en haut, tout comme le logo du site. Lorsqu’à votre tour vous créez un site, veillez à respecter la position de ces éléments. De même, la rubrique « Contact » et la rubrique « A propos » s’appellent toujours de cette manière… Changer ce titre standard peut dérouter les visiteurs.

2. Rendez votre logo ou le titre de votre site cliquable.

Cela fait partie aussi des réflexes que l’on acquiert en tant qu’internaute : le logo ou le titre d’un site doit renvoyer vers la page d’accueil.

3. L’information doit être structurée de manière logique.

Pendant longtemps, on a vanté les mérites de la règle des trois clics : un visiteur devait pouvoir accéder en trois clics maximum à n’importe quelle page du site web. A la lumière des connaissances actuelles, il semblerait que ce ne soit pas si inflexible.

Ce qui prime en réalité est la manière dont le visiteur est capable à tout instant de se repérer dans le site : où suis-je ? Où puis-je aller ensuite ? En quoi ai-je intérêt à cliquer sur les liens à disposition ? Bien sûr, plus le visiteur accède rapidement à ce qu’il cherche, mieux c’est…

Certains ont visiblement une grande maîtrise du sujet. Ahem. A voir sur Arngren.net.

Arngren

4. Le contenu important se situe au-dessus de la ligne de flottaison.

La ligne de flottaison, c’est ce moment où l’on doit scroller pour afficher la suite de la page. En résumé, tout votre contenu important doit être visible sans que vos visiteurs n’aient besoin de descendre sur la page (logo, menu, début des articles, etc).

5. Permettez à vos visiteurs de faire des recherches sur votre site.

Un moteur de recherche présent sur chaque page les aidera à voir si vous avez déjà abordé un sujet. C’est notamment très utile dans le cas des sites riches en contenu.

WEBDESIGN : PENSEZ AUX MENUS ET AUX LIENS

6. Le menu doit être clair et ses titres doivent être concis.

Le menu d’un site permet à la fois d’en refléter le contenu (il donne une idée des rubriques) mais aussi de guider plus facilement l’internaute vers les informations qu’il cherche. Il doit donc être concis et concret à la fois. Vous aurez tout le loisir d’être original dans vos textes… mais pour un menu, mieux vaut éviter les intitulés alambiqués !

7. Dites adieu aux menus interminables.

A une époque, il était très à la mode de faire des menus avec un nombre incalculable de sous-menus. On pensait alors que c’était plus clair pour le visiteur. En réalité, ces menus sont souvent très peu fonctionnels : pensez notamment aux utilisateurs qui, sur mobile, doivent scroller interminablement avant de venir à bout de vos 8 sous-menus et 6 sous-sous-menus !

8. Les liens doivent être faciles à repérer.

J’ai croisé beaucoup de blogs où les liens étaient de la même couleur que le texte… et où le texte en gras, lui, était d’une couleur différente. Historiquement, les liens ont toujours été d’une autre couleur que le texte… On ne vous demande plus de les souligner et de les mettre en bleu systématiquement mais faites au moins en sorte qu’ils soient faciles à identifier.

TYPOGRAPHIE ET COULEURS

9. Ne multipliez pas les polices d’écriture originales.

Utiliser une police d’écriture originale pour des titres, pourquoi pas… mais écrire tous vos textes avec ce type de police peut rebuter les visiteurs. En webdesign, mieux vaut vous limiter à 3 polices différentes.

Typographie web

10. Veillez à la lisibilité des caractères.

Elle passe par plusieurs facteurs :

  • La taille de la police, qui doit être adaptée à l’écran et suffisamment grande.
  • La graisse de la police (est-elle plutôt mince ou plutôt grasse ?) : une police trop fine peut être difficile à lire, en particulier sur un écran où le contraste est mauvais.
  • L’espacement des caractères : une police trop condensée est difficile à lire… tout comme une police trop espacée.
  • L’interligne : sur le web, on peut l’augmenter un peu pour rendre les textes moins « compacts » et plus aérés.
  • Le bon usage du gras et de l’italique : ils sont censés mettre en évidence des éléments du texte… mais si 90% du texte est en gras et/ou italique, ils n’ont plus aucun sens !

11. Il doit y avoir du contraste…

Le fond et le texte doivent être suffisamment distincts pour que le texte ressorte clairement. Certaines couleurs comme le jaune sur fond blanc sont difficilement lisibles. Pensez aussi au fait que tous les écrans ne sont pas calibrés de la même manière. Chez certains, le contraste est naturellement plus faible.

12. … mais attention aux fonds noirs !

Les textes clairs sur fond noir étaient très populaires dans les années 90… mais il faut être très prudent avec ce type de choix, en particulier si vous avez un site qui met l’accent sur le texte. Lire sur fond noir est plus fatigant. Si vous optez pour un fond noir, préférez un texte gris clair à un texte tout blanc pour réduire un peu cette fatigue visuelle.

Texte blanc sur fond noir et texte noir sur fond blanc

13. On évite les arcs-en-ciel !

Même si c’est très joli après une bonne averse, on évite sur son site web de multiplier les couleurs différentes. Ce n’est pas seulement une histoire d’esthétique, c’est aussi une histoire d’apprentissage pour vos visiteurs : s’ils savent que vos liens sont toujours de telle couleur, que les sous-titres sont toujours de telle couleur, etc, ils se repéreront plus vite dans votre contenu que si vous changez ces règles d’un article à l’autre.

Trois couleurs sont aussi à utiliser avec prudence en webdesign : le vert et le rouge (daltoniens) et le bleu (historiquement réservé aux liens donc que l’on préférera éviter pour du contenu texte, même si cette pratique se perd de plus en plus).

Un bon usage des couleurs permet souvent de donner une apparence plus professionnelle à son site.

FLUIDITÉ ET CONFORT DE NAVIGATION

14. Votre site doit se charger rapidement.

Si votre page met plus de 2 secondes à se charger, vous perdez déjà 12% de vos visiteurs. Au bout de 4 secondes, vous en avez perdu un quart. Sur les mobiles, les visiteurs sont un peu plus patients… mais sans jamais dépasser 6 à 10 secondes de chargement. Pensez notamment au chargement des images, qui alourdissent souvent les pages.

Veillez aussi à ne pas multiplier les plugins gourmands en ressources si vous utilisez des plateformes comme WordPress.

La vitesse de chargement est devenue un critère de référencement et des formats comme le format AMP se développent pour rendre le web encore plus rapide sur mobile.

15. La publicité ne gêne pas la navigation.

Les pop-up, les publicités dont on ne sait pas comment couper le son ont tendance à être rédhibitoires pour les visiteurs… et c’est encore plus gênant sur les mobiles quand une pop-up mal placée vient couvrir tout l’écran sans que l’on sache comment s’en débarrasser.

World's Worst Website : le pire site web au monde

16. Prenez en compte les différences de résolution d’écran.

Je ne le répéterai jamais assez : le responsive design est aujourd’hui indispensable. Votre site doit s’adapter à la lecture sur mobile et tablette (40% de mon trafic pour vous donner une idée !). N’hésitez pas aussi au passage à tester l’affichage sur différents navigateurs. Le visiteur ne doit jamais avoir à scroller horizontalement pour afficher toute votre page.

17. Évitez les systèmes de défilement infini.

Ce sont des designs de sites sans pagination, où le contenu s’affiche au fur et à mesure que l’on descend dans la page.

Google a souligné la complexité de cette pratique en matière de référencement mais elle est aussi médiocre en termes d’expérience utilisateur. Mieux vaut répartir le contenu sur plusieurs pages, avec une vraie pagination, plutôt que tout afficher sur la même page.

ERGONOMIE ET CONTENU

18. Les images et les liens ont tous une description.

Quand vous mettez en ligne une image, complétez toujours le champ description (attribut « alt »). De même, entrez si possible la description d’un lien (attribut « title »). Pour les images, c’est essentiel en termes de référencement : un moteur de recherche n’étant pas capable de décrypter le sens d’une image, ces mots clés vont l’aider à la positionner correctement dans ses résultats. Mais surtout, cela aidera vos éventuels visiteurs malvoyants (les lecteurs d’écran leur liront cette description).

19. Les articles sont bien hiérarchisés.

Un gros titre, des titres, des sous-titres. Utile non seulement pour structurer votre réflexion mais aussi pour faciliter la lecture rapide.

20. Écrivez pour des êtres humains.

Adieu les titres bourrés de mots clés…

21. N’hésitez pas à avoir recours à des guides visuels.

Des icônes bien placées peuvent vous aider à orienter l’attention du visiteur.

Par exemple, ceci est un avertissement !

De même, le pointeur de la souris peut se changer en main au survol d’un lien.

Conclusion

Cela fait une sacrée checklist pour un webdesign aux petits oignons, je le reconnais… mais une bonne ergonomie joue un grand rôle dans la satisfaction des visiteurs !

webinaire agence webmarketing

Profitez maintenant du meilleur Webinaire composé des secrets et stratégies que personne ne vous dévoilera, rejoignez maintenant plus de 24.500 entreprises qui ont profité des secrets.

Partagez cet article avec vos amis

Partager sur facebook
Partager sur google
Partager sur twitter
Partager sur linkedin