Headless-CMS-Implementierung für DTC-E-Commerce-Marke

Im Rahmen der Entwicklung einer groß angelegten DTC-Plattform für eine Familie von Healthcare-Marken hat B2X ein maßgeschneidertes E‑Commerce-Ökosystem aufgebaut, das Shopify als Commerce-Engine, Next.js/React als entkoppeltes Frontend und Contentful als Headless-CMS kombiniert. Ziel war es, eine skalierbare Content-Architektur zu schaffen, die mehrere Marken-Websites unterstützt, Marketing-Teams eigenständiges Arbeiten ermöglicht und sich nahtlos in einen composable Commerce-Stack integriert, während gleichzeitig hohe Performance- und SEO-Standards gewahrt bleiben.

Individuelle Digitale ProdukteKI-strukturierte Unternehmenswebsites

Healthcare & Regulated IndustrieseCommerce & Retail

Das Team hat alle notwendigen Leistungen erbracht, um die digitale Präsenz unserer Healthcare-Markenfamilie erfolgreich aufzubauen. Es wurde eine vollständige DTC-E-Commerce-Plattform mit individuellen Marken-Shops, einem dedizierten B2B-Shop sowie ERP-Integration umgesetzt, die zentral über ein Shopify-Plus-Backend verwaltet wird.

Oliver Freichel

Managing Director | Midas Healthcare GmbH

Herausforderung

Ausgangspunkt: Headless-Architektur

Im Rahmen eines groß angelegten DTC-Plattformentwicklungsprojekts für eine Familie von Gesundheitsmarken konzipierte und implementierte B2X Software ein maßgeschneidertes E‑Commerce-Ökosystem. Die Plattformarchitektur umfasste: Shopify als transaktionales Backend (Katalog, Checkout, Bestellungen) und Next.js / React als individuelle Frontend-Schicht. Da das Frontend vollständig entkoppelt und mit modernen Webtechnologien entwickelt wurde, war ein herkömmliches CMS oder Site-Builder nicht geeignet. Wir benötigten eine skalierbare Headless-Content-Architektur.

Contentful-Website, die auf einem Smartphone-Bildschirm angezeigt wird und die Überschrift „One dynamic content platform, infinite possibilities“ sowie eine Vorschau der Content-Management-Oberfläche zur Verwaltung und Personalisierung digitaler Inhalte zeigt.

Herausforderung

Die Auswahl des richtigen Headless CMS

Nachdem wir uns für einen Headless-Ansatz entschieden hatten, evaluierten wir mehrere Enterprise-CMS-Plattformen: Contentful, Strapi, Sanity.io und Storyblok.

Wir haben Contentful ausgewählt, weil es Folgendes bot:

Verwaltung mehrerer Projekte und mehrerer Spaces (Inhalte für mehrere Websites von Gesundheitsmarken können über ein einziges Organisationskonto mit voneinander isolierten Umgebungen verwaltet werden).
Etablierte Marktposition (eine der führenden Headless-CMS-Plattformen mit starker Unterstützung durch das Ökosystem).
Flexible Inhaltsmodellierung (hochgradig anpassbare Datenmodelle, die mit unserem individuellen Frontend und der Architektur unseres Designsystems abgestimmt sind).
API-first-Architektur (nahtlose Integration mit Next.js, CDN-Schicht und SEO-Tools).
Angemessene Preisstruktur (ausgewogene Preisgestaltung für Flexibilität auf Enterprise-Niveau).

CMS-Architekturdesign

Die CMS-Architektur wurde als strukturierte, API-gesteuerte Content-Schicht konzipiert, die vollständig in das composable DTC-Ökosystem integriert ist. Contentful fungierte als zentralisierte Content-Engine, während Shopify die transaktionale Logik übernahm und Next.js die Präsentationsebene renderte.

Inhaltsverwaltung

Wir strukturierten das CMS als eine zentrale Content-Management-Schicht, in der sämtliche Website-Inhalte – einschließlich PDPs, Blog- und Landingpages – erstellt und bearbeitet werden konnten:

SEO-Metadaten
Strukturierte, reichhaltige Inhalte
Autorenprofile
Kategorien
Verwandte Produkte
Schema-bereite Datenstrukturen

Redaktionelle Workflows

Die Implementierung ermöglichte:

