Zum Content

Ihre Headless Agentur
LIMESODA

Präsentieren Sie Ihre Inhalte flexibel in all Ihren digitalen Kanälen. Grenzenlose Designmöglichkeiten und Anpassung an Ihre Zielgruppen ohne Abhängigkeit von den Darstellungsmöglichkeiten eines bestimmten Systems. Perfekte Bedingungen für Entwickler:innen und die volle Kontrolle über alle Inhalte in der Marketing-Abteilung. Egal ob Headless CMS oder Headless Commerce, wir machen das!

Gabriela

OMG! Headless-Systeme haben ja gar keine sichtbare Darstellung der Inhalte!

Sebastian

Genau! Dadurch haben wir alle Freiheiten bei der Umsetzung des Frontends.

Beate

Und beim Design!

Was bedeutet Headless?

Websoftware besteht aus zwei Teilen: Dem sichtbaren Frontend („Head“), das Inhalte und alle Elemente zur Interaktion zeigt und dem unsichtbaren Backend („Body“), mit dem im Hintergrund die Inhalte verwaltet werden.

Headless-Systeme verzichten auf das Frontend und bestehen ausschließlich aus den Backend-Komponenten. Über integrierte Schnittstellen (API) verteilen sie die in ihnen gespeicherten Inhalte an beliebig viele Applikationen wie Webportale, Webshops oder Apps. Headless-Systeme sind hoch spezialisiert auf das Anlegen und Verwalten von Inhalten. Ergebnis dieser Entkoppelung von Frontend und Backend sind schlanke und flexible Systeme.

Welche CMS-Systeme gibt es?

Bevor wir entscheiden können, ob ein Headless-Ansatz für ein Projekt die beste Lösung wäre, lohnt sich ein Blick auf die verschiedenen Arten von Content Management Systemen (CMS). Eines haben sie alle gemein: Sie erlauben das einfache Anlegen und Bearbeiten von Inhalten ohne Programmierkenntnisse. Damit Inhalte für Website-Besucher:innen angezeigt werden können, braucht es immer ein Backend und ein Frontend, die im Zusammenhang mit Headless als Body und Head bezeichnet werden.

Exkurs: Frontend und Backend

Frontend

Unter Frontend jener Teil einer Website verstanden, der für die Besucher:innen im Browser sichtbar ist. Also das grafische User-Interface (GUI) bzw. die Darstellung des Designs. Das Frontend wird auch als Präsentationsschicht bezeichnet.

Backend

Das Backend ist nur für Redakteur:innen und Admins zugänglich. Dort erstellen und verwalten sie Inhalte, die später auf der Website zu sehen sind. Je besser das Backend gestaltet und organisiert ist, desto leichter fällt die Wartung der Inhalte.

Coupled CMS / klassisches CMS

Klassische CMS (auch Coupled CMS) stellen Frontend und Backend in einer monolithischen Plattform zur Verfügung. Frontend und Backend spielen innerhalb desselben Systems eng zusammen. Diese – im Internet am weitesten verbreiteten – Systeme sind darauf optimiert, die Inhalte einer Website anzulegen und diese darzustellen. Es gibt sie in unterschiedlichen Varianten von lizenzpflichtig bis Open Source und von On-Premise bis zu Cloud-Hosting. Klassische CMS sind weiterhin in vielen Fällen die erste Wahl, wenn es um Webseiten geht.

Headless CMS

Ein Headless CMS ist eine reine Backend-Applikation. Es erlaubt Frontend-agnostisch die strukturierte Erfassung und Bearbeitung von Inhalten. Die Auslieferung von Bildern, Texten, Videos usw. erfolgt ausschließlich über Schnittstellen (API). Daher wird hier auch oft vom API-first-Ansatz gesprochen. Problemlos können dieselben Inhalte mehrfach verwendet und an völlig unterschiedlich aussehende Plattformen ausgeliefert werden. Für die Darstellung braucht es pro Ausgabeplattform ein eigenes Frontend in einem separaten System. Oft kommen hier JavasScript-Frameworks wie React zum Einsatz. Auch Dinge wie Suche, oder Kundenlogin müssen bei Bedarf über das Frontend abgebildet werden.

