Un guide complet pour la conception de sites Web de commerce électronique

Dernière mise à jour - 8 juillet 2021

Bien qu'il existe de nombreux facteurs à prendre en compte lors de la création d'un site Web de commerce électronique réussi, celui que vous ne voulez tout simplement pas négliger est la conception globale. Un excellent design se prête à une expérience utilisateur améliorée, à une meilleure présentation des produits et à un site Web dont vos utilisateurs se souviendront. Il y a un million de raisons pour lesquelles quelqu'un pourrait aller sur votre site Web et "rebondir" - c'est-à-dire partir sans prendre aucune mesure comme acheter un produit ou s'inscrire à votre newsletter. Ne laissez pas une conception de site Web terne en faire partie.

Dans cet article, nous aborderons certaines des techniques que vous pouvez utiliser pour améliorer votre conception existante ou même les appliquer lors de la création d'un tout nouveau site Web de commerce électronique. Continuez à lire pour en savoir plus.

Considérations sur la conception

En ce qui concerne la conception de base, garder à l'esprit ce qu'il faut éviter peut être tout aussi important que la mise en œuvre des meilleures pratiques. Nous couvrirons cinq des principales considérations de conception à suivre pour garantir que vos visiteurs auront une meilleure expérience lors de la visite de votre boutique.

Identité de marque

Une façon d'aider vraiment vos visiteurs à se connecter avec votre entreprise est d'établir une identité forte. Dans le commerce électronique, l'identité de la marque peut s'exprimer de plusieurs manières ; du ton de votre formulation et de vos messages (par exemple, être ludique, sérieux ou humoristique) à la palette de couleurs globale de votre site Web . Si vos visiteurs peuvent facilement reconnaître votre marque lorsqu'ils arrivent sur votre site Web, cela aidera à établir la familiarité et la confiance, ce qui vous permettra d'accomplir facilement ce que votre site Web est censé faire.

Essentiellement, tout, depuis les couleurs, la copie et la mise en page, doit être fait en tenant compte de votre marché cible.

Hiérarchie visuelle

Dans la conception du commerce électronique, la hiérarchie visuelle est le meilleur moyen de relayer immédiatement les éléments importants à vos visiteurs. Leur temps et leur attention sont limités, donc être capable de transmettre les points clés avec une hiérarchie visuelle peut se traduire par une meilleure expérience globale. La question est, comment ?

L'utilisation appropriée de la hiérarchie visuelle peut prendre plusieurs formes. Ceux-ci incluent la mise en page, la taille, l'espace et la texture, la police et la couleur.

Pour les mises en page, beaucoup se concentrent sur les conceptions « F » et « Z ». Ceux-ci sont basés sur la prémisse de la façon dont les gens ont tendance à lire les sites Web. Les conceptions en "F" pensent que les gens lisent d'abord le côté gauche, puis attrapent les titres et autres informations importantes tout en scannant de gauche à droite. Les conceptions en « Z » sont basées sur le principe selon lequel les gens lisent de gauche à droite, scannent en diagonale, puis lisent à nouveau vers la droite.

Pour la taille, c'est simple : les visiteurs parcourent rapidement les gros titres pour voir ce qui attire leur attention en premier, puis commencent à lire à partir de là. C'est pourquoi, dans la publicité, les mots de grande taille transmettent toujours le message principal, tandis que les polices de caractères plus petites sont utilisées pour les informations supplémentaires.

L'espacement et la texture sont vraiment importants et nous les aborderons ensuite plus en détail. Choisir la bonne combinaison de polices et de couleurs peut également être crucial. Semblables à la taille, ces deux facteurs détermineront les parties de la page vers lesquelles vos lecteurs seront attirés. Ils vous donnent le pouvoir de diriger l'attention de vos lecteurs vers les parties les plus importantes de votre site Web, alors utilisez ce pouvoir à bon escient.

Rester simple; Ne pas trop concevoir

La pire chose que vous puissiez faire est de tout rassembler le plus près possible et de remplir la page de contenu et d'images. Pour vos visiteurs, cela ressemblera à une surcharge sensorielle et cela nuira à votre capacité à les attirer vers certaines parties de la page. Si vous voulez vraiment attirer leur attention, gardez à l'esprit le principe séculaire : moins c'est plus. "Espace blanc" est le mot à retenir. Donnez de l'espace à votre page pour respirer et vous aiderez certains éléments à se démarquer et à obtenir l'attention qu'ils méritent. D'autre part, évitez d'avoir trop d'espace blanc car cela donnerait l'impression que la page Web n'a pas été entièrement construite.

