Formation CRO gratuite

Accéder aux ressources gratuites 👉
5 cours vidéos
3 check-lists UX/CRO
1 guide CRO chaque vendredi
Continuer de lire

Florent Kiecken

2/9/2020

Dernière MAJ :

19/4/2024

E-commerce : 40 bonnes pratiques pour l’UX et les conversions

Si vous souhaitez apprendre à optimiser l'UX et les conversions de votre e-commerce, vous pouvez accéder à nos 5 cours vidéos sur le CRO gratuitement.

Accéder aux cours vidéos

5/5

Développer un site e-commerce qui fonctionne en matière d’expérience utilisateur et de taux de conversion n’est pas évident. Il est important de comprendre quels sont les standards de conception et de design pour optimiser sa navigation. Nous allons voir dans cet article quelles sont les pratiques à respecter pour un site e-commerce qui fonctionne.

Éviter les éléments graphiques complexes

Google a réalisé une étude démontrant que les sites ayant un retour visuel complexe se disaient moins “beaux”. Plus un site est visuellement simple et clair, plus l’utilisateur le trouvera attrayant.

Un site e-commerce doit donc être à la fois reconnaissable grâce à l’image de marque et à la charte graphique mais doit aussi être assez simple pour ne pas gêner l’utilisateur dans sa navigation. L'objectif ici est de ne pas abuser des éléments graphiques qui n’ont aucune utilité. Le design doit avant tout permettre aux utilisateurs d'interagir avec le site e-commerce de la meilleure des façons.

C’est assez logique en soi. Un web design complexe demande au cerveau et aux yeux plus d’efforts et d'énergie. Ce qui peut rapidement gêner l’utilisateur. C’est la raison pour laquelle les designs plus épurés prônant le ‘’less is more’’ seront en général plus efficaces et plus appréciés par les utilisateurs.

Attention donc aux variations de couleurs trop violentes, aux dégradés trop présents, aux éléments graphiques, aux icônes, etc.

La hiérarchie visuelle doit être en lien avec l'information

La taille des textes doit être relative à l’importance du propos. Plus un élément va être volumineux, plus il va attirer l'œil naturellement. Il est donc important de systématiquement penser ses contenus de cette manière.

De la même manière, les éléments situés en haut des pages seront considérés pour les utilisateurs comme plus importants. Faites donc attention à la hiérarchie visuelle de votre contenu.

Pour la page d’accueil de votre e-commerce par exemple, veillez à placer les éléments les plus importants selon les utilisateurs tout en haut de la page. Sachez que rares sont les utilisateurs qui scrollent jusqu’au bas de page.

Veillez donc à placer en premier, en haut de page, des éléments comme les principaux CTA, la proposition de valeur, le logo, le menu de navigation bien sûr, etc.

Hiérarchisation visuelle

La proposition de valeur doit se trouver en première position  

La proposition de valeur doit être accessible et lisible sans scroller. Cette première grande section de la page d’accueil de votre e-commerce est le point de départ de l’utilisateur moyen. C’est la partie où l’utilisateur n’a besoin de rien faire pour y avoir accès, il ne doit pas scroller ou cliquer sur un lien.

Sachant que la proposition de valeur est un des éléments les plus importants de votre site e-commerce et même de votre marque dans sa globalité, il est donc crucial de placer la “value proposition” en avant.

La proposition de valeur décrit vos objectifs, ce que vous faites et ce que vous apportez aux utilisateurs. En attirant l’attention sur celle-ci dès le départ, vos utilisateurs auront plus de chances de poursuivre leur navigation car ils savent clairement ce que vous proposez.

proposition de valeur Stripe

Attirer l'oeil vers le menu de navigation

Le menu de navigation est un élément essentiel d’un site e-commerce et notamment sur la page d’accueil. Celui-ci se doit présenter les liens permettant d’accéder aux différentes pages principales du site web. Mais pour cela, il faut que le menu se remarque assez et qu’il ait une accessibilité optimale.

Pour cela, le menu doit se démarquer visuellement, grâce à une ombre portée, un fond en particulier, des couleurs spéciales, etc. Aussi, il est préférable de laisser le menu de navigation accessible lorsque l’utilisateur scroll la page, en insérant un effet “sticky”.

