Ergonomie d’une interface Web
Définition de l’ergonomie
Présentation des critères ergonomiques de Bastien et Scapin
Prise en compte des critères d’accessibilité et de qualité des interfaces Web
Analyse de la cible
Définir les utilisateurs, recenser leurs besoins et envies pour établir les contenus, services et fonctionnalités
Présentation de la technique des personas
Cas pratique : analyse de fiches de personas pour en déduire les scénarios type d’utilisation
Architecture de l’information
Structurer le contenu en fonction des attentes des utilisateurs
Fournir une arborescence du site permettant de trouver rapidement l’information
Présentation de la technique du « Card Sorting » ou tri de cartes
Cas pratique : réalisation d’un tri de carte en groupe puis d’un tri individuel en ligne et analyse des résultats
Conception de l’interface
Permettre à l’utilisateur d’atteindre son objectif : le guider, gérer ses erreurs, réagir à ses actions et lui laisser le contrôle.
Concevoir le système de navigation
Concevoir les éléments d’interaction : saisie et sélection de données, manipulation d’informations affichées,
déclenchement de fonctionnalités et de services
Organiser l’espace : définir clairement les zones (zoning), y placer les éléments d’interface, établir la hiérarchie visuelle
Outil de Wireframe (maquette fil de fer), adaptation aux tablettes et smartphones
Cas pratique : étude d’exemples en ligne, évaluation de l’interface d’un site en ligne à l’aide d’une check-list
reprenant les critères étudiés
Conception graphique
Créer une expérience utilisateur agréable
Choix des couleurs, techniques de mise en évidence, incitation, utilisation des images et icônes
Lisibilité : contraste de couleurs, typographie, interlignage et justification
Cas pratique : construction et évaluation d’une charte graphique
Contenu éditorial
Adapter l’écriture pour être lu
Structurer et hiérarchiser le contenu, liens explicites, images illustrant le contenu
Utiliser les micros-contenus : titre, accroche, chapeau
Règles des 5W et pyramide inversée
Cas pratique : amélioration du contenu éditorial d’un site en ligne
Tests utilisateurs
Déroulement d’un test utilisateur
Définir les scénarios de test
Cas pratique : réalisation d’un test utilisateur, application d’un scénario de test sur un site en ligne