Animation sur la page d’accueil

Vous rappelez-vous de l’époque où il fallait regarder une animation Flash avant d’accéder à la page d’accueil d’un site web? C’était l’époque où les directeurs artistiques avaient le feu vert pour s’éclater. Par contre, les internautes haïssaient ça. Avec le temps, les responsables des sites web ont vu la lumière et ont fait disparaître ces pages d’introduction (« splash page »). Aujourd’hui, on ne les retrouve que dans les livres d’histoire et dans quelques sites d’agences de publicité.

La nouvelle mode est d’animer les pages d’accueil avec d’immenses images qui prennent presque tout l’écran d’un ordinateur portatif et qui changent à toutes les 5 secondes. C’est le nouveau canevas pour les directeurs artistiques à la recherche de trophées. Malheureusement, ces animations diminuent l’ergonomie et contribuent bien peu aux objectifs des sites web.

Principes de base

Dans la conception d’une page d’accueil, deux ressources sont rares :

• L’espace à l’écran est limité et ce qui est utilisé par un élément de la page n’est plus disponible pour les autres.
• L’attention du visiteur est limitée. Quand une section de la page attire l’attention du visiteur, elle disparaît pour le reste de la page.

La conception de la page d’accueil est un art qui consiste à utiliser à bon escient ces deux ressources pour maximiser les objectifs du site web. Quand une page affiche de grosses images, l’espace à l’écran est d’autant réduit pour les autres éléments de la page. Quand une image est animée, celle-ci capte l’attention du visiteur et réduit l’attention qu’il portait aux autres éléments de la page.

Que font vos visiteurs sur la page d’accueil de votre site web?

Êtes-vous déjà allé sur un site web parce qu’un ami vous a vanté l’animation de sa page d’accueil? Êtes-vous déjà retourné sur un site car elle avait de belles images? À moins que les images soient l’attrait principal du site (mode, vedettes, contenu adulte, etc.), la réponse est probablement jamais.

Les pages d’accueil ne sont pas des panneaux publicitaires ou des enseignes de néon. Elles sont une carte qui révèle le contenu important de votre site. Quand un internaute arrive sur votre page d’accueil, ses yeux balaient l’écran pour déterminer si votre site mérite son attention, puis pour cliquer sur un lien qui pourrait l’intéresser. Pendant cette période critique, il est important de ne pas déranger votre visiteur avec une animation ou du son.

Dr. Jakob Nielsen dit de ne pas le faire

Le Dr. Jakob Nielsen est un des grands gurus en conception d’interfaces utilisateur (ergonomie). Dans un de ses articles très médiatisé: “'Top Ten Mistakes in Web Design”, il écrit (ma traduction):

Ne jamais inclure sur une page des éléments qui bougent sans arrêt. Les mouvements ont un effet très puissant sur la vision périphérique de l’humain. Une page web ne doit pas émuler Times Square à New York City dans son agression constante des sens: laissez votre visiteur lire tranquillement votre texte!

Des exceptions?

Le Dr. Jakob Nielsen vit dans un monde blanc et noir et fait peu dans la dentelle. Or dans certaines situations, il est désirable d'attirer l'attention du visiteur vers une zone de la page d'accueil. Par exemple, sur un site de nouvelles, on veut mettre en évidence les dernières nouvelles. Une autre exception est le site dont les visiteurs reviennent fréquemment et qui connaissent très bien la page d'accueil (Intranet). Dans ce cas, une animation peut aider à diriger le regard vers le nouveau contenu.

Faisons un compromis

Les grosses images en rotation sur les pages d’accueil me dérangent de deux façons :

• Elles me font perdre ma concentration alors que je balaie l’écran à la recherche d’un lien intéressant à suivre.
• Il est impossible de mettre l’animation sur « pause ». Parfois, l’animation est tellement rapide que je n’arrive même pas à déchiffrer le message dans l’image.

Pourtant, ces gens qui mettent des animations sur les pages d’accueil sont intelligents. Leur argument est que ceci va rehausser l’expérience utilisateur et renforcer l’image de la marque. C’est un argument valide dans d’autres média (publicité traditionnelle) mais pas sur le web où les internautes sont notoirement impatients et à un clic de la compétition.

Un bon compromis serait de remplacer l’animation dans la page par une image qui ne change qu’à chaque chargement de la page. Cette façon de faire améliore aussi le temps réponse de la page. De plus, des boutons pourraient permettre au visiteur de visionner la prochaine image et la précédente.

S’il faut « absolument » une animation, il faudrait que le délai soit d’au moins 15 secondes entre les images et qu’il soit possible de mettre en pause l’animation.

Vous ne savez plus quoi faire? Alors pourquoi ne pas tenter les deux approches et de valider la réaction des visiteurs. Google Analytics permet de faire des tests A/B afin de déterminer la meilleure version entre deux pages.

Que vous soyez d’accord avec moi ou que vous croyiez que je suis complètement dans le champ gauche, j’apprécierais avoir votre opinion. Laissez-moi un commentaire.

Cet article pourrait vous intéresser : De Gerry McGovern: Are marketing images damaging your brand?

Mise à jour du 2010-11-20: Suite à la quinzaine de commentaires sur LinkedIn, Facebook et en personne, j'ai décidé d'ajouter quelques nuances et précisions au texte.