Ab Mitte 2025 sind barrierefreie Webseiten in Deutschland durch das BFSG gesetzlich vorgeschrieben. Da sich viele Menschen noch nicht viel darunter vorstellen können, wie moderne, barrierefreie Webseiten aussehen, haben wir hier unsere Top Beispiele für barrierefreie Webseiten zusammengestellt. 

Top Beispiele für barrierefreie Webseiten

Entdecken Sie unsere Top Beispiele für barrierefreie Webseiten. Erfahren Sie, wie modernes Webdesign inklusiv gestaltet werden kann und gesetzliche Vorgaben erfüllt.

Barrierefreie Webseiten haben in Deutschland oft noch einen faden Beigeschmack. Viele Menschen stellen sich darunter eine triste, graue Website mit riesigen Texten und möglichst wenig Bildern vor. Das muss nicht sein, denn die offiziellen Richtlinien für barrierefreie Webseiten (engl. Web Content Accessibility Guidelines, kurz WCAG) geben Unternehmen und öffentlichen Stellen genügend Möglichkeiten, authentische, moderne und gleichzeitig barrierefreie Webseiten zu entwickeln. 

Im Folgenden stellen wir vier unserer besten Beispiele für barrierefreie Webseiten vor, die von allen Menschen ohne größere Schwierigkeiten und ohne fremde Hilfe genutzt werden können.

Das riesige US-Tech-Unternehmen aus den USA macht in Sachen digitaler Barrierefreiheit bereits vieles richtig. Neben einer barrierefreien Website und einem barrierefreien Online-Shop integriert Apple jährlich neue Funktionen in seine Geräte, um eine barrierefreie Nutzung zu gewährleisten.

So verfügen alle iPhones und MacBooks über eine integrierte VoiceOver-Funktion, mit der Sie sich Texte auf dem Bildschirm oder Ihre Texteingaben vorlesen lassen können. Wie Sie diese Funktion auf Ihrem iPhone aktivieren, erfahren Sie im folgenden Artikel von Apple: iPhone Benutzerhandbuch

Darüber hinaus können Apple Geräte die Schriftgröße bestimmter Apps dynamisch anpassen, sich Kontrast-Einstellungen merken oder das Smartphone von der Sprachassistentin Siri steuern lassen.

Eine Übersicht über alle Funktionen, die Apple in seinen Geräten für eine barrierefreie Nutzung integriert hat, finden Sie im folgenden Artikel: Apple Accessibility

Mit unserem Accessibility Audit analysieren wir Ihre Website umfassend auf digitale Barrieren und geben konkrete Handlungsempfehlungen.

Auch Ihre Website soll barrierefrei werden?

Mehr über den Accessibility Check erfahren

Wise, ehemals TransferWise, ist ein britisches FinTech-Unternehmen, das sich auf internationale Geldtransfers spezialisiert hat und schnelle Überweisungen in verschiedene Währungen anbietet.

Im vergangenen Jahr hat Wise sein neues Rebranding veröffentlicht und dabei ein barrierefreies und inklusives Design-System entwickelt, das für alle zugänglich und gleichzeitig visuell ansprechend ist. Ein zentrales Element des neuen Markenauftritts ist die komplett neu gestaltete Farbpalette, die für alle Menschen gut wahrnehmbar ist und alle Kontrast-Richtlinien der Web Content Accessibility Guidelines (WCAG) berücksichtigt.

Diese besagen, dass große Texte wie etwas Überschriften und interaktive grafische Elemente mindestens ein Kontrastverhältnis von 3:1 zwischen Vorder- und Hintergrundfarbe aufweisen müssen, damit auch Menschen mit Behinderungen Texte und Bilder auf der Webseite wahrnehmen können. 

Während des gesamten Reranding-Prozesses wurde die Farbpalette immer wieder mit Tools wie Contrast Checker (von WebAIM) oder dem Figma Plugin Color Blind Simulator getestet. Darüber hinaus wurde bereits in der Konzeptionsphase viel Empathie für alle Zielgruppen entwickelt, um deren Wünsche und Bedürfnisse zu verstehen und ein inklusives Webdesign zu entwickeln.

Den vollständigen Artikel von Wise zum Rebranding-Prozess finden Sie hier. Einen Überblick über das neue Branding finden Sie auf der Landingpage der Designabteilung von Wise.

Anlässlich des 75. Geburtstag hat Porsche letztes Jahr neben seinem ikonischen Wappen auch die Webseite und den Onlineshop modernisiert. Außerdem wurde eine neue Version des Design Systems mit barrierefreien Figma Libraries und ready-to-use Web Components veröffentlicht.

Auf der Startseite der Porsche Webseite hat man nun die Möglichkeit, das Video zu pausieren. Dies minimale Änderung ist ein weiterer Schritt in Richtung digitale Barrierefreiheit. Nach dem internationalen Standard für barrierefreie Webinhalte (Web Content Accessibility Guidelines, kurz WCAG) müssen Nutzer Animationen, die länger als fünf Sekunden dauern, anhalten können. Genauer gesagt müssen Nutzer in der Lage sein, die Website mit allen ihren Elementen zu bedienen, um so viel Kontrolle wie möglich zu haben. Für das Video auf der Porsche Webseite bedeutet dies, dass der Nutzer selbst entscheiden kann, ob das Video weiterlaufen soll oder nicht.

Auch abseits der großen, weltweit bekannten Marken tun Regierungen, Behörden und öffentliche Einrichtungen bereits viel, um digitale Barrieren zu minimieren.

Wenn Sie beispielsweise die Website der Bundesregierung besuchen, werden Ihnen wahrscheinlich Inhalte und Elemente auffallen, die Sie nicht unbedingt auf einer Unternehmenswebsite finden. So gibt es im Header (der Website) zwei Links zu Inhalten in Gebärdensprache und in Leichter Sprache. Darüber hinaus gibt es im Footer weitere Links zur “Erklärung zur Barrierefreiheit” und zum Formular “Barrieren melden”.  

Öffentliche Einrichtungen sind im Gegensatz zu privaten Unternehmen verpflichtet, ihre digitalen Angebote nach den Richtlinien der WCAG und der BITV barrierefrei zu gestalten. Die BITV definiert neben den internationalen Richtlinien zur Barrierefreiheit weitere Anforderungen, die bei der Gestaltung digitaler Inhalte zu beachten sind. So müssen beispielsweise Inhalte in leichter Sprache auch für Menschen mit kognitiven Einschränkungen lesbar sein.

Für öffentliche Stellen gelten daher strengere Regeln, da sie sicherstellen müssen, dass Webinhalte von allen Menschen ohne größere Schwierigkeiten und ohne fremde Hilfe gelesen werden können.