Le menu doit donc être accessible facilement et rapidement en plus d’être correctement visible.

Utiliser l'espace blanc/vide

Pour que le contenu du site soit clair, hiérarchisé et directement compréhensible, l’espacement doit être géré correctement.

Lors du design des pages d’un site e-commerce, l’espace vide est particulièrement important si vous souhaitez que vos utilisateurs ne soient pas submergés par un amas de contenu. L’espace blanc permet de donner un minimaliste pratique permettant de ne pas surcharger vos pages d’informations directement.

Pour séparer visuellement votre contenu de la bonne manière, plusieurs choses peuvent être travaillées :

  • Ajouter des bordures, des traits entre vos éléments pour les séparer
  • Utiliser des images pour marquer les sections et créer des catégories d’éléments
  • Créer des tableaux pour regrouper les éléments
Cos white space

Le CTA doit ressortir et être visible

Le CTA (call to action) est un des éléments de votre page d’accueil, de vos fiches produit et de l'ensemble de votre e-commerce les plus importants. C’est par ce bouton d’appel à l’action que les utilisateurs vont “convertir”.

Un bon CTA est un bouton visible qui contraste sans pour autant gêner la navigation. Pensez à cela afin de vous assurer que votre CTA est assez visible :

  • Créez un bouton assez grand et tout en haut de la page d’accueil
  • Créez un fort contraste entre le bouton et le fond
  • Entourez le CTA d’un espace vide
  • Évitez les graphiques concurrents qui peuvent devancer le CTA visuellement
  • Évitez d’implémenter d’autre de CTA différents
CTA

Afficher les promotions, produits populaires, etc

Afficher les promotions, les nouveautés, etc. directement sur la page d’accueil est particulièrement efficace. Que ce soit avec des carrousels ou autres, ce genre de produit mis en avant permet de servir d’appât et d’encourager les utilisateurs à cliquer.

Mettez donc en avant directement sur votre page d’accueil les produits les plus populaires, les produits phares et les nouveautés. Bien sûr, ne mettez pas en avant un seul produit, certains utilisateurs pourraient penser que vous ne vendez qu’un seul produit.

Proposer des images de qualité

Les photos de qualité sont bien évidemment plus puissantes en matière de conversion que des photos bas de gamme. Une image de mauvaise qualité en dit long sur la marque. Cela reflète un manque d’investissements sur la présentation des produits. Si la marque ne soigne pas les images de son site, qu’en est-il du produit en question.

L’un des investissements les plus judicieux que vous puissiez faire pour votre e-commerce est la photographie. Plus une image va être détaillée, précise avec un joli rendu, plus elle sera attrayante aux yeux des utilisateurs.

Même avec peu de connaissances en photo, vous pouvez très bien avec un smartphone de dernière génération, créez des photos qui font le travail. Evitez donc les photos génériques que vous trouvez sur Google image ou autres et investissez pour faire vos propres photos de qualité.

Photographie

Utiliser des Images avec du contexte

Un point souvent négligé par les e-commerçants. Imaginez une photo d’une table sur fond blanc. La photo peut être de bonne qualité, certes, mais l’utilisateur pourra se poser de multiples questions.

Imaginez maintenant une photo avec la table en question avec des personnes autour de la table partageant un repas. On a donc sur la table des verres, des couverts, des plats, etc.

Sur cette photo, l’utilisateur peut observer qu’il y a de la place pour X personnes, qu’il y a de la place pour X assiettes, X plats, etc. L’utilisateur peut donc se projeter et prendre conscience de la taille réelle de la table.

Vous comprenez donc, une fois mis e n contexte, les utilisateurs peuvent de visualiser avec le produit. Ils comprendront plus facilement son utilisation des aspects qu’ils n'auraient pas pris en compte sans la mise en contexte.

Ikea

Minimiser le nombre de mots

Nous sommes dans une aire où les gens veulent de l’information rapidement. La durée d'attention moyenne sur le web est très faible. Des études ont montré que la durée d’attention n’est que de 8 secondes. Et c’est encore plus le cas pour des nouveaux visiteurs qui n’ont jamais entendu parler de vous.

