Abandonnez les carrousels car ils ne fonctionnent pas

Aviez-vous remarqué qu’en quelques années les carrousels avaient envahi quasiment l’ensemble des sites de média et des boutiques en ligne ? Les carrousels sont ces énormes blocs où des extraits de contenus défilent, comme un ruban horizontal. S’ils sont bien pratiques pour faire rentrer toute l’actualité et les promos, leur principal intérêt est de pouvoir « donner vie » à un site. Je ne savais qu’il y avait des sites vivants et d’autres morts. Je ne savais pas non plus que les internautes refusaient de visiter les sites statiques où « il n’y a pas de vie ». Bref, j’ai comme l’impression que la profession a adopté les carrousels sans trop se poser de question. Pourtant, ces éléments d’interface soulèvent de nombreuses questions :

  • Le principe de défilement horizontal est-il simple à utiliser ?
  • Les différents panneaux qui se succèdent fournissent-ils une information précise sur le contenu du site ?
  • Les couleurs vives, titres racoleurs et animations ne font-ils pas trop ressembler les carrousels à des bannières ?

Bref, la question est de savoir si l’énorme place attribuée aux carrousels en page d’accueil, au détriment des autres éléments, est justifiée. Et visiblement la réponse est : Non ! Il y a en premier lieu le gros problème d’utilisabilité de ces panneaux qui défilent : le temps que les internautes lisent le message affiché et prennent la décision de cliquer, c’est un autre panneau qui s’affiche (The Unstoppable Carousel).

Ceci étant dit, les principaux points de vigilance de l’utilisabilité des carrousels ont déjà été identifiés : 5 Big Usability Mistakes Designers Make on Carousels. Si vous êtes à la recherche d’un bon exemple, le portail de la BBC semble avoir respecté tous ces points :

Le carrousel de la BBC
Le carrousel de la BBC

Le carrousel est parfaitement identifié en tant que tel (« Top News Story« ), le point orange indique le nombre de panneaux ainsi que le panneau actif, des flèches permettent de basculer plus rapidement sur les autres panneaux. Le survol avec la souris permet de mieux comprendre son fonctionnement :

Le carrousel de la BBC survolé avec la souris
Le carrousel de la BBC survolé avec la souris

Le bouton Play/Stop afficher un plein milieu permet d’arrêter le défilement et les vignettes sur les flèchent servent à anticiper les prochains contenus. Ce carrousel est donc un modèle du genre, qui fonctionne parfaitement sur un site média, mais qui n’a pas forcément sa place sur une boutique en ligne.

Très largement utilisés sur la page d’accueil des boutiques en ligne, les carrousels se révèlent pourtant très encombrants et pas forcément efficaces : Don’t Use Automatic Image Sliders or Carousels, Ignore the Fad. Les différents tests réalisés sont sans appel : les carrousels sont soit ignorés, car confondus avec des bannières, soit ils monopolisent l’attention d’utilisateurs hypnotisés par le mouvement des panneaux sans réellement retenir les messages. Des observations confirmées par cette discussion entre professionnels : Are carousels effective?.

Les carrousels ne méritent donc pas la place qu’on leur accorde. Mais alors pourquoi les retrouve-t-on partout ? La réponse semble se trouver dans cet article : Carousels on ecommerce sites, are they worth bothering with?. La raison pour laquelle les carrousels sont si populaires est qu’ils permettent de faire rentrer autant de promotions que possible et d’éviter ainsi des conflits internes sur la priorité à donner à telle ou telle opération.Cette raison peut vous décevoir, mais en tout cas elle ne me surprend pas réellement. De nombreux choix de conception sont ainsi guidés par l’ego ou sont le fruit de compromis pour éviter des gue-guerres internes.

Ce qu’il faut retenir de ces différents écrits et discussions est que des blocs de promotion ou de mise en avant statiques sont bien plus efficaces qu’un carrousel. Il va donc falloir vous armer de courage pour convaincre vos collègues d’abandonner cette « norme », au même titre que la règle des 3 clics. Pour se faire, le meilleur moyen est de vous appuyer sur des statistiques : placez un marqueur sur le carrousel suffira à démontrer un taux de clic très faible. Sinon vous pouvez également argumenter sur le fait que les gros sites de commerce en ligne comme Soap, Zalendo ou MisterGoodDeal n’utilisent plus les carrousels.