Barrierefreiheit schafft digitale Teilhabe. Lassen Sie uns gemeinsam Ihre Website verbessern und für mehr Nutzer zugänglich machen.

Gemeinsam Barrieren abbauen

Werk 8 ist eine Full-Service-Digitalagentur in der Nähe von Stuttgart. Wir entwickeln digitale Lösungen, die Nutzer*innen begeistern, Marken stärken und Emotionen wecken. In unseren Projekten vereinen wir strategische Beratung, Kreativität, technologische Expertise, Content Creation und den Einsatz Künstlicher Intelligenz (KI).

Ob barrierefreie Website, performante Plattform oder skalierbare E-Commerce-Lösung – unser Team entwickelt individuelle digitale Produkte, die auf allen Endgeräten funktionieren und ein echtes Nutzererlebnis schaffen. Zu unseren Kunden zählen Unternehmen aus der Industrie, dem Handel, der Lebensmittelbranche, dem Finanzwesen sowie dem Sport- und Eventbereich.

Was genau bedeutet digitale Barrierefreiheit?

Ist digitale Barrierefreiheit gesetzlich vorgeschrieben?

Was gehört alles zur digitalen Barrierefreiheit?

Welche Arten von digitalen Barrieren gibt es?

Was sind die vier Dimensionen von Barrierefreiheit?

Was ist die Richtlinie zur Barrierefreiheit im Internet?

Was ist die so genannte 20%-Regel für Barrierefreiheit?

Welche DIN-Normen gelten für die digitale Barrierefreiheit?

Gibt es konkrete Beispiele für digitale Barrierefreiheit?

Häufige Fragen

In einer zunehmend digitalisierten Welt wird der Einsatz von Inclusive Design immer wichtiger. Zukünftig müssen alle Nutzerbedürfnisse in die Entwicklung von Websites einfließen, um möglichst viele Facetten und Perspektiven der Gesellschaft zu berücksichtigen. Andernfalls riskieren Unternehmen, Nutzer ungewollt auszuschließen und damit entscheidende Innovations- und Conversion Vorteile zu verschenken.

Inclusive Design minimiert digitale Barrieren und steigert das Nutzererlebnis

Erfahren Sie, wie Inclusive Design digitale Barrieren minimiert und das Nutzererlebnis verbessert.

Inclusive Design

Inclusive Design beschreibt die Praxis, bei der Gestaltung von Websites und anderen Webanwendungen bewusst die Bedürfnisse der Nutzerinnen und Nutzer einzubeziehen, um alle Facetten und Perspektiven der Gesellschaft zu berücksichtigen. Ziel ist es, digitale Produkte zu schaffen, die physisch, kognitiv und emotional für alle geeignet sind, um eine umfassende und zugängliche User Experience zu gewährleisten.

Inclusive Design hilft Unternehmen, digitale Innovation zu fördern, barrierefreie Websites zu entwickeln und so ihren Kundenkreis zu erweitern. Inklusion ist daher eine zwingende Notwendigkeit und keine optionale Ergänzung.

Um Inclusive Design in der Praxis anzuwenden, muss bei der Entwicklung von Websites der Schwerpunkt auf die Nutzungssituation und nicht auf die Nutzertypen gelegt werden. Das bedeutet, dass bei der Entwicklung in erster Linie die Frage beantwortet werden muss, welche Aufgabe die Website in einer bestimmten Situation für den Nutzer erfüllen kann, und nicht, welche Funktionen für welche Nutzergruppen erforderlich sind.

Ziel des Inclusive Design ist es, Barrieren im (Web-) Design durch die Akzeptanz und Anerkennung von Vielfalt und Diversität abzubauen, um so digitale Barrieren zu minimieren und die Inklusion zu fördern.

Ein zentraler Aspekt ist das Erkennen von Ausgrenzung (Exklusion). Vorurteile und Ausschlüsse, die durch Diskrepanzen zwischen Menschen und ihren Erfahrungen entstehen, müssen bewusst wahrgenommen und adressiert werden.

Ein weiterer wichtiger Aspekt ist das Lernen aus der Vielfalt. Menschen mit unterschiedlichen Hintergründen und Perspektiven müssen in den Designprozess einbezogen werden, um tiefe, authentische Einblicke zu erhalten, die nachhaltig zu einer inklusiven (barrierefreien) Lösung führen.

Der letzte Aspekt ist die Ausweitung der Designlösung auf viele Nutzergruppen. Webanwendungen, die speziell für Menschen mit dauerhaften Behinderungen entwickelt wurden, bieten oft auch anderen Nutzern einen erheblichen Mehrwert.

Bis Juni 2025 wird Barrierefreie und Inclusive Design durch den European Accessibility Act (EAA) für alle Website-Betreiber gesetzlich verpflichtend. In Deutschland gibt es bereits zahlreiche gesetzliche Vorgaben, die die Barrierefreiheit von Websites und anderen digitalen Webanwendungen regeln.

Grundgesetz (GG) – Verbot der Diskriminierung aufgrund einer Behinderung (Art. 3, Abs. 3)

Behindertengleichstellungsgesetz (BGG) – Definiert Barrierefreiheit als Auffindbarkeit, Zugänglichkeit und Nutzbarkeit ohne besondere Erschwernis

Europäische Norm 301 549 – Internationale Standards für Barrierefreiheit, basierend auf den Web Content Accessibility Guidelines (WCAG)

Barrierefreie-Informationstechnik-Verordnung (BITV) – Vorschriften für öffentliche und ab 2025 auch für private Websites und Apps

Inclusive Design bietet Unternehmen viele Vorteile:

Erweiterung der Nutzergruppen – Durch die Umsetzung von barrierefreiem Webdesign können Unternehmen eine breitere Zielgruppe ansprechen. In Deutschland leben etwa 9,5% der Bevölkerung mit einer Schwerbehinderung, weltweit sind es rund 15%. Darüber hinaus profitieren auch Menschen mit temporären oder situativen Einschränkungen von barrierefreien Angeboten.

Kosteneffizienz – Es ist kostengünstiger, Barrierefreiheit von Anfang an in die Websiteentwicklung einzubinden. Nachträgliche Anpassungen sind oft aufwändig und teuer. Ein barrierefreies Webdesign und eine intuitive Navigationsstruktur sparen langfristig Zeit und Geld.

Stärkung der Markenwahrnehmung – Unternehmen, die sich für Barrierefreiheit einsetzen, stärken ihre Marke und zeigen soziale Verantwortung. Dies wird von den Nutzern zunehmend honoriert, da viele ihr Kaufverhalten von der gesellschaftspolitischen Einstellung einer Marke abhängig machen.

