[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"9_t0YFtO844PW3-iCfPxRTbw8yv0-2zzu2bChZFenjo":3,"btz8hO-MXSFLpybqvfjYVBre4OvrEJO1wFySe3Zmv-s":49,"3vzzUKXiUWjiT0pE0R-p1n3iu6A8YOaVSn_80Mpzgls":75,"O72QvbXXJbMJEdWs9QipF4MNfaqPcmGB55EY3mfgv6Q":172,"_apollo:default":214},{"menu":4},{"__typename":5,"id":6,"name":7,"items":8},"Menu","nuxt-main-menu","Nuxt Hauptmenü",[9,24,29,34,39,44],{"__typename":10,"id":11,"title":12,"description":13,"url":14,"langcode":15,"internal":20,"expanded":21,"attributes":22},"MenuItem","9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1","Blog",null,"/know-how",{"__typename":16,"id":17,"name":18,"direction":19},"Language","de","German","ltr",true,false,{"__typename":23,"class":13},"MenuItemAttributes",{"__typename":10,"id":25,"title":26,"description":13,"url":27,"langcode":15,"internal":20,"expanded":21,"attributes":28},"1c7a5430-8a42-4b24-9544-252adabc2f4c","Projekte","/projekte",{"__typename":23,"class":13},{"__typename":10,"id":30,"title":31,"description":13,"url":32,"langcode":15,"internal":20,"expanded":21,"attributes":33},"9c4feedc-79e4-4fbf-b68c-065f33ebfe4c","Sparring","/workshop-ux-sparring-fuer-unternehmen",{"__typename":23,"class":13},{"__typename":10,"id":35,"title":36,"description":13,"url":37,"langcode":15,"internal":20,"expanded":21,"attributes":38},"3b77a27b-272a-489f-843e-53e23ed07741","Trainings","/liechtenecker-ux-academy",{"__typename":23,"class":13},{"__typename":10,"id":40,"title":41,"description":13,"url":42,"langcode":15,"internal":20,"expanded":21,"attributes":43},"ce0bb82b-e1ee-4036-be95-f693a62e9f4a","Über uns","/about",{"__typename":23,"class":13},{"__typename":10,"id":45,"title":46,"description":13,"url":47,"langcode":15,"internal":20,"expanded":21,"attributes":48},"04a19381-81a9-4694-8653-182d8855d2b5","Kontakt","/kontakt",{"__typename":23,"class":13},{"menu":50},{"__typename":5,"id":51,"name":52,"items":53},"footer","Fußzeile",[54,60,65,70],{"__typename":10,"id":55,"title":56,"description":13,"url":57,"langcode":58,"internal":20,"expanded":21,"attributes":59},"e2873307-b50a-4aab-b6b2-1950fd99c72e","Impressum","/impressum",{"__typename":16,"id":17,"name":18,"direction":19},{"__typename":23,"class":13},{"__typename":10,"id":61,"title":62,"description":13,"url":63,"langcode":58,"internal":20,"expanded":21,"attributes":64},"2cd9b7c9-142a-4ea3-b898-a0952c54a195","Datenschutz","/datenschutz",{"__typename":23,"class":13},{"__typename":10,"id":66,"title":67,"description":13,"url":68,"langcode":58,"internal":20,"expanded":21,"attributes":69},"a5effba3-5a8c-4125-8d78-0cdba09824db","AGB","/agb",{"__typename":23,"class":13},{"__typename":10,"id":71,"title":72,"description":13,"url":73,"langcode":58,"internal":21,"expanded":21,"attributes":74},"114bf071-bdbb-44cf-85c1-69e9d9e0777d","Newsletter","https://liechtenecker.at/newsletter-subscribe",{"__typename":23,"class":13},{"route":76},{"__typename":77,"entity":78},"RouteInternal",{"__typename":79,"id":80,"title":81,"changed":82,"created":88,"langcode":89,"path":90,"promote":21,"status":20,"sticky":21,"metatag":91,"postCategory":115,"postContentElements":13,"evergreen":13,"tags":13,"postWpBody":140,"wpHeaderImage":144,"wpHeaderImageOld":13,"wpHeaderImageOldSmall":13,"wpOgImage":156,"wpPromotedTeaserImage":13,"wpShareDescription":13,"wpShareTitle":13,"wpTeaserText":143,"wpYoastHead":165,"author":166},"NodeWpPost","771","Headless CMS: eine Einführung",{"__typename":83,"timestamp":84,"timezone":85,"offset":86,"time":87},"DateTime",1607007610,"UTC","+00:00","2020-12-03T15:00:10+00:00",{"__typename":83,"timestamp":84,"timezone":85,"offset":86,"time":87},{"__typename":16,"id":17,"name":18,"direction":19},"/blog/headless-cms",[92,99,106,111],{"__typename":93,"tag":94,"attributes":95},"MetaTagValue","meta",{"__typename":96,"name":97,"content":98},"MetaTagValueAttributes","title","Headless CMS: eine Einführung | Liechtenecker UX Design Studio",{"__typename":100,"tag":101,"attributes":102},"MetaTagLink","link",{"__typename":103,"href":104,"hreflang":13,"rel":105,"media":13,"sizes":13,"type":13},"MetaTagLinkAttributes","http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/blog/headless-cms","canonical",{"__typename":107,"tag":94,"attributes":108},"MetaTagProperty",{"__typename":109,"property":110,"content":81},"MetaTagPropertyAttributes","og:title",{"__typename":107,"tag":94,"attributes":112},{"__typename":109,"property":113,"content":114},"og:image","http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/styles/meta_og_image/public/wp-migration/wordpress-media-image/2020/12/fb.jpg?h=3ecc83bb&itok=w6weS5ev",{"__typename":116,"id":117,"name":118,"path":119,"status":20,"weight":120,"description":121,"langcode":125,"changed":126,"metatag":129},"TermCategories","7","Technologie","/kategorie/technologie",0,{"__typename":122,"processed":123,"format":124},"Text","Development Themen sowie zukünftige Technologien, mit denen wir uns auseinandersetzen. ","wp_html",{"__typename":16,"id":17,"name":18,"direction":19},{"__typename":83,"timestamp":127,"timezone":85,"offset":86,"time":128},1713772777,"2024-04-22T07:59:37+00:00",[130,133,137],{"__typename":93,"tag":94,"attributes":131},{"__typename":96,"name":97,"content":132},"Technologie | Liechtenecker UX Design Studio",{"__typename":93,"tag":94,"attributes":134},{"__typename":96,"name":135,"content":136},"description","Development Themen sowie zukünftige Technologien, mit denen wir uns auseinandersetzen.",{"__typename":100,"tag":101,"attributes":138},{"__typename":103,"href":139,"hreflang":13,"rel":105,"media":13,"sizes":13,"type":13},"http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/kategorie/technologie",{"__typename":141,"processed":142,"format":124,"summary":143},"TextSummary","\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \u003Cdiv class=\"blog-drop-cap\">\n                    \u003Cdiv class=\"blog-drop-cap-background\">\nI\u003C/div>\n\u003Cp class=\"has-drop-cap\">In den letzten Jahren ist in der Webentwicklung ein Trend immer wieder besonders hervorgestochen: Headless CMS. Da uns bei Liechtenecker solche Veränderungen natürlich auch beschäftigen, möchte ich im heutigen Blog eine kurze Einführung in die Thematik bieten und im Weiteren versuchen unseren Standpunkt zu dem Thema darzulegen.\u003C/p>\n\u003C/div>        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"wide-left col-xsmall-12 col-medium-8 col-medium-offset-1 \">\n            \n\u003Ch2>Was ist ein Headless CMS?\u003C/h2>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Um diese Frage aufzuklären, möchte ich zunächst ein bisschen erläutern was ein klassisches CMS eigentlich macht. Ein klassisches CMS wird auch \u003Cem>monolithisch\u003C/em> genannt und zwar aus dem Grund, weil es alle Funktionen, die es beinhaltet, zusammenhängend in einem Kernsystem hat. Inhalte werden also üblicherweise so erstellt, dass ein Redakteur den Content über eine Administrationsoberfläche relativ fertig formatiert an ein Backend übergibt, welches die Inhalte in dieser Form auch in der Datenbank speichert. Das hat zur Folge, dass die Darstellung der Inhalte ab diesem Zeitpunkt schon relativ fix ist und nicht mehr großartig verändert werden kann.\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Ein Headless CMS geht nun einen anderen Weg indem es die Inhalte, welche das Backend übergeben bekommt in einer Art “Reinform” abspeichert, welche keine Formatierungen und Layoutinformationen beinhaltet, sondern lediglich die Inhalte an sich. Zusätzlich stellt das Headless CMS nun eine Schnittstelle zur Verfügung, über die die Inhalte abgerufen werden können. Dabei handelt sich üblicherweise um ein Rest-API, es gibt aber auch bereits einige Systeme am Markt die die neue Abfragesprache GraphQL verwenden.\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"wide-left col-xsmall-12 col-medium-8 col-medium-offset-1 \">\n            \n\u003Ch2>Warum sollte man nun Headless CMS statt einem monolithischen CMS verwenden?\u003C/h2>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Ein Headless CMS hat gegenüber dem klassischen CMS einige Vorteile. Der Naheliegendste und aus meiner Sicht auch Wichtigste ist dabei die Multichannel-Fähigkeit bzw. die Möglichkeit mehrere verschiedene Frontends anzubinden.&nbsp;\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Hier eine Übersicht über einige Vorteile gegenüber dem klassischen CMS:\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3  standard-list\">\n            \n\u003Cul>\u003Cli>Anbindung mehrerer Frontends&nbsp;\u003C/li>\u003Cli>Mehr Flexibilität für Frontend Developer (hinsichtlich Programmiersprachen etc.)\u003C/li>\u003Cli>Die Time-to-market kann reduziert werden, weil die Content-Creators zeitgleich mit der Entwicklung des Frontends beginnen können\u003C/li>\u003Cli>Die Benutzung des Headless CMS ist für Redakteure einfacher, da es weniger Funktionen gibt und das System daher weniger komplex ist\u003C/li>\u003Cli>Bessere Skalierbarkeit, Performance und Sicherheitsvorteile das Headless CMS oft SaaS-Lösungen sind&nbsp;\u003C/li>\u003C/ul>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Natürlich gibt es aber dennoch auch einige Nachteile:\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3  standard-list\">\n            \n\u003Cul>\u003Cli>Höherer Aufwand, da kein fertiges Frontend mitgeliefert werden\u003C/li>\u003Cli>Mehr Knowhow im Frontend erforderlich, da von Grund auf entwickelt werden muss\u003C/li>\u003Cli>Keine Vorschau-Funktion für die Redakteure\u003C/li>\u003C/ul>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"wide-left col-xsmall-12 col-medium-8 col-medium-offset-1 \">\n            \n\u003Ch2>Haben nicht System wie Drupal oder WordPress mittlerweile auch REST-Schnittstellen?\u003C/h2>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Natürlich ist der Headless-Trend auch nicht spurlos an den monolithischen CMS-Lösungen vorübergegangen. So wurden Systeme wie WordPress oder Drupal in den letzten Jahren auch um (REST-)APIs erweitert, an die nun zusätzliche Frontend Apps angehängt werden können. Im Gegensatz zu Headless CMS Lösungen sind die Systeme damit zwar noch immer nicht “API-first” entwickelt, aber sie nähern sich dabei immer mehr einem \u003Cem>Hybrid CMS\u003C/em> oder \u003Cem>DECOUPLED CMS\u003C/em> an.\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Ch2>Was ist ein Hybrid CMS bzw. ein Decoupled CMS?\u003C/h2>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Ein Hybrid CMS versucht zwischen dem klassischen “Page-driven” Ansatz und dem neueren “API-driven” Ansatz gewissermaßen einen Mittelweg zu gehen. Es bietet hierfür unter anderem Editoren und Vorschau-Funktionen an, die es Redakteuren ermöglichen mehr Einfluss auf die Darstellung ihrer Inhalte zu nehmen. Die Inhalte werden also hier meist formatiert gespeichert, womit eine saubere Trennung zwischen Backend und Frontend nicht mehr gegeben ist. Dennoch gibt es in einem Hybrid CMS auch eine Schnittstelle, über welche die Inhalte abgerufen werden können. Somit kann auch eine zusätzliche Frontend-App angehängt werden. Der Entwicklungsaufwand im Frontend ist dabei aber vermutlich meist eine Spur höher, da die Inhalte nicht einer solchen “Rohform” vorliegen, wie in einem Headless CMS. Ich denke es lässt sich sagen dass sowohl Drupal als auch WordPress in den letzten Jahren beide diese Richtung eingeschlagen haben.\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Ein Decoupled CMS auf der anderen Seite ist nun eines, das die Trennung zwischen Frontend und Backend strikt einhält und im Gegensatz zum Headless CMS dennoch ein Frontend als Teil des Systems inkludiert hat. Es kann also Entwicklungsaufwand gespart werden, indem auf das Frontend vom CMS zurückgegriffen wird und gleichzeitig können alle Vorteile der Headless-Architektur ausgespielt werden. Auf der anderen Seite kommen aber die Nachteile dieser Architektur ebenso zum Tragen und zwar in erster Linie hinsichtlich der Redakteure, welche nun weniger Einfluss auf die Darstellung der Inhalte haben.&nbsp;\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Ch2>Welches CMS sollte man nun also wählen?\u003C/h2>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Die Antwort, die wir für uns gefunden haben, mag etwas unbefriedigend erscheinen, aber ich denke sie liegt auf der Hand: es kommt auf das Projekt an.&nbsp;\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Bei großen Websites, welche in erster Linie auf Endgeräten mit größeren Screens dargestellt werden sollen, wird die Wahl denke ich noch immer auf die klassische Variante bzw. ein Hybrid CMS fallen. Diese Systeme haben sich für diese Zwecke einfach schon seit längerem bewährt und bieten für die Redakteure der Seite einige Mittel um Inhalte nach ihren Vorstellungen anzupassen. Eine Abstimmung mit den Developern für jedes kleine Layout-Detail ist somit also nicht notwendig. Sollte dann noch zusätzliche eine App angehängt werden kann dank Entwicklungen in Richtung Hybrid CMS noch immer auf eine API zurückgegriffen werden.&nbsp;\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Bei ganzen Portalen bzw. Plattformen welche von Vornherein darauf konzipiert sind Inhalte auf vielen verschiedenen Kanälen auszuliefern, also auch solchen welche nicht mit Webtechnologie entwickelt werden (native Mobile-Apps, Infoscreens, IoT-Geräte, etc.) sieht die Sache aber schon anders aus. Hier macht eine Headless- bzw. Decoupled-Architektur natürlich absolut Sinn, da es bei solch verschiedenen Frontend-Apps deutlich einfacher ist die Daten in “Rohform” zu bekommen.\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Wichtig ist am Ende des Tages vor allem das eine gute Abstimmung mit dem Kunden stattfindet, in der die Vorstellungen und Prioritäten herausgearbeitet werden, um so eine vernünftige Entscheidung über die Wahl des CMS treffen zu können.\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n\n\n\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Ich hoffe ihr konntet aus diesem Beitrag zu Headless CMS etwas für euch mitnehmen. Schreibt mir eure Fragen und Anmerkungen gerne in die Kommentare!\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n","Headless CMS Lösungen sind in den letzten Jahren immer wieder als Trend hervorgetreten. Hier wollen wir mit dem Thema etwas \r\naufräumen und euch die wichtigsten Unterschiede zu klassischen Systemen etwas näherbringen.",{"__typename":145,"id":146,"excludeFromScreenreader":13,"mediaImage":147,"name":152,"path":155,"status":20},"MediaImage","761",{"__typename":148,"url":149,"width":150,"height":151,"alt":13,"title":152,"size":153,"mime":154},"Image","http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/wp-migration/wordpress-media-image/2020/12/website-neu-2880x1300-1-scaled.jpg",2560,1156,"website neu 2880x1300",455509,"image/jpeg","/media/761/edit",{"__typename":145,"id":157,"excludeFromScreenreader":13,"mediaImage":158,"name":162,"path":164,"status":20},"760",{"__typename":148,"url":159,"width":160,"height":161,"alt":13,"title":162,"size":163,"mime":154},"http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/wp-migration/wordpress-media-image/2020/12/fb.jpg",1204,630,"fb",391444,"/media/760/edit","\u003C!-- This site is optimized with the Yoast SEO plugin v15.7 - https://yoast.com/wordpress/plugins/seo/ -->\n\u003Cmeta name=\"description\" content=\"Headless CMS Lösungen sind in den letzten Jahren immer wieder als Trend hervorgetreten. Hier wollen wir euch das Thema etwas näher bringen.\" />\n\u003Cmeta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" />\n\u003Clink rel=\"canonical\" href=\"https://legacy.liechtenecker.dev/blog/headless-cms/\" />\n\u003Cmeta property=\"og:locale\" content=\"de_DE\" />\n\u003Cmeta property=\"og:type\" content=\"article\" />\n\u003Cmeta property=\"og:title\" content=\"Headless CMS: eine Einführung Liechtenecker\" />\n\u003Cmeta property=\"og:description\" content=\"Headless CMS Lösungen sind in den letzten Jahren immer wieder als Trend hervorgetreten. Hier wollen wir euch das Thema etwas näher bringen.\" />\n\u003Cmeta property=\"og:url\" content=\"https://legacy.liechtenecker.dev/blog/headless-cms/\" />\n\u003Cmeta property=\"og:site_name\" content=\"Liechtenecker\" />\n\u003Cmeta property=\"article:published_time\" content=\"2020-12-03T16:00:10+00:00\" />\n\u003Cmeta name=\"twitter:card\" content=\"summary_large_image\" />\n\u003Cmeta name=\"twitter:label1\" content=\"Geschätzte Lesezeit\">\n\t\u003Cmeta name=\"twitter:data1\" content=\"5 Minuten\">\n\u003Cscript type=\"application/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https://legacy.liechtenecker.dev/#website\",\"url\":\"https://legacy.liechtenecker.dev/\",\"name\":\"Liechtenecker\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https://legacy.liechtenecker.dev/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"de-DE\"},{\"@type\":\"WebPage\",\"@id\":\"https://legacy.liechtenecker.dev/blog/headless-cms/#webpage\",\"url\":\"https://legacy.liechtenecker.dev/blog/headless-cms/\",\"name\":\"Headless CMS: eine Einf\\u00fchrung Liechtenecker\",\"isPartOf\":{\"@id\":\"https://legacy.liechtenecker.dev/#website\"},\"datePublished\":\"2020-12-03T16:00:10+00:00\",\"dateModified\":\"2020-12-03T16:00:10+00:00\",\"author\":{\"@id\":\"https://legacy.liechtenecker.dev/#/schema/person/6dfb3439b4a9b40be74f4265cc2bf3b0\"},\"description\":\"Headless CMS L\\u00f6sungen sind in den letzten Jahren immer wieder als Trend hervorgetreten. Hier wollen wir euch das Thema etwas n\\u00e4her bringen.\",\"inLanguage\":\"de-DE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https://legacy.liechtenecker.dev/blog/headless-cms/\"]}]},{\"@type\":\"Person\",\"@id\":\"https://legacy.liechtenecker.dev/#/schema/person/6dfb3439b4a9b40be74f4265cc2bf3b0\",\"name\":\"Fabian Schiel\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https://legacy.liechtenecker.dev/#personlogo\",\"inLanguage\":\"de-DE\",\"url\":\"https://secure.gravatar.com/avatar/eb6a4e1a97469169c51e2e0f93be1ff6?s=96&d=mm&r=g\",\"caption\":\"Fabian Schiel\"}}]}\u003C/script>\n\u003C!-- / Yoast SEO plugin. -->",{"__typename":167,"id":168,"myRole":169,"name":170,"nickname":171},"User","6","Backend-Dev","f-schiel","Fabian Schiel",{"latestKnowhow":173},[174,189,202],{"__typename":79,"id":175,"title":176,"path":177,"wpTeaserText":178,"wpPromotedTeaserImage":13,"wpHeaderImage":179},"1619","Behind the scenes: Ein Barrierefreiheits-Audit","/blog/behind-scenes-ein-barrierefreiheits-audit","”Entspricht unsere Website den gesetzlichen Anforderungen und wenn nicht, was genau müssen wir ändern?”\r\nDiese Frage lieben wir. Echt! Und so sieht unsere Antwort aus.",{"__typename":145,"id":180,"excludeFromScreenreader":13,"mediaImage":181,"name":187,"path":188,"status":20},"3364",{"__typename":148,"url":182,"width":183,"height":184,"alt":185,"title":13,"size":186,"mime":154},"http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/2026-04/Headerbilder%20Blogartikel%20Behind%20the%20scene%20Accessibility%20Audit.jpg",2880,1300,"Headline mit Sujet: Tastatur mit Symbolen für Barrierefreiheit im Fokus auf hellem  Hintergrund",838204,"Headerbilder Blogartikel Behind the scene Accessibility Audit.jpg","/media/3364/edit",{"__typename":79,"id":190,"title":191,"path":192,"wpTeaserText":193,"wpPromotedTeaserImage":13,"wpHeaderImage":194},"1616","Agentic KI trifft Design-System: Wie unser Presentation Maker entstand.","/blog/agentic-ki-trifft-design-system-wie-unser-presentation-maker-entstand","Nein, wir wollen euch jetzt nicht erzählen, was KI alles kann. Aber wir möchten euch zeigen, wie wir mit KI umgehen. \r\n",{"__typename":145,"id":195,"excludeFromScreenreader":13,"mediaImage":196,"name":200,"path":201,"status":20},"3355",{"__typename":148,"url":197,"width":183,"height":184,"alt":198,"title":13,"size":199,"mime":154},"http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/2026-03/BLOG_Presentation%20Tool_TITEL-2880x1300px_1.jpg","Lukas und Daniel  arbeiten an Computern im Büro.",2621988,"BLOG_Presentation Tool_TITEL-2880x1300px.jpg","/media/3355/edit",{"__typename":79,"id":203,"title":204,"path":205,"wpTeaserText":13,"wpPromotedTeaserImage":13,"wpHeaderImage":206},"1606","UI Trends 2026","/blog/ui-trends-2026",{"__typename":145,"id":207,"excludeFromScreenreader":21,"mediaImage":208,"name":212,"path":213,"status":20},"3303",{"__typename":148,"url":209,"width":183,"height":184,"alt":210,"title":13,"size":211,"mime":154},"http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/2026-01/BLOG_Trendbericht%202026.jpg","UI Trends 2026, gelber Hintergrund, schwarze Schrift.",4700748,"BLOG_Trendbericht 2026.jpg","/media/3303/edit",{"Language:de":215,"MenuItem:9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1":216,"MenuItem:1c7a5430-8a42-4b24-9544-252adabc2f4c":220,"MenuItem:9c4feedc-79e4-4fbf-b68c-065f33ebfe4c":223,"MenuItem:3b77a27b-272a-489f-843e-53e23ed07741":226,"MenuItem:ce0bb82b-e1ee-4036-be95-f693a62e9f4a":229,"MenuItem:04a19381-81a9-4694-8653-182d8855d2b5":232,"Menu:nuxt-main-menu":235,"ROOT_QUERY":249,"MenuItem:e2873307-b50a-4aab-b6b2-1950fd99c72e":265,"MenuItem:2cd9b7c9-142a-4ea3-b898-a0952c54a195":268,"MenuItem:a5effba3-5a8c-4125-8d78-0cdba09824db":271,"MenuItem:114bf071-bdbb-44cf-85c1-69e9d9e0777d":274,"Menu:footer":277,"TermCategories:7":287,"MediaImage:761":298,"MediaImage:760":300,"User:6":302,"NodeWpPost:771":303,"MediaImage:3364":325,"NodeWpPost:1619":327,"MediaImage:3355":330,"NodeWpPost:1616":332,"MediaImage:3303":335,"NodeWpPost:1606":337},["null","__typename",16,"id",17,"name",18,"direction",19],["null","__typename",10,"id",11,"title",12,"description",13,"url",14,"langcode",217,"internal",20,"expanded",21,"attributes",219],{"__ref":218},"Language:de",["null","__typename",23,"class",13],["null","__typename",10,"id",25,"title",26,"description",13,"url",27,"langcode",221,"internal",20,"expanded",21,"attributes",222],{"__ref":218},["null","__typename",23,"class",13],["null","__typename",10,"id",30,"title",31,"description",13,"url",32,"langcode",224,"internal",20,"expanded",21,"attributes",225],{"__ref":218},["null","__typename",23,"class",13],["null","__typename",10,"id",35,"title",36,"description",13,"url",37,"langcode",227,"internal",20,"expanded",21,"attributes",228],{"__ref":218},["null","__typename",23,"class",13],["null","__typename",10,"id",40,"title",41,"description",13,"url",42,"langcode",230,"internal",20,"expanded",21,"attributes",231],{"__ref":218},["null","__typename",23,"class",13],["null","__typename",10,"id",45,"title",46,"description",13,"url",47,"langcode",233,"internal",20,"expanded",21,"attributes",234],{"__ref":218},["null","__typename",23,"class",13],["null","__typename",5,"id",6,"name",7,"items",236],[237,239,241,243,245,247],{"__ref":238},"MenuItem:9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1",{"__ref":240},"MenuItem:1c7a5430-8a42-4b24-9544-252adabc2f4c",{"__ref":242},"MenuItem:9c4feedc-79e4-4fbf-b68c-065f33ebfe4c",{"__ref":244},"MenuItem:3b77a27b-272a-489f-843e-53e23ed07741",{"__ref":246},"MenuItem:ce0bb82b-e1ee-4036-be95-f693a62e9f4a",{"__ref":248},"MenuItem:04a19381-81a9-4694-8653-182d8855d2b5",["null","__typename",250,"menu({\"name\":\"NUXT_MAIN_MENU\"})",251,"menu({\"name\":\"FOOTER\"})",253,"route({\"path\":\"/blog/headless-cms\"})",255,"latestKnowhow({\"excludeId\":\"771\",\"limit\":3})",258],"Query",{"__ref":252},"Menu:nuxt-main-menu",{"__ref":254},"Menu:footer",["null","__typename",77,"entity",256],{"__ref":257},"NodeWpPost:771",[259,261,263],{"__ref":260},"NodeWpPost:1619",{"__ref":262},"NodeWpPost:1616",{"__ref":264},"NodeWpPost:1606",["null","__typename",10,"id",55,"title",56,"description",13,"url",57,"langcode",266,"internal",20,"expanded",21,"attributes",267],{"__ref":218},["null","__typename",23,"class",13],["null","__typename",10,"id",61,"title",62,"description",13,"url",63,"langcode",269,"internal",20,"expanded",21,"attributes",270],{"__ref":218},["null","__typename",23,"class",13],["null","__typename",10,"id",66,"title",67,"description",13,"url",68,"langcode",272,"internal",20,"expanded",21,"attributes",273],{"__ref":218},["null","__typename",23,"class",13],["null","__typename",10,"id",71,"title",72,"description",13,"url",73,"langcode",275,"internal",21,"expanded",21,"attributes",276],{"__ref":218},["null","__typename",23,"class",13],["null","__typename",5,"id",51,"name",52,"items",278],[279,281,283,285],{"__ref":280},"MenuItem:e2873307-b50a-4aab-b6b2-1950fd99c72e",{"__ref":282},"MenuItem:2cd9b7c9-142a-4ea3-b898-a0952c54a195",{"__ref":284},"MenuItem:a5effba3-5a8c-4125-8d78-0cdba09824db",{"__ref":286},"MenuItem:114bf071-bdbb-44cf-85c1-69e9d9e0777d",["null","__typename",116,"id",117,"name",118,"path",119,"status",20,"weight",120,"description",288,"langcode",289,"changed",290,"metatag",291],["null","__typename",122,"processed",123,"format",124],{"__ref":218},["null","__typename",83,"timestamp",127,"timezone",85,"offset",86,"time",128],[292,294,296],["null","__typename",93,"tag",94,"attributes",293],["null","__typename",96,"name",97,"content",132],["null","__typename",93,"tag",94,"attributes",295],["null","__typename",96,"name",135,"content",136],["null","__typename",100,"tag",101,"attributes",297],["null","__typename",103,"href",139,"hreflang",13,"rel",105,"media",13,"sizes",13,"type",13],["null","__typename",145,"id",146,"excludeFromScreenreader",13,"mediaImage",299,"name",152,"path",155,"status",20],["null","__typename",148,"url",149,"width",150,"height",151,"alt",13,"title",152,"size",153,"mime",154],["null","__typename",145,"id",157,"excludeFromScreenreader",13,"mediaImage",301,"name",162,"path",164,"status",20],["null","__typename",148,"url",159,"width",160,"height",161,"alt",13,"title",162,"size",163,"mime",154],["null","__typename",167,"id",168,"myRole",169,"name",170,"nickname",171],["null","__typename",79,"id",80,"title",81,"changed",304,"created",305,"langcode",306,"path",90,"promote",21,"status",20,"sticky",21,"metatag",307,"category",316,"contentElements",13,"evergreen",13,"tags",13,"wpBody",318,"wpHeaderImage",319,"wpHeaderImageOld",13,"wpHeaderImageOldSmall",13,"wpOgImage",321,"wpPromotedTeaserImage",13,"wpShareDescription",13,"wpShareTitle",13,"wpTeaserText",143,"wpYoastHead",165,"author",323],["null","__typename",83,"timestamp",84,"timezone",85,"offset",86,"time",87],["null","__typename",83,"timestamp",84,"timezone",85,"offset",86,"time",87],{"__ref":218},[308,310,312,314],["null","__typename",93,"tag",94,"attributes",309],["null","__typename",96,"name",97,"content",98],["null","__typename",100,"tag",101,"attributes",311],["null","__typename",103,"href",104,"hreflang",13,"rel",105,"media",13,"sizes",13,"type",13],["null","__typename",107,"tag",94,"attributes",313],["null","__typename",109,"property",110,"content",81],["null","__typename",107,"tag",94,"attributes",315],["null","__typename",109,"property",113,"content",114],{"__ref":317},"TermCategories:7",["null","__typename",141,"processed",142,"format",124,"summary",143],{"__ref":320},"MediaImage:761",{"__ref":322},"MediaImage:760",{"__ref":324},"User:6",["null","__typename",145,"id",180,"excludeFromScreenreader",13,"mediaImage",326,"name",187,"path",188,"status",20],["null","__typename",148,"url",182,"width",183,"height",184,"alt",185,"title",13,"size",186,"mime",154],["null","__typename",79,"id",175,"title",176,"path",177,"wpTeaserText",178,"wpPromotedTeaserImage",13,"wpHeaderImage",328],{"__ref":329},"MediaImage:3364",["null","__typename",145,"id",195,"excludeFromScreenreader",13,"mediaImage",331,"name",200,"path",201,"status",20],["null","__typename",148,"url",197,"width",183,"height",184,"alt",198,"title",13,"size",199,"mime",154],["null","__typename",79,"id",190,"title",191,"path",192,"wpTeaserText",193,"wpPromotedTeaserImage",13,"wpHeaderImage",333],{"__ref":334},"MediaImage:3355",["null","__typename",145,"id",207,"excludeFromScreenreader",21,"mediaImage",336,"name",212,"path",213,"status",20],["null","__typename",148,"url",209,"width",183,"height",184,"alt",210,"title",13,"size",211,"mime",154],["null","__typename",79,"id",203,"title",204,"path",205,"wpTeaserText",13,"wpPromotedTeaserImage",13,"wpHeaderImage",338],{"__ref":339},"MediaImage:3303"]