Diese CMS-Variante ermöglicht die zentrale Verwaltung von Inhalten für so unterschiedlichen Ausgabegeräten wie Smart-TV, Smart-Watch, POS-Display, Voice, Webshop oder eben diversen Webseiten. Jede Plattform zeigt nur die gewünschten Inhalte aus dem Headless CMS im gewünschten Design an. Somit greifen alle digitalen Kanäle Ihres Unternehmens nahtlos ineinander über.

Decoupled CMS

Sogenannte Decoupled CMS versuchen, das Beste aus den beiden zuvor genannten Welten zu vereinen. Es handelt sich um einen Hybrid aus klassischem und Headless CMS. Das Decoupled CMS verfügt über Frontend und Backend, zusätzlich aber auch über eine API, die Content ausliefern kann. Das Frontend ist in der Regel nur lose gekoppelt oder kommuniziert ausschließlich über Schnittstellen. Damit werden Bedienungsfreundlichkeit des klassischen CMS und Multichannelfähigkeit der Headless-Variante vereint.

Die gute Nachricht: Viele „klassische“ Content Management und Webshop Systeme können zu einem Decoupled CMS gemacht werden. Sie bieten Schnittstellen an, über die man ein losgelöstes Frontend erstellen oder Inhalte für die Integration mit anderen Systemen zur Verfügung stellen kann:

  • WordPress bietet neben dem traditionellen Frontend eine REST-Schnittstelle und kann damit als Headless-Lösung eingesetzt werden.
  • TYPO3 verfügt über ein populäres Community-Projekt, das große Fortschritte macht und TYPO3 zu einem Decoupled/Headless-CMS werden lässt. Die Extension ist Open Source und es werden keine Lizenzkosten fällig.
  • Webshop-Systeme wie Adobe Commerce / Magento und Shopware 6 sind ebenfalls über Schnittstellen ansprech-, ausles- und steuerbar. Besonders Shopware 6 wurde über den „API first“-Ansatz entwickelt und ist damit vollständig „Decoupled“: Es liefert ein „traditionelles“ Frontend mit, kann aber gleichzeitig zu 100 Prozent als Headless-Lösung eingesetzt werden.

Entscheidungshilfe: Klassisches CMS vs. Headless CMS vs. Decoupled CMS

Jedes System hat seine Vorteile und die Übergänge sind fließend. Es gilt, das beste Konzept für Ihre Anforderung zu finden! Hier ein kleiner Überblick:

Multichannel-Fähigkeit

Auch viele klassische CMS sind mehrmandantenfähig. Damit können mehrere Websites im selben System verwaltet werden. Wenn neben Websites auch völlig andere Plattformen wie Smart-Watches, Smart-TVs oder Voice-Anwendungen beliefert werden sollen, dann spricht viel für eine API, wie sie bei Headless oder auch Decoupled CMS verfügbar sind. Für jede Plattform muss dann jedoch auch ein separates Frontend auf einer separaten Serverplattform gebaut werden. In dieselbe Kerbe schlägt die Frage nach dem Fokus bei der Content-Erstellung. Geht es darum, viele Inhalte sehr strukturiert zu erfassen und erst später für verschiedene Ausgabegeräte aufzubereiten, eignen sich eine Headless CMS sehr gut. Sogenannte Content-Plattformen noch mehr. Diese fokussieren auf die Organisation von Medien ohne Rücksicht auf die spätere Verwendung.

Investition

Bei Headless-Anwendungen muss in der Regel viel Aufwand in die Schnittstellenkommunikation und vor allem in die Ausgestaltung des Frontends gesteckt werden. Das Frontend besteht aus einem oder mehreren, zusätzlichen Systemen. Dies ist bei entsprechenden Projektanforderungen gut und notwendig, bedeutet aber zusätzlichen Aufwand. Solange ein klassisches CMS die Anforderungen abdeckt, wird das die günstigere Lösung sein. Bei der Abwägung zwischen einmaligen und laufenden Kosten hat die Frage nach lizenzfreien (Open Source) oder lizenzpflichtigen Systemen und hier speziell nach Software-as-a-Service (SaaS) einen Einfluss. Alle Gattungen gibt es für alle CMS-Varianten.