Verbesserte Google Ranking – Barrierefreie Websites sind oft besser für Suchmaschinen optimiert. Gut strukturierte Inhalte, korrekte HTML-Auszeichnungen und Alternativtexte für Bilder werden von Suchmaschinen-Crawlern besser erfasst, was zu einer höheren Sichtbarkeit in den Suchergebnissen führt.

Inclusive Design ist mehr als nur eine gesetzliche Pflicht. Es ist eine Chance für Unternehmen, ihre Zielgruppe zu erweitern, Kosten zu sparen und ihre Markenwahrnehmung zu verbessern. Unternehmen sollten Barrierefreiheit als integralen Bestandteil ihrer digitalen Strategie betrachten und aktiv daran arbeiten, ihre Website für alle zugänglich zu machen.

Werk 8 entwickelt digitale Lösungen für die Welt von morgen. Die unabhängige Digitalagentur aus Ludwigsburg entwickelt performante und barrierefreie Websites, Onlineshops und andere digitale Erlebnisse. Zu den Kunden zählen unter anderem die Stuttgarter Kickers, cellcentric (ein Joint Venture von Daimler Truck und der Volvo Group), die Hochschule der Medien, das CJD Christliches Jugenddorfwerk Deutschlands, DIEDA und die Hallesche Krankenversicherung. Aktuelles von Werk 8 auch auf LinkedIn und Instagram.

Inklusivität

Barrierefreiheit

Inklusives Design vs. Barrierefreiheit

WCAG

BITV 2.0

Finden Sie heraus, welche gesetzlichen Anforderungen bis Mitte 2025 für barrierefreie Websites umgesetzt sein müssen.

Barrierefreie Websites bis 2025

Hier finden Sie die gesetzlichen Bestimmungen und Richtlinien, die Sie für eine barrierefreie Website ab Juni 2025 einhalten müssen.

Die Barrierefreiheit stellt sicher, dass alle Menschen eine Website uneingeschränkt nutzen können. Um Barrierefreiheit zu gewährleisten, muss jeder Mensch eine Website verstehen, bedienen und mit ihr interagieren können. 

Allein in Deutschland leben fast 12 Millionen Menschen mit Behinderungen. Das sind fast 15 Prozent der deutschen Bevölkerung. Die Zahl der Menschen mit Behinderungen steigt mit zunehmendem Alter. Damit wächst auch die Zahl der Menschen, die darauf angewiesen sind, zum Beispiel ihr Online-Banking nur mit der Tastatur bedienen zu können oder die Schriftgröße auf Webseiten zu verändern.

Seit 2018 gibt es die “Vier Prinzipien der Barrierefreiheit” (engl. POUR Principles of Accessibility), die als internationaler Standard für barrierefreie Webinhalte (engl. Web Content Accessibility Guidelines, kurz WCAG) gelten. Erfüllt eine Website alle vier Prinzipien, können Menschen mit Behinderungen die Inhalte ohne größere Schwierigkeiten und grundsätzlich ohne fremde Hilfe nutzen. 

Wahrnehmbar (Perceivable) – Inhalte müssen so präsentiert werden, dass sie für die Nutzer wahrnehmbar sind. Das bedeutet, dass Inhalte mit ausreichendem Farbkontrast veröffentlicht werden und Bilder mit entsprechenden Alternativtexten (alt-Text) versehen werden. 

Bedienbar (Operable) – Nutzer müssen in der Lage sein, die Website mit all ihren Navigationselementen bedienen zu können, zum Beispiel über die Tastatur oder gut erkennbare Links.

Verständlich (Understandable) – Informationen und Bedienelemente müssen klar und verständlich sein. Das bedeutet, dass die Nutzer in der Lage sein müssen, sowohl die Informationen als auch die Bedienung mithilfe einfacher Sprache oder einer konsistenten Navigation zu verstehen. 

Robust – Inhalte müssen robust genug sein, dass die Nutzer jederzeit in der Lage sind, mit verschiedenen Techniken und Assistenten zuverlässig auf die Inhalte zuzugreifen. Das bedeutet, dass Inhalte auch dann zugänglich bleiben müssen, wenn sich die Technik und die Websuche weiterentwickeln.

Gesetzliche Grundlage zur digitalen Barrierefreiheit

Ab Mitte 2025 werden barrierefreie Websites durch das Barrierefreiheitsstärkungsgesetz (BFSG) gesetzlich vorgeschrieben. Das Gesetz schreibt vor, digitale Angebote barrierefrei zu gestalten. Die gesetzliche Verpflichtung zur Barrierefreiheit gilt für alle Unternehmen mit mehr als zehn Mitarbeitern oder einem Jahresumsatz von mehr als zwei Millionen Euro. Private und rein gewerbliche Anbieter digitaler Dienste (B2B, Business to Business) fallen nicht unter das Barrierefreiheitsgesetz. 

Verstößt ein Unternehmen gegen das Barrierefreiheitsstärkungsgesetz, drohen empfindliche Strafen mit Bußgeldern von mehreren tausend Euro. Was Unternehmen droht, die keine barrierefreie Website betreiben, zeigt ein Blick in die USA. Dort ist digitale Barrierefreiheit durch den “Americans with Disability Act” schon lange vorgeschrieben und gehört zum Alltag. So musste die Supermarktkette Target nach einem Bericht des Handelsblatts zwölf Millionen Dollar Strafe zahlen, weil ihre Website nicht vollständig barrierefrei war. Auch die Lieferkette Domino’s Pizza wurde verklagt, weil sehbehinderte Menschen online keine Pizza bestellen konnten.  

Wie Unternehmen ihre Website barrierefrei machen

Unternehmen können ihre Website barrierefrei machen, wenn sie die “Vier Prinzipien der Barrierefreiheit” von den Web Content Accessibility Guidelines (WCAG) umsetzen. Das bedeutet zum Beispiel, dass 

Menschen mit Sehbehinderungen Texte und Formularfelder auf der Website durch ausreichenden Farbkontrast zum Hintergrund erkennen können 

gehörlose und schwerhörige Menschen Videos nutzen können, wenn diese mit Untertiteln versehen sind

Blinde Menschen können die Website nutzen, indem Bilder, Formulare und Schaltflächen textlich beschrieben werden. 

Für das BFSG regelt die Norm EN 301549 die Barrierefreiheit von Websites. Die Norm stellt sicher, dass digitale Angebote im Sinne des European Accessibility Act (EAA) barrierefrei sind. Neben den technischen Änderungen müssen Unternehmen auch eine “Erklärung zur Barrierefreiheit" und ein Kontaktformular zur Meldung von digitalen Barrieren veröffentlichen.

