Cours 3 21 janvier 2010 Quelques principes d’ergonomie de l’écran et du contenu de la page web Cours 3 21 janvier 2010 Quelques principes d’ergonomie de l’écran et du contenu de la page web Applications Internet

Lorsqu’il revient sur la même page, le lecteur d’un écran opère une lecture sélective, et non pas de repérage.

la position des informations doit être cohérente

il faut organiser les zones de manipulation dans le sens de la lecture et en fonction de la fréquence d’utilisation.

GraphismeCouleurs Un bleu périphérique améliore la vision centrale. Éviter le bleu saturé pour les petits objets ou pour le texte. Utiliser des couleurs réparties sur tout le spectre visible. Minimiser le nombre des couleurs. Éviter les fonds marron et verts. Pour des grandes surfaces, utiliser les couleurs peu saturées. Respecter le sens consacré des couleurs (ex: rouge=interdiction) Utiliser des polices sombres sur des fonds claires.

GraphismePolices de caractère Pas plus de 4 polices pour un site entier. Éviter les majuscules. Utiliser des polices droites (pas d’italique) Éviter les lignes trop courtes. Aérer le texte. Choisir des icônes faciles à comprendre. Accompagner l’icône par son nom, si possible. Limiter le nombre d’icônes.

La page web Chaque page doit tenir dans un écran, maximum deux (longueur). Éviter les pages trop courtes. Limiter la navigation à l’intérieur d’une même page. Permettre un lien de retour rapide en haut. Alléger la page autant que possible. Concevoir la page pour un écran moyen : 1280 x 854. La page doit être visible entièrement en largeur. Éviter, autant que possible, les cadres.

La page webLa page d’accueil Informer dès la page d’accueil. Indiquer explicitement la vocation du site. Éviter les écrans d’introduction. Alléger le plus possible la page d’accueil. Images Minimiser autant que possible la taille des images. Privilégier la qualité par rapport à la taille. Utiliser l’attribut alt pour décrire les images. Afficher progressivement les images. Rendre visibles les zones actives de l’image (les imagemaps) Éviter les animations. Offrir la possibilité d’arrêter l’animation. N’utilisez Flash qu’en cas de besoin express. Pour des applications grand-public, utilisez la palette web-safe.

La page webLe texte Faire ressortir les éléments clé du texte. Justifier les textes à gauche. Éviter le soulignement. Aller à l’essentiel. Commencer par la conclusion. Structurer les informations. Les pages doivent être autonomes le plus possible.