S'en tenir aux symboles connus

L'utilisation de symboles et de logos familiers à votre public contribuera à créer un climat de confiance et l'aidera à reconnaître que vous êtes une marque sur laquelle il peut compter. Il y a quelques façons de le faire:

• Si vous avez un certificat SSL , utilisez l'un des logos SSL vérifiés.
• Tout en offrant un paiement sécurisé avec Visa , Paypal ou un autre mode de paiement, utilisez les logos qui l'accompagnent.
• Si vous avez une garantie de remboursement, un symbole peut aider à le transmettre facilement aux personnes qui sont sur le point d'acheter. Et cela aide à instaurer la confiance.

Si vous utilisez des symboles que les gens connaissent bien, ils traiteront votre marque avec respect et seront plus susceptibles de consacrer leur temps et leur argent à votre site Web.

Évitez les fenêtres contextuelles

De nos jours, il est à la mode pour de nombreux sites Web de commerce électronique de vous afficher une gigantesque fenêtre contextuelle lorsque vous arrivez pour la première fois sur leur site. Nous l'avons même vu dépasser l'image du héros, le logo et tout ce qui est associé à votre marque. Ceux-ci font souvent plus de mal que de bien. Avant même de pouvoir offrir quoi que ce soit de valeur à votre visiteur, vous lui "prenez" déjà - en lui demandant son adresse e-mail, pour qu'il s'inscrive à une offre, etc. Certaines fenêtres contextuelles iront même jusqu'à faire un remarque sarcastique si l'utilisateur ne veut pas s'inscrire : "Non, je ne veux pas les dernières mises à jour pour le marketing numérique". Cela ajoute à une mauvaise expérience utilisateur et les rend moins susceptibles de revenir sur votre site Web, et pire encore, ils pourraient se fermer complètement.

En ce qui concerne les popups, suivez cette règle simple : évitez-les ! En moyenne, une personne visitant de nouveaux sites Web un jour donné peut rencontrer des dizaines de sites Web avec des fenêtres contextuelles, alors démarquez-vous aujourd'hui et assurez-vous que le vôtre n'en a pas. Donnez de la valeur avant de chercher à prendre.

Barre de navigation

Un menu bien placé fera toute la différence lorsqu'il s'agira de permettre aux utilisateurs de naviguer avec succès sur quelques pages de votre site Web. En ce qui concerne le commerce électronique en particulier, cela peut aider à organiser des catégories de produits, permettant aux visiteurs de déterminer rapidement exactement ce qu'ils recherchent. Après tout, s'ils ne le trouvent pas, ils ne l'achèteront pas.

En ce qui concerne le menu de navigation, ne soyez pas trop fantaisiste. Les liens vers vos pages principales doivent reprendre les éléments de niveau supérieur ; les liens qui apparaissent sans survol. Les sous-pages doivent apparaître en dessous. Dans de nombreux cas, vous pouvez faire en sorte que le menu de navigation soit collant (toujours affiché) ou n'apparaisse que lorsqu'un utilisateur fait défiler vers le haut - utile si vous appréciez l'espace supplémentaire sur votre site Web.

Catégories

Si vous vendez beaucoup d'articles, organisez-les en catégories claires pour permettre aux gens de trouver facilement ce qu'ils veulent. Cela va presque de pair avec un menu de navigation propre, mais cela va un peu plus loin.

Lorsqu'il s'agit de cataloguer vos produits, assurez-vous de les afficher d'une manière logique, en gardant les articles similaires ensemble. Les gens devraient pouvoir effectuer une recherche par balises de catégorie, que ce soit sur la fonction de recherche de votre site, sur la barre de navigation de votre menu ou sur la page du produit elle-même. Ils ne savent peut-être pas exactement quel produit ils recherchent, mais s'ils peuvent facilement voir tous les produits d'une même catégorie, ils le trouveront probablement plus rapidement.

Filtres

Les filtres sont liés aux catégories d'une certaine manière : vous permettez à votre visiteur d'affiner exactement ce qu'il recherche. Parfois, trop de produits parmi lesquels choisir peut être écrasant. Cela peut geler vos visiteurs, les rendant incapables de choisir exactement ce qu'ils veulent. Et le résultat final est terrifiant : ils partent sans rien choisir. La clé est de les laisser affiner leurs options aussi précisément que possible – le filtrage – afin qu'ils puissent commencer à éliminer les résultats qui ne leur conviennent pas.