Der wohl umfassendste Test zur Barrierefreiheit in Deutschland ist der BITV-Test  der Initiative BIK (“Barrierefrei informieren und kommunizieren”). Der Test prüft alle Anforderungen, die in der BITV 2.0 definiert sind. Parallel dazu gibt es den WCAG-Test, der aber weitgehend alle Anforderungen abdeckt, die auch im BITV-Test geprüft werden.

Da die offiziellen Tests sehr aufwändig und kostenintensiv sind, empfiehlt es sich, für eine erste Einschätzung der Barrierefreiheit auf kostenlose Tools und Schnelltests zurückzugreifen. Im Folgenden sind die bekanntesten Tools zum Testen digitaler Barrieren aufgeführt.

Die Web Accessibility Initiative (WAI) bietet eine umfassende Liste verschiedener Werkzeuge, mit denen die Barrierefreiheit von Webseiten getestet werden kann. Bitte beachten Sie, dass keines dieser Tools einen offiziellen Test oder eine andere Qualitätskontrolle ersetzen kann.

Was ist der European Accessibility Act (EAA)?

Was regelt die Norm EN 301 549?

Was ist das Barrierefreiheitsstärkungsgesetz?

Was ist die Barrierefreie-Informationstechnik-Verordnung (BITV)?

In der digitalen Welt wird Barrierefreiheit immer wichtiger – nicht nur, um gesetzlichen Anforderungen zu entsprechen, sondern auch, um sicherzustellen, dass alle Nutzerinnen und Nutzer Zugang zu den Inhalten und Funktionen einer Website haben. Barrierefreies Webdesign zielt darauf ab, digitale Inhalte für Menschen mit Behinderungen zugänglich zu machen und dadurch die User Experience für alle zu verbessern. 

Der folgende Artikel gibt einen Überblick über die wichtigsten Grundlagen der digitalen Barrierefreiheit bei der Entwicklung einer Website oder einer digitalen Plattform. 

Barrierefreies Webdesign: Die wichtigsten Grundlagen

Lernen Sie die Grundprinzipien des barrierefreien Webdesigns kennen, um die Website für alle Benutzer zugänglich zu machen.

Grundlagen des barrierefreien Webdesigns

Inclusive Design basiert auf sieben Grundprinzipien, die sicherstellen, dass bei der Entwicklung von Websites und digitalen Lösungen die Bedürfnisse aller Nutzergruppen berücksichtigt werden. Die Prinzipien dienen Unternehmen und Agenturen als Grundlage, um Barrierefreiheit von Anfang an in den Design- und Entwicklungsprozess zu integrieren.

Vergleichbare Erfahrungen schaffen – alle Nutzer sollten unabhängig von ihren Fähigkeiten Zugang zu den gleichen Inhalten haben.

Die Situation berücksichtigen – passe das Webdesign an verschiedene Nutzungskontexte an, zum Beispiel bei Sonnenschein oder in einer lauten Umgebung.

Konsistent sein – ein konsistentes Design System verwenden, das auf allen Unterseiten gleich funktioniert.

Nutzern die Kontrolle geben –bieten Sie die Möglichkeit, Animationen zu pausieren, zu zoomen und die Darstellung anzupassen, um den Benutzern die Kontrolle über die Interaktion zu geben.

Wahlmöglichkeiten anbieten – Bieten Sie verschiedene Optionen an, um Aufgaben zu erledigen, zum Beispiel die Wahl zwischen einer Gitter- und einer Listenansicht.

Prioritäten setzen – verwenden Sie klare Hierarchien und vermeiden Sie Überfrachtung. Alle Inhalte und Funktionen sollten jederzeit leicht zugänglich sein. 

Mehrwert schaffen – vielfältige Interaktionsmöglichkeiten wie Geolokalisierung, Sprachsteuerung und Touchbedienung integrieren.

Ein wichtiger Aspekt im barrierefreien Webdesign ist die Wahl der Farben. Die Barrierefreiheit von Farben hängt nicht von der Farbe selbst, sondern vom Kontrastverhältnis zwischen den Farben ab. Laut den WCAG Standards (Web Content Accessibility Guidelines) müssen Texte ein Kontrastverhältnis von mindestens 4,5:1 aufweisen, während für interaktive Elemente wie Buttons ein Verhältnis von 3:1 empfohlen wird. Weitere Informationen zu barrierefreie Farben findest du in dem folgenden Artikel: Wie du barrierefreie Farben wählst

Die Wahl der richtigen Schriftart ist ein entscheidender Faktor für barrierefreies Webdesign. Barrierefreie Schriftarten sind zwar in den WCAG-Standards nicht vorgeschrieben, tragen aber wesentlich zur Lesbarkeit und zur Benutzerfreundlichkeit bei. Besonders hilfreich sind serifenlose Schriften und Schriften mit klar unterscheidbaren Zeichen (zum Beispiel großes „I“ und kleines „l“).

Lange Absätze und Textpassagen vermeiden

Überschriften und lange Sätze nicht in Versalien (Großbuchstaben) setzen

Texte nicht zentriert oder in Blocksatz setzen

Verwenden Sie serifenlose, serifenbetonte oder monospaced Schriften, um die Lesbarkeit deutlich zu erhöhen. 

Eine Monospaced-Schrift ist eine Schrift, bei der alle Zwischenräume gleich groß sind. Das bedeutet, dass alle Buchstaben und Zeichen den gleichen horizontalen Raum einnehmen und die gleiche Breite haben.

Bilder, Icons und Illustrationen sollten ebenfalls barrierefrei gestaltet sein. Dazu gehört nicht nur ein ausreichender Farbkontrast von 3:1, sondern auch eine sinnvolle Beschriftung der Icons. Icons sollten mindestens 24 x 24 Pixel groß sein, damit sie gut erkannt und angeklickt werden können. Darüber hinaus ist es wichtig, Bilder mit einem Alt-Text zu versehen, der den Inhalt des Bildes beschreibt, und keine Texte auf Bildern zu platzieren, da diese für Screenreader nicht zugänglich sind.

Animationen können das Nutzererlebnis verbessern, sie bergen jedoch auch Risiken in Bezug auf Barrierefreiheit. Besonders wichtig ist, dass Animationen  dezent und unterstützend wirken, ohne abzulenken oder gesundheitliche Probleme zu verursachen. Die WCAG Standards empfehlen, Animationen auf maximal 5 Sekunden zu begrenzen und blinkende Elemente zu vermeiden, die mehr als dreimal pro Sekunde aufleuchten. Darüber hinaus sollte es bei animierten Elementen immer eine Option zum Pausieren geben.

Fazit zu den Grundlagen von barrierefreiem Webdesign