L'objectif est donc d'aller droit au but sur la page d'accueil de votre e-commerce. Faites simple, sans détails inutiles.

Les phrases courtes sont en général plus efficaces car elles semblent moins engageantes.

En général, il ne devrait pas y avoir plus de 80 caractères par ligne.

Les paragraphes courts (3-4 lignes maximum) facilement la lecture et la lisibilité. Les gros pavés de textes sont intimidants.

Eviter les mots trop techniques et le jargon

En général, les utilisateurs n’en n'ont rien à faire que vous leur apprenez des mots nouveaux et que vous enrichissez leur vocabulaire. Les mots techniques doivent être utilisés seulement si cela est nécessaire. Les utilisateurs veulent avoir l’impression de votre contenu texte a été écrit pour eux.

Même si vous avez un public spécialisé, rien ne sert d'utiliser des tournures de phrases complexes afin d'impressionner. Cela ne sert à rien sauf à perdre vos visiteurs.

Choisir entre utiliser “vous” ou “mon”

Vous cherchez peut-être à savoir quand utiliser “vous” et quand utiliser “mon” dans votre contenu. Utiliser “mon compte” ou “votre compte”.

Et bien, il n’y a pas de règles universelles concernant cela mais quelques règles générales.

Utilisez “mon” lorsque vous souhaitez insister sur la personnalisation, la propriété, la confidentialité.

Utilisez le “votre” lorsque vous décrivez quelque chose, lorsque vous posez une question et lorsque vous parlez de quelque chose d'extérieur, de global.

Vous pouvez aussi très bien n’utiliser aucun des deux et utilisez seulement “compte” par exemple. Dans tous les cas, veillez à choisir un point de vue et de vous y tenir.

Eviter les phrases trop génériques et robotiques

Ne soyez pas dans le flou et ne copiez pas les phrases génériques des autres. N’écrivez pas “livraison rapide” mais plutôt “livraison dans sous 6 jours”, n’écrivez pas “achetez en toute confiance” mais plutôt “achetez sous sécurité https et réglementation.”

L'objectif ici est d’être le plus précis possible. Dès que vous avez l’opportunité d’apporter de la précision, faites-le. Soyez spécifique, détaillé et ne donnez pas des phrases banales aux utilisateurs.

Gardez un équilibre, apportez de la précision sans pour autant être trop technique dans votre approche.

Avoir une cohérence au niveau du ton

Sachez que les utilisateurs captent assez facilement le ton et la manière dont s’exprime une entreprise sur ses pages web. Les tons décontractés, conversationnelles et parfois drôles sont une bonne façon de créer de la proximité avec vos utilisateurs. Ils seront plus à l’aise à vous lire et à naviguer sur votre e-commerce.

Attention seulement, ce ton léger ne fonctionne pas forcément pour toutes les entreprises. Pour les entreprises un peu plus carrées et professionnelles, les utilisateurs ont tendance à se méfier d’un ton trop léger dans un contexte sérieux (assurance, juridiction…).

Bien évidemment, le ton ne se résume pas à donner à votre texte un aspect plus cool et plus léger. Vous pouvez très bien avoir ton marqué qui soit très sérieux. Pour cela, il est important de garder un même vocabulaire, une façon de parler et de jouer sur d’autres aspects (leadership, élitiste, luxure ou autre).

Dans tous les cas, si vous avez une stratégie d’UX Writing et de ton au niveau de l’image de votre marque, appliquez-la sur chaque page de votre site web. Restez cohérents partout afin d’avoir une homogénéité dans votre discours et de ne pas perdre vos utilisateurs.

Éviter les erreurs de rédaction

Cela peut paraître évident mais la grammaire, l'orthographe, la syntaxe sont des éléments permettant à l’utilisateur de juger votre professionnalisme. Plus il y aura d’erreur à ce niveau-là, moins votre taux de conversion sera élevé.

La crédibilité sur le web consiste à rendre votre e-commerce professionnel, sérieux et digne de confiance. Le site web est souvent le premier point de contact entre l'utilisateur et vos business.

