Table des matières
L’optimisation des pages de produits est sans aucun doute l’une des clés pour obtenir un meilleur taux de conversion dans votre commerce électronique. Auparavant, nous parlions d’idées pour optimiser le checkout, où nous nous concentrions sur l’expérience de l’utilisateur lors du paiement ; aujourd’hui, il s’agit de proposer une page de produits sans friction qui permet à l’utilisateur d’acheter dans notre magasin en toute confiance.
Optimiser la page du produit : Appel à l’action (CTA)
Qu’est-ce qu’un appel à l’action ?
C’est un terme omniprésent, mais que signifie réellement « appel à l’action » ?
En termes simples, un appel à l’action est un bouton ou un lien qui représente l’action la plus désirée pour un visiteur du site.
Cette « action la plus souhaitée » peut varier d’une page à l’autre, et les différents CTA rempliront différentes fonctions tout au long du voyage du client.
Lorsqu’un visiteur arrive à la page d’un produit, par exemple, vous voulez probablement qu’il ajoute un produit à son panier. Lors du paiement, vous voulez vous assurer qu’ils ont bien rempli le formulaire et cliqué sur le bouton d’achat. Après l’achat, l’action idéale pourrait être que les clients cliquent sur un bouton pour partager sur les réseaux sociaux.
Quoi qu’il en soit, cliquer sur un CTA représente le meilleur résultat possible pour les visiteurs de votre site.
Le CTA doit être très perceptible, l’acteur principal dans la hiérarchie visuelle de la page
Si vous souhaitez que vos utilisateurs réalisent une action spécifique, veillez à ce que cette action soit très visible. Sur la page du produit, l’action principale est généralement « Ajouter au panier » ; la hiérarchie visuelle de la page doit correspondre à cet objectif.
GearExpress – Un CTA unique et très visible
Beaucoup d’ »espace blanc » autour de vos CTA
Un moyen simple de rendre vos CTA très visibles est de laisser beaucoup d’espace blanc autour d’eux.
Mango.com – Beaucoup d’espaces blancs
La couleur du bouton CTA doit contraster avec les couleurs du reste de la page
Pourquoi devrions-nous nous soucier du contraste ?
Plus le bouton CTA reçoit d’attention, plus il est probable qu’un visiteur clique dessus. Plus le contraste entre les éléments de la page et le CTA est élevé, plus l’attention est dirigée vers le bouton.
Dockers – CTA très clair
Optimiser la page d’un produit : les principes d’un design persuasif
Minimiser la complexité visuelle de la conception de votre site
Une page complexe demande plus d’efforts et crée par conséquent des frictions qui peuvent avoir un impact négatif sur la conversion.
Dans la mesure du possible, essayez d’appliquer les principes KISS (https://es.wikipedia.org/wiki/Principio_KISS) ; la simplicité aide.
Il sera toujours temps d’ajouter des éléments ou des caractéristiques secondaires dont vous pourrez mesurer l’impact avec des tests A/B.
Maximiser la prototypicité
La prototipicité est l’image mentale de base que notre cerveau crée pour catégoriser tout ce avec quoi il interagit. Des meubles aux sites web, notre cerveau a un modèle de ce à quoi les choses doivent ressembler et se sentir.
Sur l’internet, la prototypicité est divisée en petites catégories. Nous avons des images mentales différentes mais spécifiques pour les réseaux sociaux, les sites de commerce électronique et les blogs. Si l’un de ces sites manque un peu de notre image mentale, nous rejetterons le site aux niveaux conscient et subconscient.
prototipicité
Créer une hiérarchie visuelle claire qui correspond aux éléments les plus importants de la page
La hiérarchie visuelle est la disposition des éléments graphiques dans un dessin par ordre d’importance de chaque élément. Le poids visuel définit l’importance d’un élément dans la hiérarchie d’un design, communiquant aux yeux du spectateur sur quoi se concentrer et dans quel ordre.
Hiérarchie visuelle : donner de l’importance
La taille compte, n’est-ce pas ? Bien que l’adage classique soit encore en débat, la taille est peut-être le moyen le plus efficace de mettre en valeur les éléments visuels. En bref, les grands éléments attirent davantage l’attention que les petits.
C’est précisément la raison pour laquelle les titres des journaux apparaissent dans des sources plus importantes, et les grands reportages ont souvent des titres encore plus importants que les articles du reste de la page. Dans tout dessin, les éléments de grande taille, qu’il s’agisse de mots ou d’images, seront non seulement plus visibles, mais aussi porteurs du message le plus fort.
Tout comme les grands éléments sont perçus comme étant plus importants que les petits, les couleurs vives attirent souvent plus l’attention que les tons plus ternes. Par exemple, si un seul mot dans un bloc de texte est mis en évidence par une couleur vive, il attire immédiatement l’attention du lecteur.
Les contrastes peuvent également souligner plus efficacement des éléments spécifiques qu’un spectre à une échelle plus douce. Placer un objet rouge sur un fond vert ou noir attirera davantage l’attention que le même objet rouge sur un fond orange ou violet. Tout comme le contraste des couleurs, le style d’un élément peut aider à mettre l’accent.
Types de hiérarchie visuelle
Évitez les paragraphes qui contiennent plus de quatre lignes de texte
Les paragraphes très longs ne sont pas idéaux pour les magasins en ligne ; il ne s’agit pas d’écrire comme un livre mais de fournir des informations aux utilisateurs.
Proflowers.com – Paragraphes petits
Maximiser la taille et la qualité des images des produits
Les gens n’achètent presque rien sans le voir. En général, ils veulent aussi le toucher, le tenir ou le promener. Ils ne peuvent pas vraiment faire ce genre de choses sur Internet. Ensuite, pour compenser tout cela, vous devez travailler deux fois plus dur pour faire vivre vos produits grâce à d’excellentes photographies et à un excellent graphisme.
Les images doivent offrir une vue très détaillée, une vue d’utilisation dans un contexte et si possible, une courte vidéo.
N’ayez pas peur de proposer une grande variété d’images.
Adidas.com – De grandes photos de qualité
Objectif : une action par écran
Pour éviter de confondre les utilisateurs, nous essaierons de ne proposer qu’une seule action par page.
Tricker’s – Une action par écran
Optimiser la page du produit : Typographie et contenu
Évitez les textes dont la taille est inférieure à 16px
Par défaut, nous recommandons d’utiliser un texte de 16px ou équivalent pour le texte de la page.
Nous faciliterons la lecture et éviterons de fatiguer les utilisateurs.
Obut.com – letters de 12px contre 16px. De petites différences qui comptent.
Utilise des polices traditionnelles (Arial, Georgia, Tahoma, etc.) pour les textes du corps
La lisibilité est la clé. Vous ne voulez certainement pas exagérer les sources de calligraphie au point que les lecteurs puissent à peine distinguer les mots que vous avez écrits.
En fait, l’utilisation de polices de caractères standard peut mieux séduire les lecteurs, puisque la plupart des gens les connaissent.
La simplicité accroît la lisibilité de votre site web et augmente son attrait visuel. Vous devez vous efforcer d’utiliser un nombre minimum de polices de caractères sur votre site web afin de maintenir la structure et le professionnalisme.
La typographie de votre site web dépend en grande partie de vos besoins. Par exemple, lors de la promotion de votre marque, des polices personnalisées peuvent être utiles à ce stade.
De plus, prenez en considération l’appareil sur lequel les utilisateurs accéderont principalement à votre site web, qu’il s’agisse d’ordinateurs portables, de tablettes ou de téléphones mobiles.
Mapfre dans « Comic Sans », ce n’est pas la même chose…
Diviser le texte
Donnez de l’air à votre texte avec des listes (ordonnées et non ordonnées), des images, des sous-titres tous les 1-2 paragraphes, et/ou des coupures de paragraphe toutes les 3-4 lignes. De cette façon, la lecture sera plus facile et vous ne demanderez pas beaucoup d’efforts à vos clients.
Lacoste.com – Lecture facile
La longueur optimale des lignes de texte est de 50-75 caractères
Il s’agit d’une recommandation de https://cxl.com/. Lors des nombreux tests d’optimisation de la conversion, ils ont constaté que les lignes de texte courtes donnent généralement de meilleurs résultats. Comme pour tout ce qui concerne le CRO, il est conseillé de faire vos propres tests pour confirmer que la recommandation est également positive auprès de votre public.
Optimiser la page de produit : Réduire les doutes
Nous voulons réduire autant que possible les doutes qui peuvent survenir sur la page du produit. Un client qui a des doutes s’éloigne rapidement de l’achat ; notre but est de rassurer le client en lui offrant des réponses utiles et faciles à comprendre.
Facilité de paiement
Decathlon – Paiements échelonnés
Si vous pouvez proposer un financement comme mode de paiement, vous pouvez essayer de montrer cette solution sur la page du produit, près du prix.
Facilité de livraison et de retour
HappySocks – Livraison et retour
Nous ne pouvons pas oublier d’informer sur les délais et les coûts de livraison ; c’est une information de base que les utilisateurs s’attendent à trouver facilement. Si nous le pouvons, il est fortement recommandé de proposer une livraison gratuite.
Informer sur les tailles
Zara – Tableau des tailles classiques
En particulier dans le commerce électronique de la mode, des vêtements ou accessoires de sport, les tailles sont souvent l’un des principaux points de friction. Acheteriez-vous sans être sûr à 100% que la taille est correcte ?
Outre le classique tableau des tailles qui s’ouvre lorsque vous cliquez sur un lien « Taille » près du bouton « Ajouter au panier », il existe des solutions très complètes pour faciliter le choix de la bonne taille. Exemple de TheNorthFace avec FitFinder :
TheNorthFace et FitFinder
Informations pertinentes
Si vous vendez des produits techniques ou des produits dont l’utilisation est très spécifique, il est probable que vos acheteurs recherchent des informations très pertinentes pour l’utilisation de ce produit.
Un exemple avec Gobik et ses combinaisons de triathlon ; Le chamois et la plage d’utilisation (températures) sont des données très pertinentes pour ceux qui sont intéressés à acheter/utiliser ce produit.
Gobik.com – Información relevante
Biais cognitifs
L’effet de mode avec les revues
L’effet du mode, communément appelé « mentalité de troupeau », est la tendance à faire ou à croire la même chose que les autres personnes. Elle est basée sur le concept de preuve sociale.
Peu d’entre nous aiment être perçus comme différents et trouvent plus rassurant de faire la même chose que les autres. Par conséquent, nous avons tendance à accepter la foule lorsqu’il s’agit de prendre des décisions ; même si c’est mal, notre cerveau illogique nous convainc que ce n’est pas si mal, au moins nous sommes dans le même bateau que tout le monde.
Dans cette optique, les propriétaires de commerce électronique peuvent chercher à accroître la popularité de leurs produits et services. Ce faisant, les visiteurs auront le sentiment de suivre les traces de centaines d’autres personnes, et cette approche « force du nombre » leur donnera l’assurance qu’ils sont comme tout le monde.
Amazon.com – Revues
Comment utiliser ce biais dans votre magasin de commerce électronique :
Utilisez les commentaires et les revues. Si vous avez beaucoup de critiques, rendez-les visibles : plus un acheteur potentiel voit de critiques, plus il se sentira en confiance. D’autre part, si vous ne pouvez pas recueillir suffisamment de commentaires, alors vous voudrez rester à l’écart de cette option. Le simple fait de montrer une ou deux critiques peut avoir un effet négatif et faire croire aux clients potentiels que peu de gens achètent votre produit.
Syndrome de FOMO avec disponibilité
La FOMO (Fear Of Missing Out) est une préoccupation commune, à savoir que d’autres peuvent avoir des expériences enrichissantes dont on est absent. Cette anxiété sociale est caractérisée par « un désir d’être continuellement connecté ». Bien qu’il s’agisse principalement d’un biais lié à l’utilisation des réseaux sociaux, de nombreux sites de commerce électronique utilisent ce biais avec la disponibilité de leurs produits ou offres.
Homer souffre du FOMO
Par exemple, dans le magasin Decathlon, lorsqu’un produit est en rupture de stock, l’utilisateur voit un message « 1 unité restante, ne vous en privez pas !
Decathlon – FOMO
Avez-vous essayé dans votre boutique en ligne ?
Pour en savoir plus sur les biais cognitifs, nous vous recommandons notre article 19 biais cognitifs pour augmenter la conversion de votre marketing.
N’hésitez pas à demander de l’aide pour optimiser votre commerce électronique !
Si, malgré les explications fournies sur cette page et sur notre site web en général, vous vous sentez un peu perdu ou si vous souhaitez plus d’informations sur la manière d’optimiser votre commerce électronique, n’hésitez pas à nous contacter.
Nos fondateurs sont également des entrepreneurs. Sa passion est d’aider les entreprises à se développer par le biais de la CRO et du marketing numérique. Alors n’hésitez pas, nous sommes là pour vous aussi.