Barrierefreie Websites sind mehr als nur eine rechtliche Anforderung. Sie bieten Unternehmen die Möglichkeit, eine breitere Zielgruppe anzusprechen, die Reichweite der Website zu erhöhen und die User Experience zu verbessern. Als Experten unterstützen wir Sie gerne bei der Konzeption und Entwicklung Ihrer Website und helfen Ihnen, die WCAG Standards zu erfüllen.

Fast jede zeitgemäße Website und jeder moderne Onlineshop folgt dem MACH-Prinzip. Eine Software-Architektur, die auf dem Konzept von Microservices, API-first, Cloud-native, Headless aufgebaut ist. MACH ist der Schlüssel für eine moderne, zukunftssichere und flexible Website- und Plattformentwicklung. Das Prinzip ermöglicht es, individuelle und nahtlose digitale Erlebnisse zu gestalten und über verschiedene Kanäle hinweg bereitzustellen.

MACH – das Prinzip moderner Website Architektur

MACH-Architektur: Microservices, API-first, Cloud-native, Headless – für flexible, skalierbare und kanalübergreifende digitale Erlebnisse der Zukunft.

MACH-Prinzip – Moderne Architektur für Websites

Wie bereits erwähnt ist MACH ein moderner Architekturansatz, der auf vier zentralen Prinzipien basiert: Microservices, API-first, Cloud-native und Headless. Das Konzept wurde entwickelt, um die Herausforderungen der digitalen Transformation zu meistern und ermöglicht es Unternehmen, hochgradig anpassbare und skalierbare digitale Erlebnisse zu schaffen.

Microservices – Microservices sind unabhängige, modulare Komponenten, die spezifische Geschäftsfunktionen erfüllen. Sie werden separat entwickelt und können individuell kombiniert werden, was ein Höchstmaß an Funktionalität und Flexibilität bietet.

API-first – APIs (Application Programming Interfaces) stehen im Mittelpunkt der MACH-Architektur. Sie ermöglichen die nahtlose Integration verschiedener Module, unabhängig davon, ob sie vom selben Anbieter stammen oder nicht und machen das System somit flexibel und erweiterbar.

Cloud-native – Cloud-native bedeutet, dass alle Anwendungen und Dienste in der Cloud ausgeführt werden. Dies garantiert Aktualität, Skalierbarkeit und eine hohe Betriebssicherheit, während gleichzeitig der Bedarf an eigener IT-Infrastruktur minimiert wird.

Headless – Headless trennt das Frontend (die Darstellung) vom Backend (dem Inhalt). Dies ermöglicht eine flexible Verteilung von Inhalten über mehrere Kanäle, ohne an ein spezifisches Frontend gebunden zu sein.

Das MACH-Prinzip entstand aus der Notwendigkeit, digitale Erlebnisse über mehrere Plattformen hinweg flexibel und effizient bereitzustellen. In einer Welt, in der Nutzer verschiedene Geräte und Kanäle verwenden, um auf Inhalte zuzugreifen, müssen Unternehmen ihre digitale Architektur anpassen, um relevante und personalisierte Erlebnisse bieten zu können.

Traditionelle monolithische Systeme stoßen in dieser komplexen Umgebung schnell an ihre Grenzen. Sie bieten oft nicht die notwendige Flexibilität und Skalierbarkeit, um auf die dynamischen Anforderungen des Marktes reagieren zu können. Hier setzt MACH an, indem es eine modulare und entkoppelte Architektur ermöglicht, die sich einfach an neue Anforderungen anpassen lässt.

Die MACH-Architektur bietet zahlreiche Vorteile, die es Unternehmen ermöglichen, ihre digitalen Strategien effektiv und effizient umzusetzen:

Dank der Cloud-nativen Architektur können Unternehmen ihre Systeme nahtlos skalieren, um wachsenden Anforderungen gerecht zu werden. Dies ist besonders wertvoll in Zeiten von hohen Traffic-Spitzen, wie etwa bei Verkaufsaktionen oder Markteinführungen, wo es unerlässlich ist, dass die Systeme ohne Leistungseinbußen skalieren können. Die Fähigkeit zur automatischen Skalierung reduziert auch den Bedarf an Überkapazitäten, wodurch Kosten gesenkt und Ressourcen effizienter genutzt werden können.

Die modulare Struktur von Microservices ermöglicht es Unternehmen, ihre digitalen Plattformen nach Bedarf zu erweitern, zu aktualisieren oder zu ändern. Diese Flexibilität ist besonders wichtig in einem Markt, der sich ständig weiterentwickelt. Neue Funktionen oder Technologien können problemlos in das bestehende System integriert werden, ohne dass es zu langwierigen und teuren Entwicklungsprozessen kommt. Dies macht MACH-Architekturen zu einer idealen Wahl für Unternehmen, die in einem dynamischen Umfeld agieren.

Durch die API-first-Strategie können neue Funktionen und Services schneller integriert werden, da die einzelnen Komponenten unabhängig voneinander entwickelt und implementiert werden können. Dies verkürzt nicht nur die Entwicklungszeit, sondern ermöglicht auch eine agilere Reaktion auf Marktveränderungen und Kundenanforderungen. In einer digitalen Welt, in der Geschwindigkeit ein entscheidender Wettbewerbsvorteil ist, kann dies den Unterschied zwischen Erfolg und Misserfolg ausmachen.

Die Trennung von Frontend und Backend, kombiniert mit der Verlagerung in die Cloud, bietet ein höheres Maß an Sicherheit. Da die Angriffsfläche minimiert wird, sind MACH-Architekturen weniger anfällig für Cyberangriffe. Zudem profitieren Unternehmen von kontinuierlichen Sicherheitsupdates und Protokollen, die von Cloud-Anbietern bereitgestellt werden. Diese Sicherheitsvorteile sind besonders wichtig in einer Zeit, in der Datenschutz und Datensicherheit an vorderster Stelle stehen.

Durch den Einsatz von Cloud-Technologien und die Vermeidung teurer monolithischer Systeme können Unternehmen ihre IT-Kosten signifikant senken. Die Pay-as-you-go-Modelle der Cloud-Anbieter ermöglichen es Unternehmen, nur für die tatsächlich genutzten Ressourcen zu zahlen, wodurch unnötige Kosten vermieden werden. Darüber hinaus reduziert die Möglichkeit, einzelne Module unabhängig voneinander zu aktualisieren oder zu ersetzen, die Wartungskosten und verlängert die Lebensdauer des gesamten Systems.

Im Vergleich zu traditionellen monolithischen Systemen bietet die MACH-Architektur entscheidende Vorteile, die in der modernen digitalen Welt unverzichtbar sind.