Dans un monde où les sites web contenant des arnaques sont récurrents, vous vous exposez à de gros risques en ne soignant pas l’orthographe de votre site et de vos pages produits. Travaillez donc avec soin le texte des pages de votre e-commerce afin de ne pas donner une mauvaise impression à vos utilisateurs. Pensez également au bouche-à-oreille, qui si votre site web a beaucoup d’utilisateurs, peut être fatal.

L’appel à l’action doit être lu et compris rapidement

L'objectif ici est d’aller droit au but. Vos utilisateurs doivent comprendre ce que vous proposez et la valeur que vous apportez. Ils doivent comprendre en moins de 5 secondes votre CTA.

Rien ne sert donc d’ajouter beaucoup de textes techniques à côté de votre bouton. Allez à l’essentiel dans votre proposition de valeur.

Expliquez en une formule :

  • ce que vous proposez
  • ce que vous apportez comme résultats
  • a qui votre produit est-il destiné

Si vous parvenez à mentionner tout ça en une phrase simple, alors vous avez fait le plus dur.

Concernant votre CTA pur, c’est-à-dire votre bouton, vous pouvez très bien intégrer des boutons plus longs que d’habitudes.

Par exemple au lien d’un simple “s’inscrire” écrivez “demandez une démo gratuitement”. Les boutons ne sont pas forcément constitués que d’un seul mot. Votre bouton peut être plus ou moins long, tant qu’il apporte des informations précieuses et qu’il décrit ce que l’utilisateur va obtenir en cliquant sur le bouton en question.

CTA

Indiquer en quoi votre offre et unique et en quoi vous résolvez les problèmes de vos clients

Le nombre d’e-commerces ne fait qu’augmenter et peu importe votre secteur, vous avez forcément des concurrents.

Pour vous différencier donc, il faut penser à la valeur que vous apportez et vous poser les bonnes questions :

  • Quel est l’avantage d'acheter chez vous ?
  • Quand les utilisateurs se rendent sur votre site, quel problème ils cherchent à résoudre ?
  • Comment vous résolvez ce problème ?
  • Qu’est-ce qui vous différencie de vos concurrents ?

Pour que vous puissiez sortir du lot et rendre votre site web attrayant, il vous faut mettre en avant des plus-values qui vous différencient. Cela peut être des petits boosts comme “livraison gratuite” ou “satisfait ou remboursé” ou encore “garantie de remboursement”.

Éviter les pubs et les contenus qui ressemblent à des pubs

Si votre site e-commerce contient trop de publicité venant gêner la navigation, ils peuvent facilement être dépassés et agacés. De plus, cela peut les écarter de l'objectif initial qui est de passer à l’action sur votre site web. Plus l’utilisateur mettra du temps à comprendre ce que votre site propose, plus les chances que l’utilisateur abandonne sa navigation sur votre site sont élevées.

Évitez donc les publicités et les éléments de design qui ressemble à de la publicité. Gardez en tête que vous avez un objectif avec votre site web et que tout autre élément secondaire peut potentiellement distraire vos visiteurs.

Posez-vous donc toujours la question qui est : cet élément contribue-t-il à ce qu’un utilisateur passe à l’action concernant l'objectif premier ?

Mettez en place un design moderne et pertinent

La confiance passe par le “beau”, la simplicité et la pertinence. Vous avez peut-être navigué sur un site web contenant quelques bugs. Qu’en avez-vous pensé ? Lui aviez-vous fait confiance ?

En général, les sites web avec un design peu actuel et des problèmes de cohérence dans leur design ne sont pas fiables. Pourquoi leur sécurité serait à jour alors que leur design ne l’est même pas ? Voilà comment les utilisateurs pensent.

Les utilisateurs veulent le meilleur du marché et le plus actuel. Et ça dans de nombreux domaines. Plus un site web a l’air actuel, plus les utilisateurs penseront intuitivement que le tunnel d’achat est lui aussi actuel (et donc sécurisé). Un e-commerce pertinent au niveau de son design est un e-commerce à qui on peut faire confiance.

