fbpx
/ English
Carrousel Web

Carrousel Web : les avantages et inconvénients

Qu’est-ce qu’un carrousel Web ?

Le terme Carrousel Web ou bannière rotative (slider ou slideshow en anglais) désigne un diaporama dynamique présenté sur un site Web. Le carrousel peut contenir des images ou du texte. Les diapositives changent avec des effets de transition variés :

  • Déplacements horizontaux
  • Déplacement verticaux
  • Effet de fondu (fade),
  • Stores
  • etc.

Le carrousel peut être équipé d’une ou plusieurs systèmes de navigation :

  • Flèches
  • Points
  • Chiffres
  • Images miniatures
  • etc.

C’est un outil visuel courant souvent utilisé pour présenter des informations importantes rapidement. On le retrouve le plus souvent sur la page d’accueil, comme c’est le cas sur celle du site de Wenovio.

Exemple de carrousel Web

À l’image de la plupart des autres stratégies de présentation de l’information, notamment le parallaxe, le carrousel Web n’est pas parfait. Selon notamment votre public cible et votre image de marque, il pourra constituer ou pas une option intéressante.

Pourquoi ajouter un carrousel Web sur votre site ?

Du côté des avantages que présente le carrousel Web, on a d’abord une économie d’espace. Le slider permet de condenser l’information dans un espace restreint en faisant apparaître plusieurs messages l’un après l’autre. Cela permet de rentabiliser les espaces les plus vus par les visiteurs, notamment l’en-tête de la page d’accueil, ou bien de présenter rapidement des produits comparables. On pourrait penser par exemple aux items les mieux vendus dans une boutique en ligne :

Le carrousel Web d'Adidas

Ou bien le contenu à mettre de l’avant :

Le carrousel Web de Parsem

Dans un deuxième temps, le carrousel permet de varier la façon de présenter des contenus dans la page Web et ce, de plusieurs façons. D’abord, il constitue une pause dans le défilement vertical de la page en introduisant une navigation différente. Il ajoute aussi un élément animé ou interactif, ce qui attire l’attention. Enfin, en regroupant autrement des images et du texte, il dynamise la mise en page des contenus présentés. En introduisant une diversité de présentation, l’ajout d’un slider Web peut donc contribuer à conserver l’intérêt de l’internaute.

Le carrousel Web de Nike

Quels sont les désavantages du slider Web ?

Par contre, le slider présente des inconvénients non négligeables. Pour plusieurs créateurs de sites Web et experts de l’expérience utilisateur, il ne devrait même jamais être utilisé (en anglais)!

En premier lieu, il peut être une source de confusion pour l’internaute, surtout lorsqu’il est utilisé comme premier élément de la page d’accueil. En diffusant plusieurs diapositives, le carrousel Web envoie plusieurs messages au visiteur. Or, on souhaite que celui-ci comprenne la nature de votre entreprise immédiatement lorsqu’il atterrit sur votre site Web. Un message clair et unique est plus susceptible de transmettre les bonnes informations à votre client.

Un autre problème du carrousel vient de son côté dynamique : le mouvement peut faire en sorte que les messages véhiculés ne seront pas assimilés par vos clients. D’abord, comme les publicités sur le Web sont souvent animés, les internautes ont tendance à associer les éléments dynamiques à du contenu publicitaire et à les ignorer. Rapidement, vos clients pourraient donc juger votre slider non pertinent. Des problèmes peuvent être rencontrés aussi au niveau du temps de lecture : si le diaporama change trop rapidement, les internautes n’auront pas assez de temps pour lire tout le contenu. Enfin, une personne pressée pourra tout simplement ne pas se rendre compte de la présence du slider et passer complètement à côté des contenus supplémentaires. Au final, le mouvement engendré par le carrousel Web est une lame à double tranchant au niveau de l’expérience utilisateur!