Monolithische Systeme sind große, zusammenhängende Software-Lösungen, bei denen alle Funktionen und Prozesse in einem einzigen, unteilbaren System untergebracht sind. Diese Systeme sind oft schwerfällig und schwer zu warten, da jede Änderung das gesamte System betreffen kann. Dies führt zu längeren Entwicklungszyklen und erhöhten Kosten. Zudem sind monolithische Systeme oft wenig flexibel und erfordern große Ressourcen, um mit den sich ändernden Marktanforderungen Schritt zu halten.

Im Gegensatz dazu sind MACH-Systeme modular und entkoppelt. Jedes Modul oder jeder Microservice kann unabhängig entwickelt, skaliert und gewartet werden. Dies ermöglicht eine schnellere Anpassung an neue Anforderungen und eine effizientere Nutzung von Ressourcen. Unternehmen, die MACH-Architekturen implementieren, profitieren von einer höheren Innovationsgeschwindigkeit und der Fähigkeit, neue Technologien und Geschäftsmodelle schneller zu integrieren.

Ein weiterer wesentlicher Unterschied ist die Flexibilität bei der Wahl der Technologie. Während monolithische Systeme oft auf eine bestimmte Technologie festgelegt sind, ermöglicht MACH eine Best-of-Breed-Strategie, bei der Unternehmen die besten verfügbaren Technologien für jede spezifische Anforderung auswählen können. Dies fördert Innovation und verhindert, dass Unternehmen in veralteten Systemen feststecken.

Die Zukunft der digitalen Erlebnisse mit MACH

Die digitale Welt entwickelt sich ständig weiter und mit ihr die Erwartungen und Wünsche der Kunden. In Zukunft wird die Personalisierung eine noch wichtigere Rolle bei der Entwicklung von Websites spielen. Kunden erwarten maßgeschneiderte Erlebnisse, die ihren individuellen Bedürfnissen und Vorlieben entsprechen. MACH ist der Schlüssel, um Ihre digitale Präsenz fit für die Zukunft zu machen. Dank des modularen Aufbaus müssen Sie sich nie wieder Sorgen machen, dass Ihre Website veraltet.

Für Ihren Website Relaunch mit der MACH-Architektur stehen Ihnen unsere Experten zur Seite. Als digitaler Partner unterstützen wir Sie bei der strategischen Planung, der Konzeption, der Auswahl geeigneter Anbieter sowie der technischen Umsetzung Ihrer individuellen digitalen Plattform.

Barrierefreie Kommunikation gewinnt immer mehr an Bedeutung. Leichte und Einfache Sprache spielen dabei eine wichtige Rolle. Obwohl beide Sprachformen oft miteinander verglichen werden, gibt es doch deutliche Unterschiede. In diesem Artikel erläutern wir die wichtigsten Unterschiede und geben einen Überblick über die wichtigsten Merkmale der Leichten Sprache und was sie von der Einfachen Sprache unterscheidet.

Leichte und einfache Sprache: Was ist der Unterschied

Entdecken Sie die Unterschiede zwischen Leichter und Einfacher Sprache und wie sie barrierefreie Kommunikation für verschiedene Zielgruppen unterstützen.

Leichte vs. Einfache Sprache

Leichte Sprache ist die am stärksten vereinfachte Form der deutschen Sprache und streng geregelt. Sie richtet sich vor allem an Menschen mit geistiger Behinderung, Demenz oder eingeschränktem Sprachverständnis. Für die Erstellung solcher Texte gibt es bereits verschiedene Standards wie die Richtlinien der BITV 2.0 (Barrierefreie Informationstechnik-Verordnung), des Netzwerks Leichte Sprache e.V. oder der Forschungsstelle Leichte Sprache an der Universität Hildesheim. Alle diese Grundlagen enthalten konkrete Anforderungen an den Satzbau, die Wortwahl und das Layout, um ein Höchstmaß an Verständlichkeit zu gewährleisten.

Die Leichte Sprache hingegen ist weniger streng reglementiert und orientiert sich stärker an der allgemeinen Standardsprache. Sie wird in verschiedenen Schwierigkeitsgraden verwendet und richtet sich vor allem an Menschen aus bildungsfernen Schichten, Deutschlernende oder Menschen mit leichten Sprachbehinderungen. Einfache Sprache bietet mehr Flexibilität, da sie an die jeweilige Zielgruppe angepasst werden kann und sich nicht an Richtlinien halten muss.

Für die Leichte Sprache gibt es, wie bereits beschrieben klare Vorschriften, die zum Beispiel beinhalten:

Ein Satz darf nur eine Aussage enthalten.

Sätze müssen kurz und verständlich sein, meist nicht länger als zwei Zeilen bei einer Schriftgröße von mindestens 14.

Komplexe Wörter oder Fachbegriffe sollen vermieden werden, und der Text wird häufig durch Illustrationen ergänzt, die das Verständnis unterstützen.

Einfache Sprache folgt diesen strengen Vorgaben nicht, doch es gibt Empfehlungen zur Verbesserung der Verständlichkeit. In der Praxis wird daran gearbeitet, auch für Einfache Sprache DIN-Normen wie die DIN 8581-1 zu etablieren, um eine einheitliche Grundlage zu schaffen.

Leichte Sprache richtet sich in erster Linie an Menschen mit geistiger Behinderung, Demenz, Aphasie sowie an Personen mit einer Hörbehinderung, deren Muttersprache die Deutsche Gebärdensprache ist. Diese Sprachform ermöglicht ihnen, wichtige Informationen barrierefrei zu erfassen.

Einfache Sprache hingegen ist ideal für Menschen mit fortgeschrittenen Deutschkenntnissen, bildungsferne Schichten und Jugendliche mit Deutsch als Zweitsprache. Sie eignet sich auch für öffentliche Institutionen oder kulturelle Einrichtungen wie Museen, wo auch Personen mit guten Sprachkenntnissen von verständlich aufbereiteten Texten profitieren.

Die Erstellung von Texten in Leichter und Einfacher Sprache folgt unterschiedlichen Prozessen. Leichte Sprache wird in der Regel von der Hauptzielgruppe – Menschen mit geistiger Behinderung oder Lernschwierigkeiten – überprüft, um sicherzustellen, dass die Inhalte verständlich sind. Organisationen wie das Netzwerk Leichte Sprache e.V. oder Inclusion Europe schreiben vor, dass solche Texte von mindestens zwei Personen aus der Zielgruppe geprüft werden. Diese Überprüfung erfolgt häufig durch lautes Vorlesen und das Stellen von Verständnisfragen, um herauszufinden, ob der Text klar und nachvollziehbar ist.

