38 conseils d’utilisabilité pour améliorer la mise en page de site

Cette checklist vérifie si la conception est esthétique et minimaliste. Une conception visuelle appropriée signifie que les polices, icônes, couleurs et la disposition aident le client à effectuer les tâches habituelles et que les pages ne contiennent pas d'informations non pertinentes ou rarement nécessaires.

Recommandations d’utilisabilité pour la mise en page et la conception visuelle de site web

1. La densité de l'écran est appropriée pour les utilisateurs cibles et leurs tâches.
2. La mise en page permet de concentrer l'attention sur l’action suivante attendue.
3. Sur toutes les pages, les informations les plus importantes (comme les sujets fréquemment utilisés, les caractéristiques et fonctions) sont présentées sur le premier écran de l'information.
4. Le site peut être utilisé sans défilement horizontal.
5. Les zones cliquables sont expressément explicites.
6. Les zones non-cliquables n'ont pas des caractéristiques qui indiquent qu'elles le sont.
7. La fonctionnalité des boutons et des contrôles est évidente à partir de leurs étiquettes ou de leur conception.
8. Les images cliquables comprennent des étiquettes de texte même redondantes si nécessaire.
9. Les liens hypertextes sont faciles à identifier (bleu souligné).
10. Les polices sont utilisées de manière cohérente.
11. La relation entre les contrôles et leurs actions est évidente.
12. Les icônes et graphiques sont standardisés et/ou intuitifs (concret et familier).
13. Il y a un visuel clair « point de départ » sur chaque page.
14. Chaque page du site partage une disposition cohérente.
15. Les pages du site sont formatées pour l'impression, ou il existe une version imprimable.
16. Les boutons et les liens changent d’aspect visuel lorsqu'ils ont été cliqués.
17. Les boutons radio et cases à cocher sont utilisés de façon appropriée.
18. Les polices sont lisibles.
19. Le site évite le texte en italique et utilise l’attribut souligné uniquement pour les liens hypertextes.
20. Il y a un bon équilibre entre la densité d'informations et l'utilisation des espaces.
21. Le site est agréable à regarder.
22. Les pages ne contiennent pas de « scroll stopper » (éléments de page qui créent l'illusion que les utilisateurs ont atteint le haut ou le bas d'une page alors que ce n’est pas le cas).
23. Le site évite d’utiliser massivement le texte majuscule.
24. Le site a un design uniforme et clairement reconnaissable qui engagera les utilisateurs.
25. La couleur bleu saturée est évitée pour les détails fins (par exemple, du texte, des lignes fines et des symboles).
26. La couleur est utilisée pour la structure et les éléments du groupe sur la page.
27. Les éléments graphiques ne seront pas confondus avec des bannières publicitaires.
28. La police en gras est utilisée pour mettre l’accent sur les catégories de sujets importants.
29. Sur les pages de contenu, les longueurs des lignes n’est ni trop courte ( 100 caractères par ligne) lorsqu'elles sont affichées dans une fenêtre de largeur du navigateur standard.
30. Les pages ont été conçues avec un alignement horizontal et vertical des articles et des widgets.
31. Des étiquettes explicites, des couleurs de fond efficaces ainsi qu’une utilisation appropriée des séparateurs aident les utilisateurs à identifier un ensemble d'éléments cohérents au sein d’un bloc fonctionnel.
32. Les couleurs vont bien ensemble et les couleurs de fonds complexes sont évitées.
33. Les pages sont libres de tout encombrement superflu et d'information non pertinente.
34. Les éléments standards (tels que les titres de page, menu de navigation, politique de confidentialité…) sont faciles à trouver.
35. Le logo de l'organisme est placé au même endroit sur chaque page (idéalement en haut à gauche) et un clic sur ce logo renvoie l'utilisateur vers la page d'accueil.
36. Les éléments qui attirent l’attention comme les animations, des couleurs audacieuses et les différences de taille sont utilisés avec parcimonie et uniquement lorsque cela est pertinent.
37. Les icônes sont visuellement et conceptuellement distinctes mais toujours harmonieuses.
38. Les informations connexes et les fonctions sont regroupées, et chaque groupe peut être scrutés simplement.

Source