Icone d'impression

Rôle de l'image

La nature et l’organisation des éléments graphiques contenus dans une page web conditionnent le parcours visuel des utilisateurs.

Les images sont peu ou pas consultées pour elles-mêmes :

  • elles ont un effet directeur
  • elles structurent la lecture des informations textuelles qui leurs sont liées

Une image peut servir :

  • À naviguer (image/map: organigrammes gérés par le BIC, cartes interactives)
  • A informer (infographies, photos de catalogues, organigrammes interactifs mais aussi photos support du texte)
  • A structurer (zones d’information, respiration)
  • A capter (points d’entrée de la page)

Intégrer au moins une image par page

  • Pour reposer l'oeil du surfeur perdu dans le texte et capter son intérêt
  • Pour structurer la page :
    Par la simple présence d’images, une page sera perçue comme divisée en plusieurs blocs visuels ce qui déterminera le parcours de l’utilisateur

Avoir le visiteur à l’œil !

Une page web est parcourue en 50 millisecondes par l’œil
Ce premier contact détermine l'intérêt de l'internaute pour le site

Il est important de veiller à l'équilibre de la page:

  • Balance entre les pleins et les vides: éviter les surcharges d’infos et d’éléments
  • Répartition des données: favoriser des zones claires d’information
  • Adéquation texte/image: être strict sur la pertinence des images

Il est important de veiller à la qualité des images:

  • Contrastes convenables des photos: vérifier les niveaux de luminosité 
  • Grain et précision: éviter les flous
  • Equilibre du nombre d'images: éviter d'alourdir la page
    Le temps de chargement d'une page dépent de la quantité et du "poids" des photos.
     
  • Optimisation pour le web: respecter les règles

L’utilisation des éléments de contenu Texte/Image dans Typo3 permet toutes sortes de permutations : il est toujours temps de changer les dispositions.
La simplicité et la clarté de la présentation assurera l’efficacité de la page.

Vérifier la page!

Faire le test d’eye-tracking pour vos pages !

L'oculométrie ou eye-tracking permet de suivre le parcours de l'oeil sur une page web et d'en donner une "carte"

En savoir+

Jared M. Spool et Matthew Klee: User Interface Engineering