Bedienungsfreundlichkeit im Backend

Unabhängig von der Systemarchitektur sollten Sie darauf achten, wie leicht sich ein CMS für Redakteur:innen bedienen lässt. Wie können Inhalte erstellt und abgelegt werden? Wie baut man Seiten zusammen? Wo werden Menüpunkte und URLs gewartet? Wie funktioniert die Mehrsprachigkeit? Ob Headless oder nicht, hat keinen Einfluss auf diese Antworten.

User Experience (UX) im Frontend

Egal welche CMS-Architektur Sie wählen, das Frontend kann immer individuell gestaltet werden. Beim UX Design gibt es keine Grenzen.

Businesslogik/Features

Speziell Headless CMS werden oft als SaaS-Varianten angeboten und können über die API leicht in andere Systeme integriert werden. Passen die Features zu den eigenen Projektanforderungen, steht einer schnellen Umsetzung nichts im Weg. Sind jedoch tiefgehende Anpassungen der Businesslogik erforderlich, wird es mit SaaS-Systemen komplizierter. Auch sonst muss im Headless-Fall sehr viel Logik im Frontend abgebildet werden, was in Bezug auf Performance und Sicherheit großen Aufwand bedeuten kann. Keinesfalls ist es unmöglich, wie schon zuvor erwähnt müssen nur Nutzen und Aufwand gegenüber gestellt haben. Manchmal sind hier klassische CMS einfacher anzupassen.

Cloud Hosting/SaaS

In Zusammenhang mit Headless wird auch Cloud-first oft als Ansatz genannt. Der Anbieter kümmert sich hier um die Verfügbarkeit und Updates des Backends. Man ist hier „locked-in“, Anpassungen der Features oder Anbieterwechsel sind kaum möglich. Bei Projekten mit stark wechselnden Last-Szenarien sind Cloud-Lösungen von Vorteil, weil sie sehr performant sind und nicht immer die maximalen Ressourcen vorgehalten werden müssen.

On-Premise Hosting

Vorteile sind Unabhängigkeit und hohe Flexibilität. Alles kann nach eigenen Wünschen gestaltet werden. Dafür muss man sich um Hosting und Updates selbst kümmern.

Wahl der Agentur wichtiger als Wahl von Architektur und System

Lassen Sie sich nicht von Buzzwords blenden. Für die meisten Projekte gibt es mehrere sinnvolle Umsetzungsvarianten, deren Bewertung nicht trivial ist. Bei manchen Systemen sind die Unterschiede geringer als von den Herstellern dargestellt. Wichtiger als die Systemwahl ist die Wahl des richtigen Dienstleisters, der Erfahrung mit möglichst allen Varianten hat und auch alle anbietet. Andernfalls erhalten sie nicht alle notwendigen Entscheidungsgrundlagen. Je nach verfügbarer Zeit, dem Budget, den aktuellen und künftigen Anforderungen entwickeln wir mit Ihnen gerne die richtige Lösung.

Systeme für Ihre Headless-Lösung

Headless CMS

Storyblok

storyblok Certified Partner

Mit dem cloudbasierten Headless CMS Storyblok verfügen Sie über einen schnell einsatzfähigen Content Hub für Website, App oder auch Voice-Inhalte. Storyblok bietet ein flexibles Lizenzsystem und lässt sich perfekt an die Anforderungen mittlerer und großer Organisationen anpassen. Storyblok lässt sich sehr gut in Shopware oder Magento/Adobe Commerce integrieren. Wir sind offizielle Storyblok-Implementierungspartner!

Decoupled CMS

WordPress

WordPress Logo

Obwohl es als komplettes CMS inklusive Frontend ausgeliefert wird, verfügt das Open-Source-System WordPress über eine mächtige REST-API und kann damit auch als Headless-Lösung eingesetzt werden. Beispielsweise, um eine Single Page App um CMS-Funktionalität zu erweitern oder weil es sich schon im Tech-Stack eines Unternehmens befindet. Unser WordPress-Team berät Sie gerne!

Klassisches CMS, durch API ergänzbar