Bei Einfacher Sprache hingegen wird die Zielgruppe nicht immer systematisch in den Erstellungsprozess eingebunden. Es gibt jedoch Anbieter, die auch hier Prüfgruppen nutzen, zum Beispiel Jugendliche mit Deutsch als Zweitsprache. Da Einfache Sprache flexibler ist und weniger strenge Regeln befolgt, wird sie oft an die jeweilige Zielgruppe angepasst, um die Verständlichkeit zu optimieren.

In den letzten Jahren kommen zunehmend KI-basierte Tools zum Einsatz, die Texte in Leichte oder Einfache Sprache umwandeln sollen. Besonders bei Leichter Sprache ist jedoch Vorsicht geboten, da die künstliche Intelligenz den menschlichen Prozess der Vereinfachung noch nicht vollständig ersetzen kann. Es ist wichtig, dass bei der Erstellung von Leichte-Sprache-Texten nicht nur die sprachliche Vereinfachung, sondern auch das Weltwissen der Zielgruppe berücksichtigt wird, um sicherzustellen, dass der Inhalt wirklich verständlich ist.

Im folgenden zeigen wir zwei einfache Beispiele, um die Unterschieden zwischen Einfacher und Leichter Sprache abzubilden.

Peter ist krank, weil er gestern zu leicht angezogen war.

Gestern war Peter den ganzen Tag draußen.

Wenn Sie Fragen haben, rufen Sie uns bitte unter dieser Nummer an: XXX

Sowohl Leichte als auch Einfache Sprache spielen eine wichtige Rolle bei der digitalen Zugänglichkeit. Leichte Sprache ermöglicht es Menschen mit kognitiven Einschränkungen, wichtige Informationen zu verstehen, während die Einfache Sprache eine breitere Zielgruppe anspricht. Wenn Sie mehr über Leichte und Einfache Sprache erfahren möchten, finden Sie viele Informationen auf dem Blog von Andrea Halbritter.

Was sind die Zielgruppen Einfacher und Leichter Spracher?

Welche Regeln gibt es für Leichte Sprache?

Welche Regeln gibt es für Einfache Sprache?

Die Wünsche und Erwartungen von Kunden haben sich in den letzten Jahren drastisch verändert. Sie fordern unter anderem nahtlose, personalisierte Erlebnisse über alle digitalen Touchpoints und Kanäle hinweg.

Eine Erfahrung an einem einzigen Touchpoint (Berührungspunkt) kann bereits entscheiden, ob eine Marke langfristig Erfolg hat oder potenzielle Kundinnen verliert. Laut Forrester Research geben 88 % der Online-Kunden in den USA an, nach einer schlechten Nutzererfahrung nicht mehr auf dieselbe Website zurückzukehren. Im Gegensatz dazu können reibungslose, überzeugende Erlebnisse die Konversionsraten um bis zu 400 % steigern.

Aber wie können Unternehmen eine durchgängige, positive Customer Journey schaffen? Der Schlüssel liegt in einer klaren Customer Experience Strategie, die alle Touchpoints berücksichtigt. Im folgenden Artikel zeigen wir, welche drei zentralen Schritte dabei helfen, eine erfolgreiche Customer Experience Strategie zu gestalten und so den langfristigen Unternehmenserfolg zu sichern.

In drei Schritten zur perfekten Customer Experience Strategie

Erfahren Sie, wie Sie in 3 einfachen Schritten eine erfolgreiche Customer Experience Strategie aufbauen und langfristigen Unternehmenserfolg sichern.

Entwicklung einer Customer Experience Strategie

Die Customer Journey beschreibt die Reise eines Kunden oder Interessenten vom ersten Kontakt mit einer Marke bis zum Kauf eines Produktes oder der Buchung einer Dienstleistung.  

Die Customer Experience (CX) beschreibt in diesem Zusammenhang wiederum die Summe aller Erlebnisse, die ein Kunde mit einer Marke über alle Touchpoints (online oder offline) hinweg hat. Im Gegensatz zur Customer Experience bezeichnet die User Experience (UX) das spezifische Nutzererlebnis, das ein Kunde bei der Verwendung eines digitalen Produkts wie einer Website oder einer App hat. 

Um für den Kunden ein erfolgreiches Gesamterlebnis (Customer Experience) zu schaffen, bedarf es daher eines Überblicks über alle potenziellen Berührungspunkte (Touchpoints) des Kunden mit der jeweiligen Marke. Dieser Überblick wird meist in Form einer Customer Journey Map mit Tools wie Miro oder Figma entwickelt. Im folgenden Artikel von Miro finden Sie Templates und Vorlagen für die Erstellung einer Customer Journey Map: Customer Journey Map erstellen 

Um Customer Journey und User Experience gleichwertig in die Strategie zu integrieren, braucht es ein Team von digitalen Experten und Strategen mit den richtigen Fähigkeiten und Kenntnissen, um ein nutzerzentriertes Produkt zu entwickeln. Doch wie kommt man dorthin?

Eine durchdachte Customer Experience Strategie beginnt immer mit einer Vision und klar definierten Zielen. Dabei hilft das sogenannte SMART-Prinzip, nach dem Ziele spezifisch, messbar, attraktiv, realistisch und terminiert sein sollten.

Nur so kann sichergestellt werden, dass alle Teammitglieder und das Management dieselbe Vision verfolgen und wissen, worauf sie hinarbeiten. Ein gemeinsames Verständnis der Ziele schafft Transparenz und fördert den langfristigen Erfolg.

Anstatt nur das Ziel zu definieren, die Kundenzufriedenheit langfristig zu steigern, sollte das Ziel konkreter formuliert werden. Ein SMART Ziel könnte beispielsweise lauten: "Die Kundenzufriedenheit, gemessen am Net Promoter Score (NPS), soll bis zum Ende des nächsten Quartals um zwölf Prozent gesteigert werden." Weitere Tipps zur Formulierung von SMART Zielen finden Sie in folgendem Artikel von Asana: SMART Ziele richtig formulieren  

Um Ziele schriftlich festzuhalten und transparent zu kommunizieren, bietet sich häufig ein Workshop mit allen relevanten Teams an. Darüber hinaus helfen Benchmark-Analysen, den Wettbewerb besser zu verstehen und realistische Ziele zu setzen.

Eine erfolgreiche Customer Experience Strategie orientiert sich immer an den Bedürfnissen und Wünschen des Kunden. Um diese zu verstehen und mehr über den Kunden zu erfahren, ist im nächsten Schritt der direkte Kundenkontakt notwendig, um wertvolles Feedback zu erhalten. Dafür gibt es verschiedene Möglichkeiten: 

