Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

Les 5 clés d'un E-COMMERCE GAGNANT !

852 vues

Publié le

Présentation faîtes lors du WordCamp Marseille le 15 septembre 2017.

Publié dans : Internet
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Les 5 clés d'un E-COMMERCE GAGNANT !

  1. 1. Les 5 clés d’un E-COMMERCE GAGNANT ! #WCMarseille #Ecommerce #WooCommerce Sandra Boulou
  2. 2. Sandra Boulou @Web18_Paris www.web18.net
  3. 3. AVANT-PROPOS : quelques chiffres… 1 - La page d’accueil : un design stratégique 2 - Une navigation et une ergonomie fonctionnelles 3 - Des fiches produits détaillées 4 - Optimiser le tunnel de commande 5 - La cerise sur le gâteau ! Extensions et sources
  4. 4. AVANT-PROPOS Le E-Commerce en France Solutions Chiffres Utilisateurs
  5. 5. LES SOLUTIONS E-COMMERCE LES PLUS UTILISÉES EN FRANCE 28 % WooCommerce 27 % Prestashop 13 % Zencart 7 % Os Commerce Source : Build with https://trends.builtwith.com
  6. 6. 2017 : 80 MILLIARDS € de CA en prévision 2016 : 72 MILLIARDS € de CA croissance annuelle : +14,6% L’E-COMMERCE EN FRANCE EN 2016
  7. 7. Plus de 200 000 SITES MARCHANDS actifs en 2016 SOIT 1 SITE TOUTES LES 20 MN
  8. 8. 36,6 Millions de français achètent sur internet soit 82,7 % des internautes 1/4 sur mobiles soit 25 % des ventes Le CA sur mobiles a été multiplié par 10 en 5 ans Il faut offrir un PARCOURS et un DESIGN ECOMMERCE orientés pour TOUS les utilisateurs sources : Médiamétrie / FEVAD
  9. 9. Penser Accessibilité dès de la conception d’un site Ecommerce est incontournable : 12 millions de Français sont en situation de handicap soit 1 personne sur 6 qui achète régulièrement sur internet (chiffres Insee) Les consommateurs de + de 50 ans consomment davantage en ligne que les autres tranches d’âges (enquête Priceminister – Rakuten)
  10. 10. Les 65 ans et + achètent quasiment autant que les 18-24 ans avec un pouvoir d’achat plus important (enquête Idaleo.fr) Cette cible client est incontournable Il est primordial d’OPTIMISER le PARCOURS UTILISATEUR et le TUNNEL D’ACHAT : COMMENCONS PAR LE DEBUT DU PARCOURS DU CYBER ACHETEUR
  11. 11. 1 / LA PAGE D’ACCUEIL : UN DESIGN STRATÉGIQUE
  12. 12. C’est une page SYMBOLIQUE FORTE Le responsive est un Must (adapter les contenus) Elle doit être attrayante : design, visuels… Elle doit être convaincante et donner envie Elle doit être rassurante : infos, messages, couleurs Clarté et simplicité sont les meilleurs atouts
  13. 13. Hiérarchiser les informations Tenir compte des zones de perception immédiates (cf études de Eyes tracking déterminant les zones « froides » et « chaudes » d’une page web) Eyes tracking : technique qui permet de suivre les mouvements de l’œil, parcours et points de fixation Schéma des zones froides et chaudes (ci-après)
  14. 14. LE DIAPORAMA CREATION D’APPELS À L’ACTION / CALL TO ACTION Quelques exemples avec les sites les plus visités en France
  15. 15. Amazon – 5 slides vers les offres et services du moment
  16. 16. Cdiscount : slides vers les offres et remises du moment + utilisation de la couleur orange
  17. 17. Fnac : slides vers les bons plans du moment + lien vers les produits en promotions
  18. 18. Définir clairement l’univers de la boutique Visibilité du logo, identité (en haut à gauche) Les spécialités : souvent les catégories de produits Les produits phares Les Nouveautés Les meilleures ventes / les mieux notés Les produits en promotion / offres du moment
  19. 19. Les infos indispensables et rassurantes doivent être présentes sur toutes les pages. DANS LE TOP MENU ET LE HEADER : Compte client / Favoris wishlist / Panier toujours visible
  20. 20. Les livraisons / le retrait rapide / click & collect / les magasins Un bouton aide / Besoin d’aide ? peut aussi rassurer Voir les sites de la Fnac et Boulanger ci-dessous :
  21. 21. DANS VOTRE PIED DE PAGE / FOOTER A propos : présentation / Contacts / Service client / FAQ Conditions de livraisons / Retours / Remboursements Abonnement Newsletter (fort impact en Ecommerce) Les réseaux sociaux (79% des Ecommerçants utilisent Facebook) Les Informations légales (CGV - mentions légales - cookies) Les Moyens de paiement et la sécurité
  22. 22. Pied de page / footer site BOULANGER
  23. 23. Pied de page / footer site de la FNAC
  24. 24. 2 / UNE NAVIGATION & UNE ERGONOMIE FONCTIONNELLES
  25. 25. Avoir une NAVIGATION CLAIRE & INTUITIVE Vous pouvez avoir le plus beau des sites si l’ergonomie est nulle = faible taux de conversion = peu de vente Respecter la règle des 3 clics pour trouver un produit Intégrer un menu collant / sticky menu Un retour vers le haut / scroll to top très pratique
  26. 26. Offrir un PARCOURS D’ACHAT SIMPLE, RAPIDE & EFFICACE PLUSIEURS TYPES DE NAVIGATION sont possibles : ü NAVIGATION SIMPLE par rubriques & thèmes par catégories, sous catégories et produits ü DOUBLE NAVIGATION (à gauche) et horizontale
  27. 27. L’UTILISATION DES MEGAS MENUS est très présente : pratique quand vous avez beaucoup de catégories, sous-catégories et produits. On le voit parmi les sites les plus visités en France et recensés par la FEVAD : Amazon, Cdiscount, Fnac, Ebay, la Redoute, Darty…
  28. 28. Amazon : utilise un moteur de recherche interne central Un méga menu Parcourir les rayons avec un menu latéral
  29. 29. La Fnac : menu vertical à gauche de l’écran, avec l’affichage d’un méga menu à droite & des étiquettes de produits en haut
  30. 30. CDiscount : à nouveau un moteur de recherche central, un menu thématique et un méga menu horizontal
  31. 31. Ebay : un méga menu horizontal épuré, avec des Top catégories et catégories de produits + un visuel pour la catégorie et un bouton d’appel
  32. 32. La Redoute : méga menu horizontal noir, épuré et aéré Offres du moment, Catégories, Marques et un visuel
  33. 33. Carrefour : double navigation + moteur de recherche central
  34. 34. COMME NOUS VENONS DE LE VOIR : Intégrer un moteur de recherche dans le menu Dans WooCommerce : laisser les filtres de recherche en page Boutique / Shop qui offre une recherche par popularité, Nouveautés, prix… Proposez un filtre par marque si besoin (en widget)
  35. 35. 3 / DES FICHES PRODUITS DETAILLÉES
  36. 36. C’est l’élément ESSENTIEL et STRATEGIQUE du site Elles doivent être compréhensibles et détaillées Richement illustrées par des visuels de qualité Répondre à toutes les interrogations du clients Avoir un descriptif complet et exacte Afficher les infos de réassurance = donner confiance : avis clients, notes, livraisons, retours, garanties…
  37. 37. Les principales caractéristiques, les points forts… Un bouton d’ajout au panier bien visible Le stock disponible La référence du produit Une belle image produit, de grands visuels, zooms Des vidéos ou même une visite 3D si besoin
  38. 38. La Fnac : tout pour avoir confiance !
  39. 39. Une liste de souhaits / liste de course / Wishlist Un comparatif produits Les produits similaires / apparentés Les ventes croisées = cross selling Les montées de gammes = up selling Le partage sur les réseaux sociaux
  40. 40. DARTY Un bel exemple de fiche produit Complet et détaillé
  41. 41. LEROY MERLIN Autre exemple de fiche produit intéressante Avec la vidéo et un systeme de Tchat
  42. 42. CLARINS Autre exemple de fiche produit intéressante Avec une vidéo, des conseils…
  43. 43. Clarins Vidéo Conseils Avis Produits apparentés Favoris Livraison & Paiement
  44. 44. 4 / OPTIMISER LE TUNNEL DE COMMANDE & LE TUNNEL D’ACHAT
  45. 45. Le parcours utilisateur est souvent long depuis LA FICHE PRODUIT Le tunnel classique est souvent composé de : PANIER / IDENTIFICATION / CONNEXION si besoin INSCRIPTION LIVRAISON - PAIEMENT
  46. 46. Ces étapes sont fastidieuses surtout sur mobile Tout faire pour réduire l’abandon de panier (taux moyen d’abandon du 4e T 2016 : 76,8 % ) Par la fluidité des pages (cela tout au long du site) Avoir un récapitulatif de commande clair & simple Ne pas forcer la création du compte client
  47. 47. Annoncez clairement les frais & délais de livraison Une offre de livraison rapide à bas prix (voire gratuite) Un retrait en point de vente quand c’est possible La livraison et le Retour en Point Relais Des infos de contacts toujours visibles Un lien vers les CGV en fin de commande
  48. 48. Proposez plusieurs solutions de paiement Suivant le type de site, QUAND C’EST POSSIBLE : Réduire les étapes permettant d’arriver au paiement L’IDÉAL : 1 / 2 PAGES RÉCAPITULATIVES de checkout Un processus de commande / paiement simplifié = une hausse du taux de conversion
  49. 49. 5 / LA CERISE SUR LE GÂTEAU !
  50. 50. CONVERTISSEZ VOTRE SITE E-COMMERCE EN APPLICATION MOBILE !
  51. 51. Le M-Commerce ne cesse de croître (chiffres Fevad) 80% des mobinautes possèdent 1 à 50 applications Plus de 50% des tablonautes ont acheté sur le web Les applis ont des taux de conversion supérieurs aux desktop (étude Critéo)
  52. 52. Suivant l’activité et les produits que vous vendez la conversion en application est gagnante Il faut : vendre des produits récurrents et avoir une bonne navigation (penser applis) L’application est fluide & disponible hors connexion On peut passer des commandes hors connexion On peut créer un panier hors connexion
  53. 53. On peut bien sûr payer sur l’appli Ecommerce Possibilité d’envoi de notifications push pour des événements importants, des promotions… Mise à jour automatique du contenu, produits, articles… Possibilité de faire de la publicité sur mobile
  54. 54. EXTENSIONS WOOCOMMERCE WooCommerce ;-) en un clic vous activez un Ecommerce De nombreuses extensions gratuites et payantes existent pour développer les possibilités de votre site Ecommerce
  55. 55. FICHES PRODUITS : Custom Related Products for WooCommerce : personnaliser les produits en relation - gratuit WooCommerce brands : insérer un filtre de recherche par marque WooCommerce Product Add-ons : permet d’ajouter des fonctionnalités à la fiche produit
  56. 56. FICHES PRODUITS - suite : WooCommerce Tab manager : personnaliser et ajouter des onglets aux fiches produits YITH WooCommerce Wishlist : proposer une liste de course - gratuit YITH WooCommerce compare : comparer les produits entre eux – gratuit
  57. 57. PAIEMENTS : PAIEMENT SUR UNE SEULE PAGE : WooCommerce one page checkout SOLUTIONS DE PAIEMENT GRATUITES : Stripe - Payplug – Paypal PASSERELLES DE PAIEMENTS des banques françaises : Absolute web – Nicolas Maillard
  58. 58. LIVRAISONS : Colissimo : Colissimo delivery integration (CDI) - gratuit Boxter (envoi moins cher) : permet de proposer plusieurs transporteurs en un seul module - gratuit WooCommerce Conditional Shipping and Payments : Permet d’ajouter / gérer des règles de livraisons spécifiques (catégories, pays…)
  59. 59. APPLICATIONS MOBILE & WOOCOMMERCE : Wpapp.ninja : Solution française Convertit votre Ecommerce en application mobile Wordapp : Solution en anglais Existe une version gratuite et une version pro payante
  60. 60. SOURCES : Médiamétrie / Fevad : chiffres Ecommmerce 2016 et 1er trim. 2017 Insee / mars 2017 : les derniers chiffres sur le handicap en France Salecycle.fr : tendance remarketing 4e trimestre 2016 Priceminister - Rakuten : les seniors et le Ecommerce Etude Idaleo.fr comparatif de prix sur les seniors et le Ecommerce Les Echos.fr « et si le Ecommerce était aussi une affaire de vieux » Etude Critéo : rapport sur le Ecommerce mobile Mobvalue : études et chiffres sur les mobinautes français Remerciements à Claire Bizingre @accesbilis spécialiste en accessibilité

×