Des éléments tendances en web design :

  • Les illustrations
  • Le minimalisme
  • Animations
  • Grandes images de qualité
  • Couleurs vives
Design Stripe

Éviter les images des banques d'images

Toutes les personnes travaillant dans le monde du web pourront vous dire à quel point les images libres de droits sur les sites web sont récurrentes. D’ailleurs, même les utilisateurs commencent à connaître ces fameuses images libres de droits qui sortent tout droit des banques d’images.

Si vous souhaitez communiquer l’authenticité sur votre e-commerce, évitez les images génériques que tout le monde utilise. Préférer des images réalisées par vous-même.

Imaginons qu’un utilisateur ait eu une mauvaise expérience avec une entreprise utilisant une photo des banques d’images. L’utilisateur assimilera inconsciemment la photo à une expérience négative. Si vous utilisez la même photo que l'entreprise en question, l’utilisateur aura un mauvais a priori concernant votre e-commerce.

Préférez donc des photos personnelles, même si elles ne sont pas parfaites qualitativement, vos utilisateurs sauront que vous ne vous cachez pas derrière des images banales. Ils vous feront beaucoup plus confiance.

Les images des produits doivent avoir un arrière-plan simple (blanc, gris, transparent)

Si vos utilisateurs se rendent sur votre page produit, ça n’est pas pour être dérangé par des éléments visuels inutiles. Évitez donc les arrière-plans chargés qui ne viennent apporter aucune pertinence à la photo. Priorisez les fonds simples avec une couleur unie. Cela permet aux acheteurs de se concentrer sur le produit et uniquement sur le produit.

Alors bien sûr, ne mettez pas de côté le contexte. Vous pouvez très bien proposer plusieurs photos, une où vous présentez votre produit de façon neutre avec un arrière-plan simple. Et d’autres avec des éléments de contexte ou de branding.

Les pages produits doivent fournir toutes les informations

L'objectif de la page produit est de fournir un maximum d’informations pertinentes sur le produit en question.

Vous devez donc fournir toutes les informations et précisions nécessaires que les utilisateurs peuvent potentiellement avoir besoin :

  • Les variations de produits (couleurs, tailles, etc.)
  • Les disponibilités des variations du produit
  • Plusieurs photos/vidéos
  • Options de zoom des photos
  • Description de l’utilisation du produit
  • Matière du produit
  • Les avis client

Mettre en place un système de notification par mail lorsque les produits en rupture de stock sont de nouveau disponibles

Sachez que les utilisateurs ne vérifient pas régulièrement si un produit est de nouveau disponible sur un site. Il est plus judicieux d’offrir aux utilisateurs une solution pour être notifié dès que leur produit est de nouveau disponible.

Proposez donc cette solution dès qu’une couleur, une taille, une variante de produit n’est plus disponible que vous comptez re-proposer dans le futur.

alerte

Les mentions légales, politiques de retour et de confidentialité doivent être facilement trouvables

Peu importe sur quelle page se trouve l’utilisateur, il doit pouvoir accéder à tout moment aux mentions légales. Les gens s’inquiètent facilement en général pour ce qui est des paiements en ligne et des e-commerces. Si tout n’est pas clair, ils peuvent ne pas avoir confiance en votre site.

La plupart des e-commerces intègrent leurs mentions légales directement dans leur bas de page. C’est une bonne solution car c’est la position standard de base pour ce genre de lien. De plus, cela permet aux utilisateurs d’avoir accès à ces informations sur n’importe quelle page sachant que le bas de page est disponible partout.

Montrer l’organisation réelle derrière le site et toutes les informations la concernant

Une entreprise qui se cache derrière un logo et ne délivre aucune transparence concernant sa structure risque de donner une mauvaise impression à ses utilisateurs. Si un utilisateur voit sur un site web des photos avec des êtres humains, des bureaux, des équipes, etc. il sera tout de suite plus en confiance.

Les utilisateurs ont besoin de savoir qui vous êtes et qui se cachent derrière votre site e-commerce. Si vous n’avez pas de photos réelles, de photo de votre bureau ou des vos produits, comment peuvent-ils vous croire et vous faire confiance ?