Onsite-Studien – Analysieren Sie das Nutzerverhalten bei der Verwendung Ihrer Website oder App.

User Testing – Lassen Sie Nutzer bestimmte Aufgaben auf Ihrer Website erledigen und analysieren deren Verhalten und Interaktion.

Interviews (qualitativ oder quantitativ) – Befragen Sie Kunden und Interessierte, um Einblicke in Ihre Bedürfnisse und Erwartungen zu erhalten.

Co-Creation-Workshops – Entwickeln Sie gemeinsam mit Unternehmen und Marken Ideen und Strategien.

Zusätzlich zum Kundenfeedback sollten Personas erstellt werden, eine fiktive Darstellung typischer Kunden. Sie dienen dazu, den Kunden und seine Bedürfnisse, Herausforderungen und Ziele besser zu verstehen. Eine Persona beleuchtet neben demografischen Merkmalen auch berufliche und persönliche Aspekte, wie zum Beispiel typische Charaktereigenschaften, Wünsche oder Erwartungen. Eine gut entwickelte Persona hilft, die Bedürfnisse und Wünsche der Zielgruppe besser zu verstehen. Im folgenden Artikel finden Sie Templates und Vorlagen von Miro: User Persona Template 

Es ist wichtig, das gesammelte Kundenfeedback und die Ergebnisse der Personalentwicklung (PE) in die Customer Journey Strategie einfließen zu lassen. Nur so ist es möglich, Produkte und Dienstleistungen zielgruppengerecht zu entwickeln und die Kundenzufriedenheit langfristig zu steigern.

In einem letzten Schritt sollten in der Customer Experience Strategie konkrete KPIs (Key Performance Indicators) zur Erfolgsmessung definiert werden, die regelmäßig überprüft und bei Bedarf angepasst werden. Die Erfolgsmessung ist ein wichtiges Instrument, um festzustellen, ob die definierten Ziele erreicht wurden und an welchen Stellen noch Optimierungspotenzial besteht.

Für jede Phase der Customer Journey sollten zwei bis drei relevante KPIs zur Erfolgsmessung definiert werden. KPIs sind zum Beispiel 

Conversion Rate – Wie viele Nutzer (oder Leads) wurden tatsächlich zu zahlenden Kunden?

Net Promoter Score (NPS) – Wie wahrscheinlich ist es, dass Kunden die Marke weiterempfehlen?

Time on Task – Wie lange brauchen Nutzer auf der Website, um eine bestimmte Aufgabe zu erledigen?

Zur Visualisierung der KPIs eignen sich beispielsweise klassische Analytics Dashboards mit Google Looker Studio, um die Customer Experience kontinuierlich zu überwachen und zu verbessern.

In einer Welt, in der sich die Wünsche und Erwartungen der Kunden ständig verändern, ist eine klare Customer Experience Strategie unerlässlich. Sie schafft die nahtlose Verknüpfung aller relevanten Touchpoints der Customer Journey, ohne Kunden zu verlieren.

Ein Unternehmen, das klare Ziele definiert, aktiv Kundenfeedback einholt und den Erfolg regelmäßig anhand konkreter KPIs misst und bei Bedarf anpasst, ist optimal aufgestellt, um sich langfristig im Wettbewerb zu behaupten. Eine klar gestaltete Customer Experience Strategie ist die Basis für die Transformation zu einem kundenzentrierten und langfristig erfolgreichen Unternehmen.

In der Welt der Content Management Systeme (CMS) stehen Unternehmen vor der Wahl zwischen traditionellen (monolithischen) CMS und modernen Headless CMS. Klassische Open Source CMS wie WordPress, Drupal oder Typo3 bündeln Backend und Frontend in einem System – sie wurden ursprünglich entwickelt, um primär Websites zu erstellen. 

Die Anforderungen an Websites und digitale Inhalte haben sich jedoch geändert: Inhalte sollen heute auf verschiedenen Kanälen (Websites, mobile Apps, Social Media, IoT-Geräte etc.) verfügbar sein und Entwickler wollen bei den Frontend-Technologien flexibel bleiben. Hier kommt das Headless CMS ins Spiel, das als neues Paradigma im CMS-Bereich gilt. 

Dieser Artikel erklärt, was ein Headless CMS ist, wie es sich von traditionellen Lösungen unterscheidet, welche Vorteile es bietet und stellt einige Beispiele vor.

Headless CMS vs. traditionelles CMS: Unterschiede, Vorteile und Beispiele

Die wichtigsten Unterschiede zwischen einem Headless CMS und einem traditionellen CMS, um das beste System für das nächste Projekt auszuwählen

Headless CMS vs. traditionelles CMS:

Ein Headless CMS (auch API CMS oder headless content management system) ist ein Content Management System, bei dem das Frontend - also die Darstellungsebene der Inhalte, der „Kopf“ - vollständig vom Backend getrennt ist. Headless bedeutet in diesem Zusammenhang „kopflos“, da das System kein vordefiniertes Frontend („Kopf“) mitbringt. Stattdessen dient ein Headless CMS in erster Linie der Verwaltung und Speicherung von Inhalten. Die erstellten Inhalte werden über APIs (Schnittstellen) oder Webhooks zur Verfügung gestellt. Dadurch können dieselben Inhalte flexibel auf beliebigen Ausgabekanälen verwendet werden – zum Beispiel als sogenannte Headless Websites, in Smartphone-Apps, Online-Shops oder auf Smart Displays.

In einem herkömmlichen CMS sind Inhalt und Layout eng miteinander verknüpft und oft in ein starres Template eingebunden. Ein Headless CMS durchbricht dieses Muster, indem es nur die Inhalte (headless content) bereitstellt und keinerlei Vorgaben für die Darstellung macht. Entwickler können daher frei entscheiden, mit welcher Technologie oder welchem Framework sie das Frontend realisieren. Die Kommunikation erfolgt typischerweise über RESTful APIs oder GraphQL: Das Frontend fragt die benötigten Daten beim Headless CMS ab und rendert diese selbständig.

Wichtig zu verstehen ist, dass ein Headless CMS aus Sicht der Redakteure nach wie vor ein komfortables Backend zur Pflege der Inhalte bietet – ähnlich wie man es von klassischen CMS-Tools kennt. Der Unterschied liegt unter der Haube: Das Headless-System liefert von sich aus keine fertige Webseite aus. Dadurch entfällt zwar die direkte Live-Vorschau des Layouts im Backend, aber viele Headless CMS, wie die bekannten Beispiele Contentful, Storyblok oder Prismic, bieten Vorschau-Lösungen oder Visual-Editor-Funktionen, um den Redakteuren dennoch ein komfortables Arbeiten zu ermöglichen.

Werk 8 Blog