Buzzword-Alarm: “Headless”, was war das doch gleich?
Der Begriff “Headless” beschreibt eine Vielzahl an spezifischen Architekturen, denen die Idee gemein ist, dass das System in einen Körper („Body“) und einen Kopf („Head“) aufgeteilt ist. Der Körper wird dabei durch die Datenbank, den Server und im Hintergrund laufende Anwendungen wie das Backend gebildet. Der Kopf dient ausschließlich dazu, diese Daten abzurufen und in der Präsentationsschicht darzustellen.
Traditionell werden diese zwei Teilsysteme als Gesamtpaket geliefert, so dass man zumindest theoretisch nach der Installation der E-Commerce-Software auf einem geeigneten Server sofort damit beginnen kann, seine Produkte online zu verkaufen. E-Commerce-Frameworks wie Magento oder Shopware generieren klassischerweise beim ersten Aufruf einer Seite das HTML dynamisch aus den in der Datenbank hinterlegten Informationen, cachen es zur Beschleunigung zukünftiger Seitenaufrufe und senden es an den Browser des Nutzers, damit es dort beispielsweise als Produkt- oder Kategorieseite dargestellt werden kann. Die aktuellen Versionen dieser Shop-Systeme – Magento 2 und Shopware 6 – kommen zwar nach wie vor mit vorgefertigten Themes für die Darstellung im Browser, sind dabei aber im Hintergrund prinzipiell nach dem Headless-Paradigma aufgebaut.
Ein Headless-System kann auch komplett ohne ein Frontend auskommen. Stattdessen stellt es jede einzelne Funktion über Schnittstellen zur Verfügung, die dann von beliebigen Systemen angesprochen werden können, um Daten abzurufen oder Interaktionen wie das Registrieren eines Accounts oder die Tätigung einer Bestellung durchzuführen.
Die Frage ist jetzt natürlich: „Warum sollte ich das wollen? Warum soll ich zusätzliche Zeit und Geld in die Entwicklung eines eigenen Frontends für meinen Shop investieren, wenn sogar viele Systeme, die Headless sind, fertige Themes mitbringen, die nur noch angepasst werden müssen?“
Um dies zu beantworten möchten wir Ihnen fünf typische Anwendungsfälle für Headless-Systeme im E-Commerce mit ihren jeweiligen Vor- und Nachteilen vorstellen.
Progressive Web App (PWA)
Eine PWA ist eine eigenständige Anwendung, die meistens auf Smartphones eingesetzt wird und so etwas wie einen Hybrid aus einer mobilen Webseite und einer Native App darstellt. Die speziellen Vorteile von PWAs haben wir Ihnen bereits in der Vergangenheit in gesonderten CommerceBits-Artikeln vorgestellt.
Progressive Web Apps eignen sich insbesondere für Shops, die ein hohes Aufkommen an mobilem Traffic haben, da sie dank der Abfragesprache GraphQL sehr gezielt die Daten anfragen können, die sie zur Darstellung von Inhalten benötigen und so weitaus weniger Daten herunterladen müssen, als das bei einer klassischen HTML-Seite, die über einen Browser aufgerufen wird, der Fall ist. Damit ist die mobile User Experience weitaus weniger von einer schnellen und stabilen Internetverbindung abhängig. Die allermeisten Funktionen eines Shops können sogar offline genutzt werden. Sowohl Shopware 6 als auch Magento 2 bringen bereits eigene Frameworks für die Entwicklung von PWAs mit.
Nachteile von PWAs
Damit alle Vorteile von PWAs voll ausgeschöpft werden können müssen sie den Großteil der Daten bereits im Vorfeld laden und auf dem Endgerät vorrätig halten. Das bedeutet im Umkehrschluss, dass sie sich nicht für Shops mit großen Produktsortimenten eignen. Auch, wenn häufig Änderungen am Sortiment vorgenommen werden, muss die PWA die neuen Inhalte beim nächsten Start mit dem Mobilgerät synchronisieren. Daher eignen sich PWAs vor allem für Händler mit überschaubaren und stabilen Produktsortimenten. Und während PWAs größtenteils offline nutzbar sind, erfordern Aktionen wie das Aufgeben einer Bestellung oder für das Synchronisieren aktueller Preise natürlich immer noch eine aktive Internetverbindung.
CMS-Integrationen
CMS-Integrationen sind insbesondere dann nützlich, wenn das Konzept der User Experience primär auf Inhalten und Storytelling basiert. Denn während sowohl Shopware 6 als auch die Magento Commerce Edition umfangreiche CMS-Funktionen mitbringen, sind spezialisierte Content Management Systeme wie der Adobe Experience Manager (AEM) oder Typo3 in solchen Fällen immer noch die flexibelste Lösung.
Auch in Fällen, in denen bereits eine Homepage auf Basis eines CMS existiert, kann es sich lohnen, ein Headless-E-Commerce-Framework in dieses zu integrieren, anstatt einen komplett eigenen Online-Shop aufzusetzen, in dessen Bedienung die Content Manager dann auch noch zusätzlich geschult werden müssten. Eine solche Implementierung kann zudem in einigen Fällen schneller und kostengünstiger umgesetzt werden, als ein Shop mit eigenem Frontend.
Nachteile einer CMS-Integration
Der größte Nachteil besteht darin, dass es in den meisten Fällen keine vorgefertigten Lösungen gibt, um die Produkt- und Kategoriestrukturen, die im E-Commerce-System angelegt werden, direkt im Content Management System abzubilden. Hier ist dann also entweder etwas manueller Pflegeaufwand oder die Entwicklung spezialisierter Extensions, die dann dieser Aufgabe auf Seiten der CMS-Instanz erledigen, vonnöten.
Social Media-Integrationen
Viele Social Media-Plattformen bieten Unternehmen mittlerweile Möglichkeiten, um ihren Produktkatalog auf ihnen zu bewerben. Klassischerweise werden die User dann zum tatsächlichen Kauf auf den entsprechenden Online-Shop weitergeleitet. Mit Headless-Systemen hingegen wird die direkte Kaufabwicklung innerhalb von Facebook oder Instagram möglich.
Nachteile eines Social Checkouts
Der größte Nachteil dieser Option besteht darin, dass Sie sehr viel Kontrolle über die User Experience und das Design abgeben müssen. Eine Facebook- oder Instagram-Seite lässt sich nämlich weitaus weniger umfangreich gestalten, als dies bei einem System der Fall ist, das komplett in der Hand von Ihnen und Ihren Entwicklern liegt. Hinzu kommt, dass die User-Metriken, die Sie in Ihren Social Media-Kanälen überwachen können, weitaus weniger umfangreich sind als die Daten, die Sie auf Ihrer eigenen Webseite über Google Analytics oder Matomo einsehen können.
Ein Social Checkout ist für die manche Geschäftsmodelle ein nettes Plus, wird aber in den wenigsten Fällen den wichtigsten Umsatzkanal darstellen.
“Jetzt kaufen”-Button
Dies ist quasi die reduzierte Variante der weiter oben bereits vorgestellten CMS-Integration: Mit einem Headless E-Commerce-System im Rücken können Sie praktisch überall einen Button einfügen, über den Besucher ein Produkt direkt bei Ihnen kaufen können. Das muss nicht mal eine Webseite sein – selbst in YouTube-Videos steht Ihnen diese Option zur Verfügung. Da das Einfügen in den meisten Fällen manuell und je Anzeigeort geschehen muss eignet sich dieser Weg jedoch kaum, um eine Kauffunktion auf tausenden von Seiten einzubinden.
Dedizierte Frontend-Plattformen
In jüngerer Zeit sind ein paar Produkte auf den Markt gekommen, die ausschließlich für die Erstellung für Frontends eingesetzt werden können. ShoGun beispielsweise hat eine Frontend-Lösung geschaffen, die mit Shopify oder BigCommerce als Headless-System im Hintergrund selbst komplexe Inhaltsstrukturen leicht verwaltbar macht. Die Verwaltung von Accounts, Preisen und Katalogen erfolgt dabei weiterhin in dem jeweiligen E-Commerce-System. Wir rechnen damit, dass ähnliche Frameworks künftig auch für Magento oder Shopware auf den Markt kommen werden.
Falls Sie noch weitere Fragen zu Headless E-Commerce haben oder sich einfach nur darüber informieren wollen, wie Sie diese Technologien für Ihr eigenes E-Business einsetzen können, dann kontaktieren Sie uns einfach.