L'objectif est donc de trouver des façons plus ou moins créatives pour humaniser votre e-commerce.

à propos

Montrer les avis, les marques partenaires, les recommandations

L'autorité, les recommandations et les avis des clients représentent l’arme la plus redoutable pour vendre sur internet. Rien de plus rassurant et crédible qu’un autre utilisateur qui valide et qui recommande un produit.

Vous avez tout intérêt à utiliser la preuve sociale sur votre site e-commerce.

Voici des exemples de preuves sociales :

  • Témoignage
  • Interviews client
  • Avis client
  • Logos des partenaires
  • Mentions d’experts

Le fait de mettre en avant des logos de marques connues fonctionne tout particulièrement bien. Cela permet aux utilisateurs de créer un lien entre ce qu’il connaît déjà et votre e-commerce.

Bien sûr si vous n’avez pas de recommandations ou de partenaire connues, vous pouvez tout simplement mentionner des avis clients. Cela marche aussi très bien.

Utiliser des icônes standards

Vous ne vous en rendez surement pas compte, mais les icônes sont très présentes sur internet. Ils servent à remplacer les textes, à rendre la navigation et la lisibilité meilleures. Mais à une condition, c’est que ces icônes utilisées soient familières, reconnaissables et compréhensibles.

Pour être sûr d’utiliser les bonnes icônes, restez simples et choisissez des icônes standards. L’icône de loupe pour la recherche est une icône standard par exemple.

Attention aussi, si vous êtes dans le marché A et que vous utilisez une icône pour signifier la page contact, il se peut que le marché B utilise cette icône pour une page service. Faites donc un travail de recherche sur vos concurrents et votre marché afin de voir quelles sont les icônes utilisées fréquemment.

L'objectif ici est donc d’utiliser des icônes universelles que la plupart de vos utilisateurs comprennent.

icones

LES LIENS DOIVENT AVOIR UN ÉTAT DE SURVOL

Encore un comportement standard que chaque site web devrait adopter. Cela peut paraître banal pour certain mais sachez qu’il y a encore de nombreux sites qui ne respectent pas cette règle.

Chaque bouton doit avoir un état de survol (hover). Son état peut changer au niveau de sa couleur, de sa forme, de son ombre porté. Dans tous les cas, ce changement d’état ne doit pas venir brider la lisibilité du bouton en question.

Cet état de survol est particulièrement efficace pour rendre la navigation et la compréhension de l’interface plus facile pour les utilisateurs. Combien de fois vous avez cliqué sur un bouton qui n’en était pas un ? L’état de survol “hover” sert donc à faire comprendre à l’utilisateur qu’il peut cliquer.

Le logo doit être standard, se situer en haut à gauche et être cliquable pour aller à l’accueil

Cette convention est l’une des plus connues et des plus vieilles. C’est une véritable norme, même les utilisateurs peu à l’aise avec le milieu du web sont habitués à pouvoir cliquer sur le logo en haut à gauche pour aller sur la page d’accueil.

Même s’il existe un bouton “accueil”, beaucoup des utilisateurs cliquent sur le logo pour revenir à la “première étape” du site.

Si votre logo n’est pas cliquable, ou si encore pire vous n’avez pas de logo présent en haut de l’interface de votre e-commerce, pensez-y.

Le menu principal doit être placé en haut et doit être sticky

Il est très pénible de remonter tout en haut d’une page pour accéder au menu de navigation. Le menu sticky ou collant permet de régler ce problème. Un menu collant ne disparaît pas lorsqu’on scroll sur une page, il est verrouillé et permet à l’utilisateur d’avoir accès à tout moment à son contenu.

Plusieurs études ont montré que la majorité des utilisateurs préféraient un menu collant plutôt qu’un menu classique. Même si celui-ci prend plus de place à l’écran et est constamment présent, cela apporte un vrai plus et rend la navigation plus simple, surtout si les pages sont longues verticalement.

L’icône de panier doit indiquer le nombre d'articles présents dans le panier et le prix

Il est important pour une interface de donner systématiquement un retour aux utilisateurs après une action effectuée. Sachant que le panier est la première étape dans un processus d’achat, il est primordial de communiquer et de signaler les actions concernant le panier.