Par exemple, si vous vendez des ordinateurs, vous pouvez répertorier une multitude de filtres : PC ou ordinateur portable, mémoire requise, processeur graphique, etc. Cela vaut pour à peu près n'importe quelle catégorie ou article.

Aperçu rapide

Avoir une option "aperçu rapide" peut aider à garder vos visiteurs sur votre page sans les enliser avec un chargement supplémentaire ou détourner leur attention de vos produits. Essentiellement, ce qu'il fait est d'ouvrir les détails du produit dans une fenêtre modale sur la page qu'ils consultent actuellement. Imaginez que vous cliquiez sur une image et qu'elle apparaisse dans une boîte plus grande - la vue rapide est un peu la même chose, sauf qu'elle encapsule également les caractéristiques les plus importantes d'un produit à côté de l'image.

Les vues rapides facilitent le processus d'achat et peuvent aider à donner aux gens des instantanés rapides de ce qu'ils regardent, sans s'embourber dans toutes les minuties.

Offres spéciales

Les offres spéciales peuvent aider à convertir les acheteurs qui hésitent et susciter l'intérêt de personnes qui n'avaient peut-être pas envisagé d'acheter en premier lieu. Il existe de nombreuses raisons pour lesquelles les offres spéciales fonctionnent, du sentiment psychologique d'obtenir quelque chose de moins cher au simple fait d'offrir plus de valeur que la concurrence.

Si vous avez des offres spéciales ou des offres exclusives, placez-les au premier plan de votre site Web afin qu'elles soient visibles. Le succès de votre entreprise de commerce électronique ne devrait pas dépendre d'offres spéciales, mais il est possible qu'elles soient l'offre la plus recherchée que vous ayez. Pensez à les placer bien en évidence sur la page d'accueil, la première image d'un slider, et pendant les périodes spéciales de l'année pour en tirer le meilleur parti et vraiment susciter l'intérêt pour vos produits.

Conception de la page produit

Dans la conception de commerce électronique, les pages de produits vont au-delà d'une simple image de votre produit. Ils racontent l'histoire, donnent des informations détaillées sur l'article et aident les gens à décider s'ils ont besoin ou non du produit. Voici un peu plus en détail.

Images du produit

Vos produits doivent avoir plus d'une image les décrivant. Différents angles, divers gros plans et des photos de l'emballage peuvent aider à vendre l'image globale. Plus le ticket est élevé, plus vous aurez besoin d'une vue complète de tout ce qui lui est associé. Un simple t-shirt ne peut avoir qu'une ou deux images (recto et verso), alors que des articles plus chers - comme des meubles, des voitures ou même des maisons - auront besoin de beaucoup plus de soutien derrière eux.

La meilleure pratique de présentation de produits consiste en des vidéos, des images interactives ou même des modèles 3D navigables par l'utilisateur (selon le type de produit). Il est essentiel d'en inclure le plus possible. Pensez à l'abondance plutôt qu'à l'austérité ; vos visiteurs l'apprécieront.

Information sur le produit

Dans le commerce électronique, si vous voulez aider les acheteurs à prendre la meilleure décision, vous devez les aider à être aussi informés que possible. Si vous n'informez pas vos visiteurs, quelqu'un d'autre le fera – et ils seront plus susceptibles d'obtenir la vente finale.

Inclure autant d'informations sur le produit que possible aidera à renforcer la confiance et à répondre aux questions. Les gens sont moins susceptibles d'acheter s'ils ont une question importante concernant un produit, alors essayez d'en couvrir les facettes les plus importantes - ou quelles pourraient être les questions les plus fréquemment posées.

Envisagez des options telles que la disponibilité, les couleurs, les dimensions, les tailles, les matériaux et les garanties. Donner une histoire à votre produit permettra aux gens de s'y connecter plus facilement.

Rareté des produits

Montrer qu'un produit n'est pas toujours disponible – car avouons-le, ce n'est peut-être pas toujours le cas – est un moyen de motiver vos acheteurs à passer à l'action. Cela dit, il n'est pas judicieux de répertorier chaque article de votre site Web comme temporairement indisponible ou en rupture de stock - mais s'il y a un certain article que vous voulez ou devez vendre, vous pouvez utiliser ce principe pour le faire avancer.