25 commentaires pour “Abandonnez les carrousels car ils ne fonctionnent pas”

  1. Posté par Patrice a dit : le

    Réflexion très intéressante mais toutefois par expérience, un carrousel peut avoir son intérêt sur un site e-commerce. Pour l’avoir testé, il en est ressorti un bon taux de clic, une augmentation des pages vues et donc d’un meilleur taux de rebond. Je pense que tout dépend de la thématique du site. Et il y a également un autre avantage en terme de référencement naturel si l’outil est convenablement codé, ce qui est un avantage indéniable en terme de conversion, facteur essentiel à tout site e-commerce. Dans le même ordre d’idée, vous citez Zalendo et ce dernier possède un énorme carrousel en page d’accueil.
    Merci pour cet article qui soulève toutefois un problème épineux à tout ergonome digne de ce nom.

  2. Posté par Jean-Michel DAIX a dit : le

    Article volontairement provocateur ou vrai constat ? Lorsque vous parlez de taux de clic faible, à quel pourcentage faites vous référence ?

  3. Posté par Pipaul a dit : le

    En tant qu’utilisateur, je confirme que je ne regarde jamais ces blocs imposants.

  4. Posté par Floyd a dit : le

    Je confirme l’article ! Sur Topito, on a A/B testé avec et sans carousel, et les taux de clics ont augmenté de 120% sans carousel.

    RIP

  5. Posté par ropib a dit : le

    La question n’est pas de savoir si une promotion est cliquée ou non mais si elle permet ou non d’amener le client à faire des achats, une fois évidemment mais surtout qu’il revienne. Je ne suis pas certain que le taux de clic sur la promotion vers un produit sur lequel on fait le moins de marge par exemple soit une mesure vraiment correcte de son efficacité.
    L’explosion visuelle de tarifs avantageux en page d’accueil peut être aussi une bonne stratégie (même si le message de chaque promotion passe mal : le message c’est l’explosion d’occasions à saisir), mais ça peut aller à l’encontre d’une image de marque. La page d’accueil actuelle de MisterGoodDeal qui essaye d’allier les deux avec une approche meta, avec la mise en avant de la conscience du côté kitsch de l’explosion de promotions avec une référence à l’âge d’or est un bon exemple : c’est laid, si ce n’est pas mort ce n’est pas très vivant non plus, ça ne donne pas envie (ou je ne suis pas la cible, c’est envisageable).
    « Je ne savais qu’il y avait des sites vivants et d’autres morts. » Et pourtant ça existe bel et bien sur certains sites qui, pour une raison ou pour une autre, ont une clientèle de par leur connaissance des produits mais dont aucune adhésion ni satisfaction ne peut être attendue.
    Le carrousel a une utilité dans un certain nombre de cas. La facilité de mise en œuvre et d’y ajouter des promotions rapidement explique une éventuelle surestimation de cet objet. Mais il faut bien comprendre aussi que ce genre de solution toute faite sans aucune réflexion de la part de l’acheteur a son utilité : parfois il n’est absolument pas envisageable de payer plusieurs jours de conseil pour optimiser la promotion. Disons que le carrousel rentre dans une panoplie de conseil low-cost, mais attention à mettre les bonnes métriques pour justifier des prix plus élevés sur d’autres techniques.

  6. Posté par oups a dit : le

    orly ? qui l’eu cru ? prévisible en même temps le web c’est actif .. le caroussel c’est du passif …

  7. Posté par Mxmas a dit : le

    Encore une fois le problème n’est-il pas le contenu que l’on met dans ces bandeaux ? Ne sommes-nous pas (toujours) liés à des contraintes techniques et de mise à jour : 1 texte 1 image 1 lien ? Plutôt que d’accuser le support ne devrait-on pas considérer la pauvreté d’un carrousel comme étant le reflet d’une misérable communication ?

  8. Posté par Martin a dit : le

    Fonctionnent-ils, ne fonctionnent-ils pas ? Je n’ai pas parcouru les statistiques comparatives de mes sites, mais voici mon sentiment sur le sujet.

    Tout d’abord, enchaîner les promotions ou actualités en boucle n’a aucun sens. Forcément, ce sera ignoré, quel que soit le contenu. Forcément, les boutons lecture/pause/arrêt sont sans intérêt. Cela ne fait pas partie d’une ergonomie optimale. En effet, on impose un moment où certaines informations sont affichées, ou qu’elles ne sont plus disponibles. Tenter de placer plus d’informations sur la page déjà chargée est contraire au bon sens : notre cerveau n’est plus capable de traiter autant d’informations, et même si cela avait été le cas, cela supposerait que nous surfions en y faisant lourdement appel, ce qui, je le crains, n’est que très exceptionnellement le temps.

    En revanche, sur une page peu chargée, un carousel préominent, mais au contenu textuel léger et des images captivantes, me paraît une bonne démarche. Notre attention est alors attirée par l’animation, et la durée d’affichage permet de faire passer un message simple de manière efficace. On peut ainsi présenter, comme dans une émission de télévision, de manière passive, sans interaction de la part de l’Internaute, des messages, tant qu’ils ne réclament pas une forte attention pour être vus et compris. C’est idéal, je pense, sur une page d’accueil avec la présentation très succincte d’une entreprise, par exemple.

    Maintenant, c’est comme tout : il ne faut pas en abuser, et les textes et images statiques ont encore de beaux jours devant eux. Ils permettent en effet une meilleure concentration sur le contenu.

  9. Posté par Frédéric Cavazza a dit : le

    @ Patrice > La question du référencement est très importante, même si pas abordée dans mon article. Bon d’un autre côté, je trouve étrange de s’appuyer sur des promos pour s’assurer un bon référencement.

    @ Jean-Michel DAIX > J’exprime ma conviction. Après ça, je me refuse à fournir des statistiques génériques qui n’apportent rien au débat. L’important est de tester dans votre contexte.

    @ ropib et Mxmas > Alors là tout à fait : implanter un carrousel sur sa page d’accueil, c’est se forcer à bombarder des promotions, donc à pervertir la relation client (les internautes ne réagissent plus en dessous d’un certain seuil de réduction).

    @ Martin > Certes, il est tout à fait possible de créer des carrousel parfaitement intégrés à la page et qui ne clignotent pas, d’ailleurs c’est ce que faisait Apple. D’un autre côté, je privilégierais le séquençage des promotions (une à la fois), plutôt que l’accumulation (qui rend les internautes schizophrènes).

  10. Posté par JU a dit : le

    J’ai regardé les sites (dernier paragraphe) :
    à rectif, zalondo, utilise encore un carrousel. (ou je suis peut être tombé sur le B du A/B :)

    gooddeal, vu ces blocs promos qui se bataillent entre eux (tout est mis en valeur et donc rien n’est mis en valeur) je me dis tient justement voilà un endroit ou le carrousel serait très utile. On case toutes les promos pour faire plaisir en interne par ex., et elles passent en grand (ces blocs sont rikiki en plus d’être diificle à lire) et une /une. On peut pas faire mieux. Reste plus que la bataille pour classer l’ordre de passage, mais on pourrait introduire un carrousel aléatoire pour régler le soucis :)

  11. Posté par Patrice a dit : le

    @ Frédéric :Justement, je n’ai pas parlé de promotions dans un carrousel pour le référencement. Par expérience, je parlais de produits mis en valeur pour le prospect et donc pour les robots des moteurs de recherche. Il serait étrange en effet de s’appuyer sur des promos pour avoir un bon référencement :)

  12. Posté par Nicolas Richer a dit : le

    On parle beaucoup de e-commerce mais j’ai des clients qui me demandent des carrousels sur des sites vitrines également. Alors là il n’est plus question de promotions, ils veulent mettre différents éléments de navigation alors qu’ils sont déjà présents dans la barre de navigation !

    Je rejoins l’avis général : les carrousels c’est du quart de visibilité voire moins encore, à part un côté promo ou mise en valeur d’un produit dans le cadre du e-commerce, son utilisation doit être vraiment modérée.

  13. Posté par Webmarketlab a dit : le

    J’ai lu avec beaucoup d’attention l’article. En effet les carrousels ont envahi les sites web. Et je trouve ça bien (en tant qu’utilisateur et professionnel). De mon côté, à chaque fois que j’ai mis en place des carrousels (hors site ecommerce), les résultats étaient plutôt bons.

    Attention Frederic, sur Zalendo, on a en première page un carrousel :-)

  14. Posté par Alexarn a dit : le

    Question :
    Le parallax scrolling peut il remplacer le carrousel sur un e-commerce ?
    Peut il obtenir de meilleurs performances ?
    Même s’il n’est que très peu utilisé encore en e-commerce, certains sites le font (cf : harrods).

  15. Posté par Frédéric Cavazza a dit : le

    @ Alexran > Le parallax scrolling est un mode d’affichage que l’on peut difficilement comparer aux carrousel. Ceci étant dit, c’est une exercice terriblement dangereux pour un site grand public, surtout comme dans le cas Harrods où il est piètrement mis en oeuvre (pas intuitif pour un sou). Tiens ça me donne une idée d’article, merci !

  16. Posté par Frank Seidel (@AdieuArcheB) a dit : le

    Merci Frédéric d’avoir assemblé toutes ces sources anglophones. Pour compléter voici une étude allemande qui contient aussi des images heat map issues d’une étude eye-tracking http://www.usability.de/publikationen/studien/themenbuehnen.html. L’étude arrive d’ailleurs au même résultat que les études anglophones.

    Je pense qu’un point essentiel dans ce débat est l’énorme quantité de place sur la page d’accueil qui est habituellement occupée par un carrousel. Souvent c’est quasiment l’intégralité de l’espace disponible au dessus de la ligne de flottaison hors navigation générale. Pour un outil où l’on peut manifestement rater tellement de choses sur un plan ergonomique et que 70% des utilisateurs ignorent (selon l’étude allemande ci-dessus), c’est insensé d’y dédier autant de place au détriment d’autres éléments.

    Je suis convaincu que la raison majeure pour la popularité de cet outil n’est pas sa performance, mais sa capacité a calmer les différents responsables de produit parce qu’il permet de dire: « Qu’est-ce que tu veux ? Ton produit est bien sur la page d’accueil ! »

  17. Posté par Alexarn a dit : le

    @ Frédéric : Difficilement comparable certes, mais d’une certaine manière, il permet lui aussi un affichage multiple en HP. J’attends l’article avec impatience ! En espérant que d’une manière ou d’une autre, le parallax pourra arriver sur un ecommerce, s’il est bien mis en oeuvre. On y tient particulièrement pour notre prochaine refonte 😉

  18. Posté par Baptiste Legrand a dit : le

    Globalement d’accord avec le point de vue de l’auteur. Un bémol cependant : dans certains contextes, un carrousel est 1) diablement efficace et 2) parfaitement indispensable.

    Typiquement, sur une page présentant un produit ou un service, un carrousel devient un excellent moyen de parcourir les 4 ou 5 points clés qui font l’intérêt du produit / service. Personnellement, cela me permet de me faire une idée rapide de ce que propose l’objet considéré, et me permet de m’attaquer aux explications détaillées avec une bien meilleure compréhension.

    Par contre, un carrousel sur un site éditorial ou un site e-commerce, l’intérêt me semble en effet plus discutable. Si en plus c’est corroboré par des taux de clic (et des taux de transfos) décevants…

    Donc mon point de vue : tout dépend du contexte et de l’utilisation que l’on en fait, mais le jeter aux orties trop rapidement peut être une décision hâtive.
    Comme toujours, l’essentiel est de ne pas le choisir « parce que c’est la mode et que ça fait cool », mais bien parce que ça permet de répondre aux objectifs ou à un besoin fort de l’utilisateur final.

  19. Posté par Erwan Le Balc'h a dit : le

    Article intéressant, merci. Les carrousels ne sont en effet pas la solution miracle pressentie il y a quelques années en matière de e-commerce. Et pourtant, dans quelques cas de figure, ces objets sont intéressants pour faire passer des messages. A ce titre, il ne faut pas en considérer que la conversion directe par le prisme du seul taux de clic.

    Exemple : quelques promotions bien choisies avec des produits représentatifs, qui répondent à une vraie demande et assortis de taux de promo très conséquents peuvent donner au visiteur l’impression qu’il est sur le bon site, même s’il ne clique pas sur un des produits sélectionnés dans le carrousel.

    Autre exemple : quelques visuels bien choisis sur les destinations phares d’une agence de voyage spécialisée sur un secteur géographique donné peuvent éclairer le visiteur sur la qualité d’un catalogue.

    Dernier exemple donné ci-dessus par Baptiste Legrand : un carrousel peut permettre d’expliquer le fonctionnement d’un produit ou service de façon ludique et efficace.

    En règle générale, il faut néanmoins faire attention à la taille de ce carrousel pour qu’il laisse respirer les autres éléments importants de la home au dessus de la ligne de flottaison.

  20. Posté par XIV a dit : le

    A croire que les wemasters de sites cités en fin d’article vous ont entendu: ils ont tous réjouté un carroussel en page d’accueil