Dès qu’un utilisateur ajoute un produit au panier, mentionnez que le contenu du panier a changé.

Lorsqu’un utilisateur survol l’icône du panier, affichez le nombre d’articles dans le panier et le prix total.

Assurez-vous que le panier et son contenu soient accessibles à tout moment. Cela permet aux utilisateurs de voir facilement où ils s’en sont dans leurs achats.

En matière d’UX, cela apporte plusieurs avantages :

  • Confirmation lorsqu’un utilisateur réalise une action (ajout au panier)
  • L'utilisateur sait ce qu’il y a dans le panier
  • Cela permet de montrer à l’utilisateur qu’il s’est engagé
panier e-commerce

Les catégories parentes dans le menu doivent être cliquables

Les utilisateurs doivent se sentir en confiance sur un site web, ils doivent sentir une certaine convivialité, une aisance...

Or il existe une erreur que beaucoup d’utilisateurs commettent régulièrement, celle de cliquer sur un lien qui n’en est pas un.

En fait, ça n’est pas vraiment une erreur de l’utilisateur, c’est plutôt une erreur qui vient du site web.

Dans votre menu e-commerce, vous avez sûrement mentionné des catégories parentes englobant plusieurs autres catégories. Sachez donc que les utilisateurs s'attendent à pouvoir cliquer sur n’importe quel texte concernant ces catégories. Cela peut représenter une grande frustration que de cliquer sur un texte qui n’est pas un lien.

Pour vérifier le comportement de vos utilisateurs face à votre menu et à vos liens, vous pouvez utiliser les heat maps et les relectures de sessions avec Hotjar par exemple. Cela vous permettra de voir avec précision si vos utilisateurs cliquent sur des textes qui ne sont pas des liens.

Mentionner les catégories principales sur la page d’accueil

Si vous avez une gamme de produits vraiment grande, il est important de mentionner vos grandes catégories sur votre page d’accueil et de les mettre en avant. Cela permet de guider l’utilisateur face à vos nombreux produits et de leur faire passer directement à la réelle navigation.  

La plupart du temps, les utilisateurs ne savent pas par où commencer si votre menu contient beaucoup de solutions, de catégories et de sous-catégories. Proposez leur des “chemins” et des catégories à visiter avec de belles photos, de courtes présentations, etc.

Eviter les carrousels automatiques  

Même si vous voyez beaucoup de carrousels par-ci par-là, cela ne veut pas dire qu’ils sont efficaces en matière d’UX et de conversion. En réalité, ils sont en général inutiles pour les utilisateurs et n’apportent aucune plus-value à l’interface. Sachant qu’ils ressemblent à des publicités, les utilisateurs ont tendance à les ignorer.

Évitez donc les carrousels automatiques, pour plusieurs raisons :

Dans la plupart des cas, les utilisateurs cliquent sur le curseur pour parvenir aux slides qui les intéressent, sans prendre en compte le reste des slides. Cela représente donc une perte de temps.

De plus, les carrousels sont en général ennuyeux et gênants visuellement. (animation trop brusque ou trop lente)

Enfin, la place que prend un carrousel, ses visuels et ses flèches pour changer de slide détournent l’attention des fonctionnalités vraiment importantes comme les CTA.

La barre de recherche doit être assez visible, placée en haut et assez grande pour taper une recherche potentielle

Là encore, rien ne sert de réinventer la roue. La plupart des e-commerces placent leur barre de recherche en haut à droite, et ça n’est pas pour rien. Les utilisateurs s’attendent à trouver la fonction de recherche à cet endroit précis, pourquoi donc la placer ailleurs ?

Sachez que la recherche sur un site e-commerce fait partie de l’expérience d’achat dans plus de 40% des achats en ligne (source : ThanxMedia).

Veillez donc à proposer une barre de recherche assez visible, avec un design standard et une position favorable. Les utilisateurs ne doivent pas chercher votre fonction de recherche, si c’est le cas, votre site web a un problème.

Moteur de recherche e-commerce

Optimiser la vitesse de chargement