Content-Editor zur Verwaltung von Artikeln über einen visuellen Editor
SEO-Team zur Steuerung von Metafeldern und Indexierungsregeln
Entwickler zur Nutzung strukturierter API-Ausgaben
Vorschau-Modus für Tests in der Live-Umgebung

Website-Builder-Funktionalität

Im Wesentlichen fungierte das CMS als ein strukturierter Site-Builder, der es Teams ermöglichte:

Inhaltsblöcke bearbeiten
Änderungen vor der Veröffentlichung prüfen
Strukturierte SEO-Einstellungen verwalten
Konsistenz über alle Marken hinweg wahren

Contentful CMS-Oberfläche mit Live-Bearbeitung einer HeroBlock-Komponente für die Startseite einer Healthcare-Marke, mit strukturierten Feldern auf der linken Seite und einer Echtzeitvorschau des Hero-Bereichs, der Navigation, der Überschrift und der CTA-Schaltfläche auf der rechten Seite.

Lösung

Integration von Design-Systemen in CMS-Datenmodelle

Einer der technisch komplexesten Aspekte der Implementierung bestand darin, das Designsystem mit der CMS-Architektur in Einklang zu bringen. Jede UI-Komponente – einschließlich Hero-Bereichen, Feature-Blöcken, Produkt-Highlights, Content-Grids, CTA-Sektionen und FAQ-Modulen – wurde einem entsprechenden CMS-Content-Modell zugeordnet. Jeder Block wurde als wiederverwendbarer Content-Typ definiert, der über strukturierte Felder konfigurierbar ist und über eine referenzbasierte Architektur verbunden wird. Dies stellte die Konsistenz zwischen Design- und Inhaltsstruktur sicher und ermöglichte zugleich den modularen Seitenaufbau innerhalb der Headless-Umgebung.

Contentful CMS-Oberfläche, in der ein Abonnement-Rabatt-Pop-up konfiguriert wird, mit strukturierten Feldern auf der linken Seite und einer Live-Vorschau des Werbemodals mit Preis, Produktbild, E-Mail-Feld und „Abonnieren“-Schaltfläche auf der rechten Seite.

Lösung

Page-Builder-Logik

Wir implementierten ein modulares System zur Seitenerstellung, bei dem Seiten aus dynamischen Blockreferenzen aufgebaut wurden, die mit dem Designsystem abgestimmt waren. Diese Struktur ermöglichte flexible Drag-and-Drop-Reihenfolgen, die Erstellung individueller Seiten, das Management von Weiterleitungen sowie die vollständige Kontrolle über URLs. Dadurch waren Marketing-Teams in der Lage, eigenständig neue Landingpages zu erstellen, Layouts aus vordefinierten Blöcken zusammenzustellen, die Markenkonsistenz zu wahren und Kampagnen ohne Eingriff von Entwicklern zu starten. Das CMS fungierte effektiv als kontrollierter, strukturierter Page Builder, der über das individuelle Next.js-Frontend gelegt wurde.

Auswirkungen eines Headless CMS auf die DTC-eCommerce-Architektur

Die headless Contentful-Implementierung innerhalb einer Shopify- + Next.js-Architektur erzielte messbare Verbesserungen in Bezug auf Performance, Release-Geschwindigkeit und Team-Effizienz – und ermöglichte dadurch schnellere Kampagnen, eine zügigere Feature-Iteration sowie durchgängig hohe Lighthouse-Scores.

30 % schnellere Feature-Iteration

Einheitliche Content- & Commerce-Architektur:

Vollständige Trennung von Content- und Commerce-Logik
Saubere, komponierbare Architektur (Shopify + Contentful + Next.js)
Verbesserte Wartbarkeit und schnellere Einführung neuer Funktionen

Ergebnis: Stabiles, leistungsstarkes Frontend mit schnellerer Seitenauslieferung

50 % schnellere Kampagnen-Startzyklen

Verbesserte bereichsübergreifende Effizienz:

Dev-, SEO- und Content-Teams, die in einem einheitlich strukturierten System zusammenarbeiten
Unabhängige Aktualisierung von Inhalten ohne Einbindung der Technikabteilung
Modularer Page-Builder für die schnelle Erstellung von Landingpages

Ergebnis: Verkürzte Time-to-Market für Marketinginitiativen und Werbekampagnen.