Si vous êtes à court d'un produit, assurez-vous de le dire. Grisez les tailles ou les couleurs que vous n'avez plus. Informez les acheteurs lorsque vous êtes à court d'argent. La clé ici est que vous n'avez pas besoin d'être malhonnête pour créer une pénurie de produits.

Panier

Le panier d'achat ou le panier de paiement est la version eCommerce de faire la queue à l'épicerie locale. C'est là que les visiteurs de votre site Web ont choisi ce qu'ils veulent et sont prêts à acheter. Ils ont déjà effectué mentalement l'achat - la clé ici est donc de leur faciliter le plus possible la finalisation des détails, la révision de leur commande et la poursuite de leur journée.

Il y a quelques éléments dont vous avez absolument besoin si vous voulez que votre panier d'achat facilite le processus d'achat plutôt que de ralentir les choses. Tout d'abord, vous aurez besoin d'un bouton d'appel à l'action clair qui invite l'utilisateur à passer à la caisse. Un gros bouton ici devrait faire l'affaire, assurez-vous simplement qu'il est visible.

Ensuite, assurez-vous que le panier est interactif et affiche immédiatement les commentaires de l'acheteur lorsqu'il ajoute ou supprime des articles. De nombreux sites Web le font en affichant le nombre d'articles dans le panier dans le coin supérieur droit du site Web.

Enfin, assurez-vous que le panier que vous utilisez est hautement interactif. Autorisez les utilisateurs à modifier le nombre d'articles pour chaque produit qu'ils ont choisi sans quitter la page du panier. Les utilisateurs doivent pouvoir supprimer et ajouter des éléments à volonté, avec un processus aussi transparent que possible.

Conception mobile

Avec autant de trafic Web provenant du mobile, vous devez vous assurer que votre site Web de commerce électronique est optimisé pour le mobile. Comme les versions de bureau ou de tablette, il doit être entièrement réactif , ce qui signifie qu'il s'adapte à la taille de l'écran sur lequel il est visualisé, de sorte que les images et le texte ne soient pas déplacés. Les images doivent être compressées autant que possible afin qu'elles se chargent rapidement et ne consomment pas tout le forfait de données mobiles du visiteur.

La clé est de le rendre aussi simple que possible pour les personnes qui visitent votre boutique depuis leur téléphone. Vous ne voulez pas que cela prenne une éternité à charger, à apparaître drôle ou à manger toutes leurs données, sinon ils pourraient ne pas revenir.

Des médias sociaux

Les médias sociaux peuvent jouer un rôle énorme pour tout site Web de commerce électronique. Qu'il s'agisse de présenter vos produits sur une plate-forme comme Pinterest ou de donner des extraits d'informations à côté d'une image sur Facebook, vous pouvez utiliser les réseaux sociaux pour atteindre de nouveaux publics. Les liens vers vos réseaux sociaux doivent être clairement visibles dans plusieurs zones de votre site Web, comme dans votre menu principal, à côté des articles de blog et dans votre pied de page. Pouvoir communiquer avec vos abonnés (et leur faire partager vos produits avec leurs amis) aidera votre marque à se développer et à rester en contact avec ceux qui l'aiment le plus.

Conception de caisse

Enfin, il y a la conception de la caisse. Le paiement a lieu une fois que votre utilisateur a tout mis dans son panier et se trouve sur la dernière page, prêt à acheter. Cette page doit être simple et facile à naviguer, car vous ne voulez pas que quoi que ce soit les empêche de faire l'achat final. Considérer ce qui suit:

• Minimisez le nombre de boutons et d'étapes nécessaires.
• Rendre l'inscription facultative.
• Assurez-vous que toutes les erreurs ou raisons empêchant l'achat sont claires.
• Autoriser plusieurs méthodes de paiement.
• Offrez de l'aide s'ils rencontrent des problèmes.

N'oubliez pas que la page de paiement est la dernière chose qui se dresse entre le client et l'achat - ne la rendez pas plus difficile que nécessaire.

Derniers mots

Pour vos visiteurs, votre site de commerce électronique doit représenter une véritable expérience d'achat, plutôt qu'un simple site Web de plus. Il doit être conçu dans le but final de vendre vos produits. Tout, depuis la page d'accueil initiale, la conception et la mise en page, le panier d'achat et le paiement, doit être créé en tenant compte de l'expérience utilisateur. Cela garantira plus de succès pour votre entreprise de commerce électronique.