Enfin, le carrousel Web est un élément qui peut influencer négativement les performances de votre page Web. Étant composé généralement de grandes images (donc lourdes), il est néfaste pour le temps de chargement. Le site Pagepipe rapporte un délai de chargement additionnel de 1 à 2 secondes dans le pire des cas. Un long temps de chargement aura un impact défavorable sur l’expérience utilisateur de votre clientèle ainsi que le SEO de votre page. Un slider Web peut donc nuire de manière importante à la capacité de votre site Web à transmettre votre message à vos clients.

Quelques bonnes pratiques pour un carrousel Web optimal

Au-delà des avantages et des inconvénients, tous les carrousels Web ne s’équivalent pas. Plusieurs facteurs sont à considérer pour s’assurer que le slider atteigne les buts recherchés :

Présenter le contenu le plus important sur la première diapositive

Tel que mentionné précédemment, un internaute pressé ne verra probablement que la première diapositive de votre slider Web. Selon une étude menée par Erik Runyon, un développeur Web de l’université Notre Dame aux États-Unis, la majorité des clics sur un slider se font sur la première diapositive (en anglais). Il est donc primordial que l’information la plus importante s’y trouve!

Se contenter de 3 ou 4 diapositives

L’intérêt de vos clients diminue avec le temps. Il est donc préférable de minimiser le nombre de diapositives présentées dans votre carrousel Web.

S’assurer que le slider Web est bien structuré

Pour faire en sorte que votre carrousel Web soit optimal côté SEO et accessibilité, utilisez les bonnes balises de texte (titres et paragraphe) et complétez les attributs alt pour chacune des images.

S’assurer que le carrousel Web soit responsive

L’utilisation des appareils mobiles étant de plus en plus répandue, assurez-vous que le type de slider que vous utilisez soit responsive. De cette façon, vous garantissez une expérience utilisateur agréable à chacun de vos clients.

Donner le contrôle aux internautes

Finalement, choisissez un slider que peut être contrôler par les internautes. Cela peut être fait à l’aide de flèches ou d’une pagination (points ou chiffres). Ainsi, ceux-ci pourront à leur guise avancer ou revenir dans le contenu, ce qui aura un impact positif sur leur expérience de navigation.

Toute une équipe pour vous conseiller

Au final, il est important de se questionner sur la place et la fonction d’un carrousel Web sur votre site Web afin de garantir une expérience utilisateur intéressante pour vos clients. Chez Wenovio, vous pouvez compter sur une équipe de professionnels aux talents variés qui pourront vous conseiller à chacune des étapes du déploiement sur le Web de votre entreprise. N’hésitez pas à nous contacter!

Auteur de l'article

Émilie Demers Moreau

Designer graphique
Diplômée de l’École de Design de l’UQÀM depuis 2011, Emilie aime jouer avec formes et couleurs pour construire des images qui vous ressemblent. Son sens aiguisé de l’analyse et son œil graphique lui permettent de répondre précisément aux besoins de ses clients, que ce soit à l’imprimé, sur le web ou lors de présentations numériques. Curieuse de nature, elle est constamment à la recherche de nouvelles façons de vous faire rayonner.

À découvrir sur notre blogue

2021-03-21

Images Web : quels sont les formats à utiliser ?

Émilie Demers Moreau / Designer graphique

Les images sont au cœur de la création de votre site Web. Effectivement, ils contribuent à l’établissement de votre image de marque.

Lire la suite
2020-02-18

Pourquoi créer mon site avec WordPress ?

Émilie Demers Moreau / Designer graphique

Les avantages de créer un site avec la plateforme open-source WordPress sont nombreux. Nous vous expliquons pourquoi!

Lire la suite
2021-06-15

8 obstacles qui font grimper le taux de rebond sur votre site Web

Dominique Thomas / Traductrice agréée et réviseure agréée

Votre site Web affiche un taux de rebond élevé? Découvrez ce qui incite les visiteurs à quitter votre site Web et des conseils pour leur donner envie de rester.

Lire la suite
2020-11-08

Erreur 404 : comment corriger sur un site WordPress ?

Vincent Gaudreau / Programmeur Web

L’erreur 404 signifie que la page est introuvable. C’est important de corriger une erreur 404 dès que possible.

Lire la suite

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.