Traditionnellement les plateformes e-commerce sont construites sur des solutions monolithiques; c’est-à-dire, sur une technologie clef en main qu’il s’avère très souvent compliquée à administrer, maintenir et faire évoluer.
Alors quand vient le moment de changer d’outil ou simplement de réaliser une évolution, les délais, les efforts & les coûts s’envolent !
C’est pourquoi de plus en plus, la notion de “Headless” apporte un nouveau souffle dans le monde du e-commerce, en offrant flexibilité, malléabilité et liberté aux e-marchands.
Cap sur le Headless avec notre partenaire Front-Commerce, pour vous présenter cette alternative qui sera sans aucun doute la (votre) solution e-commerce de demain
1- Le headless c’est quoi ?
. Définition
D’après Google, le commerce Headless est défini comme étant « un scénario dans lequel une plateforme e-commerce possède des systèmes back-end et front-end qui sont découplés les uns des autres. Cela permet à l’entreprise d’apporter des modifications sans nécessiter de mises à jour complètes du développement d’une plateforme. »
Un système de gestion de contenu Headless se compose principalement d’une API et de la technologie de back-office requise pour stocker et distribuer les données. L’approche Headless permet aux développeurs de fournir un contenu en tant que service (CaaS), ce qui signifie simplement que le stockage et la livraison du contenu sont gérés par un logiciel distinct. Et ce n’est pas tout ! Un CMS Headless faisant simplement appel aux API, permet d’intégrer n’importe quelle base de code et utiliser votre langage préféré contrairement à un CMS traditionnel qui exige de suivre des règles et des langages de programmation spécifiques.
→ pour aller plus loin podcast de Front-Commerce
. Distinction front-end & back-end
Le front-end est la couche de présentation d’un site web ou d’une interface utilisateur. Quant au back-end il s’agit de la solution e-commercee utilisée pour gérer les fonctions et les données via les serveurs.
Concrètement, c’est grâce au front-end que l’utilisateur final va pouvoir interagir mais c’est le back-end qui lui donnera la possibilité d’action. Le front et le back sont ainsi complémentaires. Un site web ou une application ne pourra pas fonctionner sans l’un ou l’autre.
L’architecture Headless dissocie le front-end et le back-end afin qu’ils fonctionnent indépendamment. Ils sont découplés. Cela donne aux marques une liberté pour construire une expérience e-commerce sur-mesure en répondant au plus près aux besoins de leurs clients.
. Comment ça fonctionne ?
Une solution e-commerce se compose d’ordinaire d’une partie front-end (= “la tête” ou la vitrine du site ce qui est visible par l’internaute) et d’une partie back-end (= “le corps” soit la mécanique du site non visible pour l’internaute). Avec une solution Headless, traduction littérale “sans tête”, le travail sur le front-end peut être réalisé sans risquer de perturber le côté back-end et vice-versa. Pour bien comprendre, l’API est le cœur même de la technologie Headless. Les APIs sont des interfaces de programmation qui permettent de rendre possible la communication entre le back et le front.
Une fois “le corps” (back) mis en place, libre à vous de connecter une ou plusieurs “têtes” (front) selon votre activité, des besoins de vos clients et des tendances d’achat (achat sur smartphone, mobinaute, omnicanalité …).
Les grandes entreprises disposant d’équipes de développement et d’informatique sont de plus en plus séduites par cette solution et cela se comprend. Les ressources humaines et le budget engendrés habituellement pour développer, maintenir leur eshop, se retrouvent bien moindre que ce soit en coût qu’en temps passé. Les équipes “back-end” avancent simultanément que les équipes “front-end” sans avoir cette lourdeur du schéma classique de pré-production et de mise en production.
Kaporal, marque française de vêtements spécialisée dans le denim depuis 2004, s’est orientée en 2021 vers une solution Headless.
Kaporal commercialise ses produits dans plus de 100 boutiques physiques et via son site marchand développé jusqu’alors sur la solution Magento 1. Pour information, sur le marché français de la mode, kaporal.com c’est plus de 20 millions d’euros de ventes en ligne en 2021.
La solution Magento 1 de plus en plus vieillissante avec une forte vulnérabilité sur la partie front-end, a accéléré la volonté de changement de l’équipe de Kaporal, qui après étude sur les différentes possibilités (refonte Magento 2, changement de plateforme …) s’est orientée vers une migration “ architecture microservice”. Cette solution a été choisie pour pouvoir faire évoluer le plus efficacement possible le site, en préparant en parallèle l’avenir, avec la nécessité d’atteindre les meilleures améliorations de performance possibles. Et les chiffres sont plus que parlant ! L’utilisation de la technologie Headless à permis de diviser le coût de la migration M1 > M2 par 5 et le time to market par 4 tout en optimisant l’expérience client sur tout support confondu (mobile compris).
– 60% de taux de rebond
+15% de conversion sur desktop
et +8% de conversion sur mobile.
→ découvrez le user case KAPORAL de Front-Commerce
2- Objectifs et avantages
Le Headless Front-Commerce, réinvente la plateforme e-commerce d’aujourd’hui et offre de nombreux avantages.
Côté marchand
- Accélération du Time-to-market : moins de développement spécifique et de paramétrage, meilleure maîtrise du déploiement, système évolutif …
- Meilleurs KPIs: ROI, Taux de conversion (surtout sur mobile)
- Aucune limitation technique ! Il est possible de choisir les solutions technologiques les plus adaptées à votre activité pour construire sur-mesure votre plateforme.
- Réduction des coûts de développement et de maintenance
- Renforcement de la sécurité : le front-end et back-end étant découplés, les attaques extérieures menées sur le front-end sont davantage maîtrisées. Le back-end s’en retrouve plus protégé.
Côté client
- 100% Omnicanal pour un parcours d’achat unifié et simplifié
- UX personnalisé pour une image forte
- Expérience et navigation plus fluide, rapide, et mobile first
- Une actualisation régulière du site (sans compromettre la partie back-end) pour mettre en avant les nouveautés
Côté développeur
- Travailler avec des technologies modernes et avancées : reactJS ..
- 100% de liberté en design UX
- -15% de temps passé sur des tâches frontend
- Pas de duplication des données
3- Comment mettre en place une solution Headless ?
Avant de se lancer, il est important de savoir que deux options s’offrent à vous : Headless OpenSource vs Headless SaaS. Pour y voir plus clair entre ces deux possibilités, petit récapitulatif des forces et faiblesses de chaque option.
Headless OS
Forces
- le code source peut être modifié directement depuis la plateforme
- la personnalisation de votre plateforme est sans limite
- la communauté formée autour de cette solution, vous apporte solutions, modules déjà existants
- une grande autonomie sur l’évolution de votre plateforme et sur votre roadmap
Faiblesses
- avoir une équipe technique au profil plutôt sénior
- le time-to-market sera un peu plus long qu’avec une plateforme Headless en SaaS
- attention aux mises à jour qui ne sont pas effectuées automatiquement.
Exemples de solutions sur le marché : Adobe Commerce – Oro Commerce – Sylius
Headless SaaS
Forces
- solution “clef en main” qui nécessite moins de développements spécifiques
- gain de temps dans la gestion de la plateforme
- accélération du time-to-market
- le support et les mises à jour sont pris en charge par l’éditeur de la solution
Faiblesses
- le code source ne peut pas être modifié
- la personnalisation est limitée
- pas de communauté sur laquelle s’appuyer
- dépendance vis-à -vis de la roadmap de l’éditeur quant aux mises à jour et diverses évolutions.
Exemples de solutions sur le marché : BigCommerce – Commercetools
Conclusion
Les solutions Headless sont une vraie alternative aux solutions traditionnelles souvent fastidieuses à maintenir à jour. En effet ces solutions, aux architectures évolutives, permettent aux marchands d’innover et de construire leur plateforme brique par brique, pour pouvoir répondre aux tendances du marché. Les performances commerciales s’en trouvent directement impactées et positivement : accélération du time-to-market, meilleure expérience client, mutualisation des contenus et des services … Mais aussi un gain de temps, de coûts et d’énergie, des équipes techniques et marketing, qui travaillent en parallèle (et en toute sécurité) grâce aux découplages du front-end et du back-end.
Plus une minute à perdre pour vous renseigner sur cette solution, qui vous permettra non seulement de booster vos performances, d’augmenter vos ROI, de séduire vos clients et de motiver vos équipes.
Les équipes TBD en duo avec les équipes de notre partenaire Front-Commerce sont à vos côtés pour vous accompagner dans votre futur projet Headless.
English (UK) 