Sachez que la vitesse de chargement a un impact énorme sur le taux de rebond de votre site e-commerce.

47% des utilisateurs s'attendent à ce qu’une page se charge en 2 secondes ou moins.

57% des visiteurs abandonnent une page dont le chargement prend plus de 3 secondes ou plus.

8% des utilisateurs citent la lenteur du chargement des pages comme raison principale concernant l’abandon d’achat.

Vous l’aurez compris, la vitesse de chargement est un aspect à optimiser en priorité. Pour cela plusieurs choses peuvent être travaillées :

  • Optimiser la taille des images
  • Alléger le code HTML, CSS, JS, PHP
  • Utiliser la mise en cache
  • Utiliser un hébergeur de qualité
  • Désactiver les plugins inutiles.

Les sites web qui chargent rapidement ont naturellement un taux de conversion plus élevée. Optimiser la vitesse de chargement de votre site est finalement une façon simple d'optimiser vos conversions et votre UX.

Mettre à disposition un système de filtrage

Cela peut paraître évident mais la fonctionnalité de filtre est devenue un standard des e-commerces. Si vous vendez que très peu de produits, le filtrage n’est pas forcément nécessaire. Si vous avez beaucoup de produit, c’est une autre histoire.

Le fait de pouvoir filtrer les produits est un énorme plus pour la navigation et l’expérience utilisateur. De nombreux utilisateurs dépendent de ces systèmes de filtre pour trouver ce qu’ils cherchent.

Conformez-vous et implémentez sur vos pages qui listent vos produits un système de filtre concernant des caractéristiques pertinentes (prix, couleurs, taille, etc.)

Zalando filtre

Un fil d’ariane doit être disponible sur toutes les pages

Le fil d’ariane est un aspect qui vient apporter de la clarté à la navigation de votre site, il est donc indispensable, surtout pour les e-commerces.

Dans un premier temps, le fil d’ariane doit lui aussi avoir une position standard : à gauche, sous la barre de navigation et en second plan dans la hiérarchie visuelle.

Ensuite, ce fil d’ariane doit permettre à l’utilisateur de visualiser dans quelle catégorie ou sous catégorie il se trouve. Il doit pouvoir également revenir en arrière facilement dans une des catégories parentes. Ces mentions de catégories et de sous-catégorie doivent être des liens cliquables afin que les utilisateurs puissent revenir en arrière, à la sous-catégorie voulue.

Le fil d’ariane a pour objectif de faire comprendre à l’utilisateur où il se trouve par rapport à la profondeur de lien donc.

Fil d'ariane SDLV

Proposer des produits similaires sur les pages produits

Les recommandations de produit sur les pages produit peuvent s'avérer très puissantes. Les plus gros sites e-commerce comme Amazon par exemple implémentent systématiquement des produits secondaires sur leur page produit.

Néanmoins, il ne s'agit pas de proposer des produits supplémentaires de façon hasardeuse. L'objectif est de proposer des produits complémentaires pertinents. Si l’utilisateur se trouve sur une page produit présentant un stylo, des produits complémentaires présentant différentes encres seraient pertinents à implémenter en guise de recommandation.

Le but est de pousser l’utilisateur à effectuer d’autres achats en lien avec le produit de la page sur laquelle il se trouve.

Deloffre recommandation

Proposer un processus de paiement clair

Le processus de paiement doit être clair, concis et direct. Plus c’est simple, plus la navigation à ce niveau-là du parcours d’achat sera agréable.  

Minimiser le nombre d’étapes, de pages, de contraintes. Certains sites suppriment la nécessité de se créer un compte pour pouvoir payer et commander.

La clé ici est d’avoir des étapes simples afin de ne pas créer de confusion. Pour cela, il est important de respecter la convention qui est d’afficher une barre de progression en haut des pages du processus de paiement. Cela permettra d’orienter l’utilisateur et de lui communiquer à chaque moment où il est en est dans le processus.

Tunnel de vente

Formation CRO pour booster vos conversions

+10h de cours vidéo sur le CRO
+50 études de cas, check-lists, templates...
Découvrir la formation 👉

Nos derniers articles