TYPO3

TYPO3 Logo

Das bewährte CMS TYPO3 zeichnet sich durch hohe Benutzerfreundlichkeit für Webprojekte mit komplexen Anforderungen aus. Mehrere Websites, Sprachen und Lokalisierungen können im Backend leicht verwaltet werden. Mit der Template-Engine Fluid kann auch das Frontend schnell umgesetzt werden. Die Auslieferung von unterschiedlichem Code für unterschiedliche Plattformen ist kein Problem. Sollte dies nicht reichen, ist über Extensions die Erweiterung um API-Funktionalitäten möglich. Dies erfolgt über ein populäres Community-Projekt, das große Fortschritte macht und TYPO3 zu einem Decoupled/Headless-CMS werden lässt. Die Extension ist Open Source und es werden keine Lizenzkosten fällig. Wir sind offizielle TYPO3-Partner!

Headless Commerce mit decoupled Shopsystem

Shopware 6

Shopware Logo

Shopware 6 wurde über den „API first“-Ansatz entwickelt und ist damit vollständig „Decoupled“: Es liefert ein „traditionelles“ Frontend mit, kann aber gleichzeitig zu 100 Prozent als Headless-Lösung eingesetzt werden. Wir sind offizielle Shopware-Partner!

Shopsystem mit mächtiger API

Adobe Commerce / Magento

Magento Logo

Der mächtige Alleskönner unter den Shopsystemen wird mit eigenem Frontend ausgeliefert. Magento verfügt aber über eine mächtige REST-API und kann auch komplett headless angebunden werden. Unser Team ist für Magento zertifiziert!

Das meinen unsere Kund:innen

Im Namen der abc möchte ich mich bei euch für das absolut geniale Ergebnis herzlich bedanken. Die neue Website ist nicht mehr wiederzuerkennen und den Mitarbeitern gefällt es unglaublich gut. Die Zusammenarbeit mit euch schätze ich wirklich sehr!
Raffael Huez
abc dental, Leiter Marketing & Services
Dem BSVWNB ist bei Websites neben einer übersichtlichen und gut bedienbaren Struktur natürlich auch die Barrierefreiheit ein großes Anliegen. Mit LIMESODA haben wir einen Partner, der unsere Anliegen ernst nimmt und gewissenhaft umsetzt.
Mag. Martin Tree, Öffentlichkeitsarbeit BSVWNB

Häufige Fragen zum Thema Headless

Beim API-first-Ansatz definieren Entwickler:innen zuerst, welche Geschäftsanforderungen Schnittstellen erfüllen müssen, bevor die eigentliche Programmierung startet. Anwendungen können so leichter in andere Systeme integriert werden. Je standardisierter Schnittstellen funktionieren, desto schneller können Services miteinander verknüpft werden.

Hauptargument für ein Headless CMS ist die Syndizierung der Inhalte auf mehrere unterschiedliche Plattformen. Auch wenn diese Systeme darüber hinaus weitere Vorteile haben, wird sich der mit einem Umstieg verbundene Aufwand nur rechnen, wenn das Bespielen mehrerer Plattformen eine wichtige Anforderung ist. Schließlich verursacht die Kommunikation über Schnittstellen zusätzlichen Aufwand. Viel Business-Logik muss im Frontend untergebracht werden und für die IT-Sicherheit sind doppelte Validierungen in Frontend und Backend notwendig. Solange ein traditionelles CMS ihre Anforderungen gut erfüllt, ist es vermutlich die bessere Wahl.

Solange ein traditionelles CMS Ihre Projektvorgaben erfüllt, wird es eine geringere Investition erfordern, da keine zusätzliche Schnittstellenkommunikation programmiert werden muss. Müssen Inhalte an mehrere unterschiedliche Plattformen geliefert werden, spielt das Headless CMS zunehmend seine Vorteile aus, weil Inhalte leichter verteilt werden können. Die Systemwahl ist dabei ein weiterer Faktor. Cloud oder On-Premise-Hosting, lizenzfreies oder lizenzpflichtiges System – diese Fragen wirken sich auf das Verhältnis von initialer und laufender Investition aus.