[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"global":3,"main-menu-products":18,"main-menu-blog-posts":172,"footer-navigation":227,"blog-post-headless-cms-architektur":409},[4,13],{"globalSet":5},{"alertBannerList":6},[7],{"id":8,"title":9,"alertType":10,"description":11,"linkLabel":12,"linkField":12},"4647","Dies ist eine Beta-Version der neuen cyon-Website","warning","\u003Cp>Einige Funktionen funktionieren möglicherweise \u003Cstrong>nicht\u003C\u002Fstrong> wie erwartet.\u003C\u002Fp>",null,{"globalSet":14},{"tokens":15},[16],{"key":17,"value":17},"",{"productsEntries":19,"productMetaMenuSections":126,"aboutEntries":130,"aboutMenuSections":167},[20,31,40,49,59,69,80,88,108,119],{"__typename":21,"title":22,"uri":23,"color":24,"subtitle":25,"productMenuSection":26,"productIcon":28},"productPageHostings_Entry","Webhosting","hosting\u002Fwebhosting","cherry","Alles, was deine Website braucht",[27],"hosting",[29],{"url":30},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fcherry.svg",{"__typename":21,"title":32,"uri":33,"color":34,"subtitle":35,"productMenuSection":36,"productIcon":37},"Webhosting Pro","hosting\u002Fwebhosting-pro","plum","Mehr Power für anspruchsvolle Webprojekte",[27],[38],{"url":39},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fplum.svg",{"__typename":21,"title":41,"uri":42,"color":43,"subtitle":44,"productMenuSection":45,"productIcon":46},"Sitebuilder","hosting\u002Fsitebuilder","strawberry","Deine eigene Website, überraschend einfach gemacht.",[27],[47],{"url":48},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fstrawberry.svg",{"__typename":21,"title":50,"uri":51,"color":52,"subtitle":53,"productMenuSection":54,"productIcon":56},"Managed Server","server\u002Fmanaged-server","pear","Dein eigener Server. Wir kümmern uns um den Rest.",[55],"server",[57],{"url":58},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fpear.svg",{"__typename":60,"title":61,"uri":62,"color":63,"subtitle":64,"productMenuSection":65,"productIcon":66},"productPageAgency_Entry","Agency Server","server\u002Fagency-server","grape","Deine Kundschaft, dein Server.",[55],[67],{"url":68},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fgrape.svg",{"__typename":70,"title":71,"uri":72,"color":73,"subtitle":74,"productMenuSection":75,"productIcon":77},"productPageDomain_Entry","Domains","domains\u002Fdomain-kaufen","bee","Alles beginnt mit deiner Domain",[76],"domains",[78],{"url":79},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fbee.svg",{"__typename":21,"title":81,"uri":82,"color":73,"subtitle":83,"productMenuSection":84,"productIcon":85},"Domain transferieren","domains\u002Fdomain-transferieren","Gönn deiner Domain ein schöneres Zuhause",[76],[86],{"url":87},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fflower.svg",{"__typename":89,"title":90,"uri":91,"metaMenuTitle":92,"iconSelect":95,"productMenuSection":96,"directLink":97},"productPageMeta_Entry","my.cyon: Ein Login für alles","hosting\u002Fmy-cyon",[93],{"title":94},"Services","apps",[27,55,76],{"__typename":98,"type":99,"label":12,"link":100,"url":101,"urlSuffix":12,"entry":102},"LinkData","entry","\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fmy-cyon\">my.cyon: Ein Login für alles\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fmy-cyon",{"id":103,"uri":91,"slug":104,"title":90,"enabled":105,"typeHandle":106,"sectionHandle":107,"__typename":89},"5322","my-cyon",true,"productPageMeta","products",{"__typename":89,"title":109,"uri":110,"metaMenuTitle":111,"iconSelect":113,"productMenuSection":114,"directLink":115},"Umzugsservice","hosting\u002Fumzug",[112],{"title":94},"rocket",[27,55],{"__typename":98,"type":116,"label":12,"link":117,"url":118,"urlSuffix":12,"entry":12},"url","\u003Ca href=\"https:\u002F\u002Forder.cyon.ch\u002Forder\u002Fpublic\u002Fdomains\">order.cyon.ch\u002Forder\u002Fpublic\u002Fdomains\u003C\u002Fa>","https:\u002F\u002Forder.cyon.ch\u002Forder\u002Fpublic\u002Fdomains",{"__typename":89,"title":120,"uri":121,"metaMenuTitle":122,"iconSelect":124,"productMenuSection":125,"directLink":12},"https:\u002F\u002F für alle","hosting\u002Fssl",[123],{"title":94},"certificate",[27,55],[127,128],{"title":94},{"title":129},"Preise",[131,137,143,149,155,160],{"label":132,"uri":133,"aboutMenuTitle":134,"iconSelect":136,"directLink":12},"Über cyon","ueber-cyon\u002Fcyon-macht-das-internet-zu-einem-besseren-ort",[135],{"title":132},"mood-smile",{"label":138,"uri":139,"aboutMenuTitle":140,"iconSelect":142,"directLink":12},"Team","ueber-cyon\u002Fteam",[141],{"title":132},"users-group",{"label":144,"uri":145,"aboutMenuTitle":146,"iconSelect":148,"directLink":12},"Jobs","ueber-cyon\u002Fjobs",[147],{"title":132},"book",{"label":150,"uri":151,"aboutMenuTitle":152,"iconSelect":154,"directLink":12},"Geschichte","ueber-cyon\u002Fgeschichte",[153],{"title":132},"file-description",{"label":156,"uri":157,"aboutMenuTitle":158,"iconSelect":95,"directLink":12},"Partner*innen","ueber-cyon\u002Fpartner",[159],{"title":132},{"label":161,"uri":162,"aboutMenuTitle":163,"iconSelect":166,"directLink":12},"Nachhaltigkeit","ueber-cyon\u002Fnachhaltigkeit",[164],{"title":165},"Verantwortung & Vertrauen","leaf",[168,169,170],{"title":132},{"title":165},{"title":171},"Team & Kultur",[173,201],{"title":174,"commentCount":175,"categories":176,"slug":183,"excerpt":184,"featuredImage":185,"seo":188,"author":191,"date":199,"id":200},"Phishing-Angriffe: Was wir täglich dagegen tun",3,{"nodes":177},[178,181],{"id":179,"name":180},"dGVybTozNQ==","Blog",{"id":182,"name":132},"dGVybTo2NzAz","phishing-angriffe-was-wir-taeglich-dagegen-tun","\u003Cp>«Wurden wir gehackt?» Diese Frage hören wir von unserer Kundschaft im Support immer wieder, sagt Lindita, Customer Care Specialist bei cyon. Die Nachricht wirkt bedrohlich: Da steht die eigene Domain, eine bekannte E-Mail-Adresse, vielleicht sogar ein Ablaufdatum. Alles klingt echt. Entsprechend gross ist die Unsicherheit. In solchen Situationen weisst du vielleicht nicht, wie du die […]\u003C\u002Fp>\n",{"node":186},{"sourceUrl":187},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2026\u002F03\u002Fphishing-angriffe.png",{"opengraphImage":189},{"mediaItemUrl":190},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2026\u002F03\u002Fphishing-angriffe-fb-li.jpg",{"node":192},{"id":193,"name":194,"email":195,"avatar":196},"dXNlcjozNw==","Svetlana Marchenko","sma@cyon.ch",{"url":197,"height":198,"width":198},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002Fa996559fe3a54e54474180cf9fd6292eb26e2bc18f22d8a3039785e3cdd14b53?s=96&d=mm&r=g",96,"2026-03-19T14:00:14","cG9zdDoyMjU0OQ==",{"title":202,"commentCount":203,"categories":204,"slug":210,"excerpt":211,"featuredImage":212,"seo":215,"author":218,"date":225,"id":226},"Welche Domains bei cyon am häufigsten registriert werden?",2,{"nodes":205},[206,207],{"id":179,"name":180},{"id":208,"name":209},"dGVybTo2NzAy","Neuigkeiten","cyon-domain-rangliste","\u003Cp>Die Wahl der passenden Domain-Endung ist ein zentraler Schritt für jede Website. Sie prägt, wie dein Projekt wahrgenommen wird, welche Zielgruppe du erreichst und wie klar dein Auftritt positioniert ist. In diesem Beitrag werfen wir einen Blick auf die beliebtesten Domain-Endungen unserer Kundinnen und Kunden, zeigen Entwicklungen der letzten Jahre auf und ordnen ein, was […]\u003C\u002Fp>\n",{"node":213},{"sourceUrl":214},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2026\u002F02\u002Fdomain-endungen.png",{"opengraphImage":216},{"mediaItemUrl":217},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2026\u002F02\u002Fdomain-endungen-fb-li.png",{"node":219},{"id":220,"name":221,"email":222,"avatar":223},"dXNlcjozMg==","Mona Sorcelli","mos@cyon.ch",{"url":224,"height":198,"width":198},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002Fb2a78212ccc46cd4dbd3c34c1e94df688a1397ff1fda06be5dcd76c3ec142043?s=96&d=mm&r=g","2026-02-12T16:23:59","cG9zdDoyMjUxOQ==",{"footerNavigation":228,"googleRating":404},{"footerMenu":229},[230,269,287,309,332,385],{"title":231,"footerMenuItems":232},"Hosting",[233,241,248,255,262],{"title":22,"footerMenuItemLink":234},{"__typename":98,"type":99,"label":12,"link":235,"url":236,"urlSuffix":12,"entry":237},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fwebhosting\">Webhosting\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fwebhosting",{"id":238,"uri":23,"slug":239,"title":22,"enabled":105,"typeHandle":240,"sectionHandle":107,"__typename":21},"736","webhosting","productPageHostings",{"title":32,"footerMenuItemLink":242},{"__typename":98,"type":99,"label":12,"link":243,"url":244,"urlSuffix":12,"entry":245},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fwebhosting-pro\">Webhosting Pro\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fwebhosting-pro",{"id":246,"uri":33,"slug":247,"title":32,"enabled":105,"typeHandle":240,"sectionHandle":107,"__typename":21},"5348","webhosting-pro",{"title":41,"footerMenuItemLink":249},{"__typename":98,"type":99,"label":12,"link":250,"url":251,"urlSuffix":12,"entry":252},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fsitebuilder\">Sitebuilder\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fsitebuilder",{"id":253,"uri":42,"slug":254,"title":41,"enabled":105,"typeHandle":240,"sectionHandle":107,"__typename":21},"5360","sitebuilder",{"title":120,"footerMenuItemLink":256},{"__typename":98,"type":99,"label":12,"link":257,"url":258,"urlSuffix":12,"entry":259},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fssl\">https:\u002F\u002F für alle\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fssl",{"id":260,"uri":121,"slug":261,"title":120,"enabled":105,"typeHandle":106,"sectionHandle":107,"__typename":89},"4388","ssl",{"title":109,"footerMenuItemLink":263},{"__typename":98,"type":99,"label":12,"link":264,"url":265,"urlSuffix":12,"entry":266},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fumzug\">Umzugsservice\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fumzug",{"id":267,"uri":110,"slug":268,"title":109,"enabled":105,"typeHandle":106,"sectionHandle":107,"__typename":89},"4365","umzug",{"title":270,"footerMenuItems":271},"Server",[272,279],{"title":50,"footerMenuItemLink":273},{"__typename":98,"type":99,"label":12,"link":274,"url":275,"urlSuffix":12,"entry":276},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fserver\u002Fmanaged-server\">Managed Server\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fserver\u002Fmanaged-server",{"id":277,"uri":51,"slug":278,"title":50,"enabled":105,"typeHandle":240,"sectionHandle":107,"__typename":21},"5355","managed-server",{"title":61,"footerMenuItemLink":280},{"__typename":98,"type":99,"label":12,"link":281,"url":282,"urlSuffix":12,"entry":283},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fserver\u002Fagency-server\">Agency Server\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fserver\u002Fagency-server",{"id":284,"uri":62,"slug":285,"title":61,"enabled":105,"typeHandle":286,"sectionHandle":107,"__typename":60},"1444","agency-server","productPageAgency",{"title":71,"footerMenuItems":288},[289,297,304],{"title":71,"footerMenuItemLink":290},{"__typename":98,"type":99,"label":12,"link":291,"url":292,"urlSuffix":12,"entry":293},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fdomains\u002Fdomain-kaufen\">Domains\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fdomains\u002Fdomain-kaufen",{"id":294,"uri":72,"slug":295,"title":71,"enabled":105,"typeHandle":296,"sectionHandle":107,"__typename":70},"3330","domain-kaufen","productPageDomain",{"title":81,"footerMenuItemLink":298},{"__typename":98,"type":99,"label":12,"link":299,"url":300,"urlSuffix":12,"entry":301},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fdomains\u002Fdomain-transferieren\">Domain transferieren\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fdomains\u002Fdomain-transferieren",{"id":302,"uri":82,"slug":303,"title":81,"enabled":105,"typeHandle":240,"sectionHandle":107,"__typename":21},"4114","domain-transferieren",{"title":305,"footerMenuItemLink":306},"Alle Domains",{"__typename":98,"type":116,"label":12,"link":307,"url":308,"urlSuffix":12,"entry":12},"\u003Ca href=\"\u002Fdomains\u002Falle-domains\">\u002Fdomains\u002Falle-domains\u003C\u002Fa>","\u002Fdomains\u002Falle-domains",{"title":310,"footerMenuItems":311},"Support",[312,317,322,327],{"title":313,"footerMenuItemLink":314},"Support Center",{"__typename":98,"type":116,"label":12,"link":315,"url":316,"urlSuffix":12,"entry":12},"\u003Ca href=\"\u002Fsupport\">\u002Fsupport\u003C\u002Fa>","\u002Fsupport",{"title":318,"footerMenuItemLink":319},"E-Mail Zauberer",{"__typename":98,"type":116,"label":12,"link":320,"url":321,"urlSuffix":12,"entry":12},"\u003Ca href=\"\u002Fsupport\u002Fmailwizard\">\u002Fsupport\u002Fmailwizard\u003C\u002Fa>","\u002Fsupport\u002Fmailwizard",{"title":323,"footerMenuItemLink":324},"my.cyon",{"__typename":98,"type":116,"label":12,"link":325,"url":326,"urlSuffix":12,"entry":12},"\u003Ca href=\"https:\u002F\u002Fmy.cyon.ch\u002F\">my.cyon.ch\u003C\u002Fa>","https:\u002F\u002Fmy.cyon.ch\u002F",{"title":328,"footerMenuItemLink":329},"Webmail",{"__typename":98,"type":116,"label":12,"link":330,"url":331,"urlSuffix":12,"entry":12},"\u003Ca href=\"https:\u002F\u002Fwebmail.cyon.ch\u002F\">webmail.cyon.ch\u003C\u002Fa>","https:\u002F\u002Fwebmail.cyon.ch\u002F",{"title":333,"footerMenuItems":334},"Über uns",[335,346,354,362,369,376,378,379,381],{"title":336,"footerMenuItemLink":337},"Warum cyon",{"__typename":98,"type":99,"label":12,"link":338,"url":339,"urlSuffix":12,"entry":340},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fcyon-macht-das-internet-zu-einem-besseren-ort\">cyon macht das Internet zu einem besseren Ort\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fcyon-macht-das-internet-zu-einem-besseren-ort",{"id":341,"uri":133,"slug":342,"title":343,"enabled":105,"typeHandle":344,"sectionHandle":344,"__typename":345},"2016","cyon-macht-das-internet-zu-einem-besseren-ort","cyon macht das Internet zu einem besseren Ort","about","about_Entry",{"title":138,"footerMenuItemLink":347},{"__typename":98,"type":99,"label":12,"link":348,"url":349,"urlSuffix":12,"entry":350},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fteam\">Unser Team\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fteam",{"id":351,"uri":139,"slug":352,"title":353,"enabled":105,"typeHandle":344,"sectionHandle":344,"__typename":345},"2029","team","Unser Team",{"title":144,"footerMenuItemLink":355},{"__typename":98,"type":99,"label":12,"link":356,"url":357,"urlSuffix":12,"entry":358},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fjobs\">Jobs bei cyon\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fjobs",{"id":359,"uri":145,"slug":360,"title":361,"enabled":105,"typeHandle":344,"sectionHandle":344,"__typename":345},"3760","jobs","Jobs bei cyon",{"title":150,"footerMenuItemLink":363},{"__typename":98,"type":99,"label":12,"link":364,"url":365,"urlSuffix":12,"entry":366},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fgeschichte\">Geschichte\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fgeschichte",{"id":367,"uri":151,"slug":368,"title":150,"enabled":105,"typeHandle":344,"sectionHandle":344,"__typename":345},"3819","geschichte",{"title":156,"footerMenuItemLink":370},{"__typename":98,"type":99,"label":12,"link":371,"url":372,"urlSuffix":12,"entry":373},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fpartner\">Partner*innen\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fpartner",{"id":374,"uri":157,"slug":375,"title":156,"enabled":105,"typeHandle":344,"sectionHandle":344,"__typename":345},"3861","partner",{"title":377,"footerMenuItemLink":12},"Engagement",{"title":161,"footerMenuItemLink":12},{"title":380,"footerMenuItemLink":12},"Infrastruktur",{"title":180,"footerMenuItemLink":382},{"__typename":98,"type":116,"label":12,"link":383,"url":384,"urlSuffix":12,"entry":12},"\u003Ca href=\"\u002Fblog\">\u002Fblog\u003C\u002Fa>","\u002Fblog",{"title":386,"footerMenuItems":387},"Rechtliches",[388,400,402],{"title":389,"footerMenuItemLink":390},"AGB",{"__typename":98,"type":99,"label":12,"link":391,"url":392,"urlSuffix":12,"entry":393},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Flegal\u002Fagb\">AGB\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Flegal\u002Fagb",{"id":394,"uri":395,"slug":396,"title":389,"enabled":105,"typeHandle":397,"sectionHandle":398,"__typename":399},"6225","legal\u002Fagb","agb","legalPage","legalPages","legalPage_Entry",{"title":401,"footerMenuItemLink":12},"Datenschutzerklärung",{"title":403,"footerMenuItemLink":12},"Impressum",{"heroContent":405},{"__typename":406,"googleRating":407},"heroContent_ContentBlock",{"stars":408},4.8,{"id":410,"databaseId":411,"slug":412,"title":413,"content":414,"date":415,"modified":416,"commentCount":417,"status":418,"featuredImage":419,"categories":422,"seo":428,"author":436,"comments":443},"cG9zdDoyMjE1NA==",22154,"headless-cms-architektur","Headless-Architektur: Wann lohnt sie sich wirklich","\u003Cp>Headless klingt modern, flexibel und performant. Doch nicht jedes Web-Projekt profitiert davon. Dieser Artikel zeigt auf, für welche Anforderungen sich ein Headless-Architekturansatz wirklich eignet und wo er unnötig komplex wird.\u003C\u002Fp>\n\u003Cp>\u003Cem>Ein Gastbeitrag von \u003Ca href=\"https:\u002F\u002Frequired.com\u002Fde\u002Fagentur\u002Fkarin\u002F\">Karin Christen\u003C\u002Fa>, Co-Founder der Agentur, \u003Ca href=\"https:\u002F\u002Frequired.com\u002F\">required\u003C\u002Fa>.\u003C\u002Fem>\u003C\u002Fp>\n\u003Cp>\u003Cimg loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-22178 size-full\" src=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F08\u002Fheadless-cms-architektur.jpg\" alt=\"Abstrakte Grafik einer modularen Struktur in Blau-, Orange- und Grautönen. Die Elemente erinnern an miteinander verbundene Komponenten oder Blöcke, die eine technische Architektur symbolisieren. In der Mitte steht der Titel: „Headless: Für welche Projekte es sich wirklich lohnt“. Unten rechts ist das Logo von cyon (Webhosting und Domains) platziert.\" width=\"1200\" height=\"675\" srcset=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F08\u002Fheadless-cms-architektur.jpg 1200w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F08\u002Fheadless-cms-architektur-576x324.jpg 576w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F08\u002Fheadless-cms-architektur-600x338.jpg 600w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F08\u002Fheadless-cms-architektur-768x432.jpg 768w\" sizes=\"auto, (max-width: 1200px) 100vw, 1200px\" \u002F>\u003C\u002Fp>\n\u003Cdiv id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n\u003Cdiv class=\"ez-toc-title-container\">\u003Cp class=\"ez-toc-title\" style=\"cursor:inherit\">Inhalt dieses Beitrags:\u003C\u002Fp>\n\u003C\u002Fdiv>\u003Cnav>\u003Cul class='ez-toc-list ez-toc-list-level-1 ' >\u003Cli class='ez-toc-page-1 ez-toc-heading-level-2'>\u003Ca class=\"ez-toc-link ez-toc-heading-1\" href=\"#Soll_jedes_Web-Projekt_Headless_sein\" >Soll jedes Web-Projekt Headless sein?\u003C\u002Fa>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-2'>\u003Ca class=\"ez-toc-link ez-toc-heading-2\" href=\"#Was_bedeutet_Headless_ueberhaupt\" >Was bedeutet Headless überhaupt?\u003C\u002Fa>\u003Cul class='ez-toc-list-level-3' >\u003Cli class='ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-3\" href=\"#Headless_vs_Klassisch\" >Headless vs. Klassisch\u003C\u002Fa>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-2'>\u003Ca class=\"ez-toc-link ez-toc-heading-4\" href=\"#Wann_ist_Headless_sinnvoll_und_wann_nicht\" >Wann ist Headless sinnvoll und wann nicht?\u003C\u002Fa>\u003Cul class='ez-toc-list-level-3' >\u003Cli class='ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-5\" href=\"#Ausgangslage_Von_der_Mobile-App_zur_geraeteuebergreifenden_Plattform\" >Ausgangslage: Von der Mobile-App zur geräteübergreifenden Plattform\u003C\u002Fa>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-6\" href=\"#Entscheidungskriterien_im_Projekt\" >Entscheidungskriterien im Projekt\u003C\u002Fa>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-2'>\u003Ca class=\"ez-toc-link ez-toc-heading-7\" href=\"#Typische_Stolperfallen_und_Herausforderungen_bei_Headless_Web-Projekten\" >Typische Stolperfallen und Herausforderungen bei Headless Web-Projekten\u003C\u002Fa>\u003Cul class='ez-toc-list-level-3' >\u003Cli class='ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-8\" href=\"#Mehr_Architektur_mehr_Initialaufwand\" >Mehr Architektur = mehr Initialaufwand\u003C\u002Fa>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-9\" href=\"#Erfahrene_Entwickler_innen_sind_Pflicht\" >Erfahrene Entwickler:innen sind Pflicht\u003C\u002Fa>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-10\" href=\"#Redaktionsfreundlichkeit_muss_bewusst_mitgedacht_werden\" >Redaktionsfreundlichkeit muss bewusst mitgedacht werden\u003C\u002Fa>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-11\" href=\"#Maintenance-Aufwand_nicht_unterschaetzen\" >Maintenance-Aufwand nicht unterschätzen\u003C\u002Fa>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-2'>\u003Ca class=\"ez-toc-link ez-toc-heading-12\" href=\"#Fuer_welche_Projekte_lohnt_sich_Headless_und_fuer_welche_nicht\" >Für welche Projekte lohnt sich Headless und für welche nicht?\u003C\u002Fa>\u003Cul class='ez-toc-list-level-3' >\u003Cli class='ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-13\" href=\"#%E2%9C%85_Headless_lohnt_sich_wenn_%E2%80%A6\" >✅ Headless lohnt sich, wenn …\u003C\u002Fa>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-14\" href=\"#%E2%9D%8C_Headless_lohnt_sich_nicht_wenn_%E2%80%A6\" >❌ Headless lohnt sich nicht, wenn …\u003C\u002Fa>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-15\" href=\"#Unser_Fazit\" >Unser Fazit\u003C\u002Fa>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-2'>\u003Ca class=\"ez-toc-link ez-toc-heading-16\" href=\"#Wie_wir_Headless_Web-Projekte_umsetzen\" >Wie wir Headless Web-Projekte umsetzen\u003C\u002Fa>\u003Cul class='ez-toc-list-level-3' >\u003Cli class='ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-17\" href=\"#Unser_technisches_Setup\" >Unser technisches Setup\u003C\u002Fa>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-18\" href=\"#Redaktion_Content-Management\" >Redaktion & Content-Management\u003C\u002Fa>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-3'>\u003Ca class=\"ez-toc-link ez-toc-heading-19\" href=\"#Modularer_Code_bessere_Wartbarkeit\" >Modularer Code = bessere Wartbarkeit\u003C\u002Fa>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-2'>\u003Ca class=\"ez-toc-link ez-toc-heading-20\" href=\"#Headless_ist_kein_Hype_sondern_ein_bewusst_gewaehlter_Architekturansatz_fuer_bestimmte_Anforderungen\" >Headless ist kein Hype, sondern ein bewusst gewählter Architekturansatz für bestimmte Anforderungen.\u003C\u002Fa>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-2'>\u003Ca class=\"ez-toc-link ez-toc-heading-21\" href=\"#Weiterfuehrende_Links\" >Weiterführende Links\u003C\u002Fa>\u003C\u002Fli>\u003Cli class='ez-toc-page-1 ez-toc-heading-level-2'>\u003Ca class=\"ez-toc-link ez-toc-heading-22\" href=\"#Deine_Meinung\" >Deine Meinung?\u003C\u002Fa>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fnav>\u003C\u002Fdiv>\n\u003Ch2>\u003Cspan class=\"ez-toc-section\" id=\"Soll_jedes_Web-Projekt_Headless_sein\">\u003C\u002Fspan>Soll jedes Web-Projekt Headless sein?\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>Headless, Progressive Web-Apps (PWA) – das sind Buzzwords, die uns als Agentur bestens vertraut sind. Mal tauchen sie im Trendradar auf, mal ganz konkret in Briefings und Feature-Requests potenzieller Kund:innen. Das erinnert fast ein wenig an die Zeit von damals, als plötzlich alle nach «HTML5» fragten – egal, ob man wusste, was das genau war.\u003C\u002Fp>\n\u003Cp>In letzter Zeit begegnet uns der Begriff «Headless» immer häufiger, oft als Entscheidungskriterium in Kundenanforderungen.\u003C\u002Fp>\n\u003Cp>Wir haben erlebt, dass Projekte an andere Agenturen vergeben wurden, weil dort offensiv mit «Headless CMS» geworben wurde, unabhängig davon, ob der Architekturansatz im konkreten Fall sinnvoll war.\u003C\u002Fp>\n\u003Cp>Der Hype ist nicht nur ein Kundenthema. Auch wir als Agentur sind manchmal in Versuchung, ein Projekt «technisch spannend» zu gestalten, obwohl es das gar nicht braucht.\u003C\u002Fp>\n\u003Cp>Es macht halt mehr Spass «fancy» Technologien einzusetzen, als ein solides, einfach wartbares klassisches Web-Projekt zu bauen. Aber: Gute Technik ist nicht, was cool ist, sondern was dem Projekt dient.\u003C\u002Fp>\n\u003Cp>Das gilt für Agenturen ebenso wie für Freelancer:innen: Wer selbst entscheidet, welche Technologien zum Einsatz kommen, trägt auch die Verantwortung dafür, realistisch zu bleiben.\u003C\u002Fp>\n\u003Cp>Solche Situationen machen deutlich, wie wichtig es ist, Kunden fundiert zu beraten. Denn:\u003C\u002Fp>\n\u003Caside class=\"explanation\">\u003Cstrong>Technik darf kein Selbstzweck sein.\u003C\u002Fstrong>\u003Cbr \u002F>\nAuch Entwickler:innen sind manchmal versucht, ein Projekt «technisch spannend» zu gestalten, obwohl es das gar nicht braucht.\u003Cbr \u002F>\nGute Architektur heisst nicht fancy Tools, sondern saubere Lösungen für reale Anforderungen.\u003C\u002Faside>\n\u003Cp>\u003Cstrong>Headless ist kein CMS – sondern eine Architekturstrategie.\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cp>Jedes \u003Ca href=\"https:\u002F\u002Fjamstack.org\u002Fheadless-cms\u002F\">moderne CMS\u003C\u002Fa> mit \u003Ca href=\"https:\u002F\u002Fde.wikipedia.org\u002Fwiki\u002FRepresentational_State_Transfer\">REST\u003C\u002Fa>– oder \u003Ca href=\"https:\u002F\u002Fgraphql.org\u002F\">GraphQL\u003C\u002Fa>-API kann «headless» verwendet werden. Die Frage ist also nicht «Ist das CMS Headless?», sondern «Wann ergibt es überhaupt Sinn, ein Projekt als Headless-Lösung umzusetzen und wann nicht?»\u003C\u002Fp>\n\u003Cp>In diesem Artikel zeige ich auf:\u003C\u002Fp>\n\u003Cul>\n\u003Cli>Welche Faktoren bei dieser Entscheidung wirklich zählen\u003C\u002Fli>\n\u003Cli>Wann sich der Headless-Architekturansatz lohnt\u003C\u002Fli>\n\u003Cli>Und warum diese Entscheidung nicht allein von der Kundenseite kommen sollte, sondern durch fundierte Beratung durch Agenturen und Entwickler:innen getragen werden muss\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>Das alles anhand eines realen Headless Kundenprojektes.\u003C\u002Fp>\n\u003Ch2>\u003Cspan class=\"ez-toc-section\" id=\"Was_bedeutet_Headless_ueberhaupt\">\u003C\u002Fspan>\u003Cstrong>Was bedeutet Headless überhaupt?\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>Bevor man beurteilen kann, ob Headless «sinnvoll» ist, muss man zuerst verstehen, was damit überhaupt gemeint ist und was oft fälschlicherweise hineininterpretiert wird.\u003C\u002Fp>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"Headless_vs_Klassisch\">\u003C\u002Fspan>\u003Cstrong>Headless vs. Klassisch\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>Eine Headless-Architektur trennt das Backend (z. B. CMS, Datenbank, Admin-Interface) vom Frontend (also der Darstellung im Browser oder in einer App). Die Inhalte werden via Schnittstelle (API) ausgeliefert, meistens REST oder GraphQL, und vom Frontend dynamisch dargestellt.\u003C\u002Fp>\n\u003Cp>\u003Cstrong>Wichtig:\u003C\u002Fstrong> Headless bedeutet nicht automatisch schneller, besser oder moderner – es bedeutet: flexibler, unabhängiger, aber auch: technisch anspruchsvoller.\u003C\u002Fp>\n\u003Cp>\u003Cimg loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-22158\" src=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fheadless-Frame_5820.png\" alt=\"\" width=\"2046\" height=\"1388\" srcset=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fheadless-Frame_5820.png 2046w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fheadless-Frame_5820-576x391.png 576w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fheadless-Frame_5820-600x407.png 600w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fheadless-Frame_5820-768x521.png 768w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fheadless-Frame_5820-1536x1042.png 1536w\" sizes=\"auto, (max-width: 2046px) 100vw, 2046px\" \u002F>\u003C\u002Fp>\n\u003Cp>Benutzt man einen Headless-Ansatz zusammen mit einer Progressive-Web-App (PWA) bedeutet dies einen modularen Aufbau. Sodass einzelne Teile der Applikation unabhängig voneinander entwickelt, gewartet und erweitert werden können, z. B. Log-in, Suchfunktion, Navigation, Inhalt. Das macht die Plattform langfristig besser wartbar und erweiterbar, vor allem, wenn verschiedene Teams oder Partner involviert sind.\u003C\u002Fp>\n\u003Cp>Somit ist die App skalierbar, nicht nur für die technische Performance (mehr User, mehr Daten), sondern vor allem: funktionale Skalierung. Also die Fähigkeit, neue Funktionen, Module oder sogar neue Instanzen (z. B. für weitere Mandanten) ohne Redesign oder Architekturumbau zu integrieren.\u003C\u002Fp>\n\u003Cp>An einem konkreten Kundenprojekt – dem \u003Ca href=\"https:\u002F\u002Frequired.com\u002Fde\u002Fportfolio\u002Fcase-study-berufswahl-portal\u002F\">Berufswahlportal des Kantons Zürich\u003C\u002Fa> – zeigen wir, wie sich ein Headless-Architekturansatz in der Praxis bewährt hat und wo die Herausforderungen lagen. Die Plattform wurde mit unserem \u003Ca href=\"https:\u002F\u002Frequired.com\u002Fde\u002Fagentur\u002F\">Team\u003C\u002Fa> als Headless \u003Ca href=\"https:\u002F\u002Frequired.com\u002Fde\u002Fweb-app-entwickeln-lassen\u002F\">Web-App\u003C\u002Fa> realisiert und so konzipiert, dass sie kantonsübergreifend eingesetzt werden kann, mit modularen Funktionen, die gemeinsam weiterentwickelt und genutzt werden. Dabei war die Wahl des Headless-Architekturansatzes kein Selbstzweck, sondern eine strategische Entscheidung.\u003C\u002Fp>\n\u003Cp>Was uns zur nächsten Frage bringt:\u003C\u002Fp>\n\u003Ch2>\u003Cspan class=\"ez-toc-section\" id=\"Wann_ist_Headless_sinnvoll_und_wann_nicht\">\u003C\u002Fspan>\u003Cstrong>Wann ist Headless sinnvoll und wann nicht?\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>Headless bringt dann ihre Stärken ins Spiel, wenn bestimmte Rahmenbedingungen erfüllt sind. Sie ist kein Allheilmittel, aber in komplexeren Projekten mit mehreren Zielgruppen, langfristiger Weiterentwicklung und Anforderungen an Flexibilität lohnt sich der Aufwand.\u003C\u002Fp>\n\u003Cp>Schauen wir auf das \u003Ca href=\"https:\u002F\u002Fberufswahl.zh.ch\u002F\">Berufswahlportal\u003C\u002Fa> des Kantons Zürich, um tiefer ins Detail zu gehen:\u003C\u002Fp>\n\u003Cdiv id=\"attachment_22156\" class=\"wp-caption alignnone\">\u003Cimg loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-22156\" class=\"wp-image-22156 size-full\" src=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fberufswahlportal-zh-startseite-1.avif\" alt=\"berufswahl.zh.ch\" width=\"1590\" height=\"951\" srcset=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fberufswahlportal-zh-startseite-1.avif 1590w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fberufswahlportal-zh-startseite-1-576x345.avif 576w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fberufswahlportal-zh-startseite-1-600x359.avif 600w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fberufswahlportal-zh-startseite-1-768x459.avif 768w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fberufswahlportal-zh-startseite-1-1536x919.avif 1536w\" sizes=\"auto, (max-width: 1590px) 100vw, 1590px\" \u002F>\u003Cp id=\"caption-attachment-22156\" class=\"wp-caption-text\">berufswahl.zh.ch\u003C\u002Fp>\u003C\u002Fdiv>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"Ausgangslage_Von_der_Mobile-App_zur_geraeteuebergreifenden_Plattform\">\u003C\u002Fspan>\u003Cstrong>Ausgangslage: Von der Mobile-App zur geräteübergreifenden Plattform\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>Die Anforderung des Kunden war zunächst erstaunlich simpel:\u003C\u002Fp>\n\u003Cp>«Können wir unsere bestehende Mobile-App so erweitern, dass Jugendliche und Lehrpersonen im Berufswahlunterricht dieselben Inhalte auch am Desktop nutzen können?»\u003C\u002Fp>\n\u003Cp>Im ersten Moment hätte man denken können: Das lässt sich mit ein paar Anpassungen am Frontend (Stichwort: \u003Ca href=\"https:\u002F\u002Frequired.com\u002Fde\u002Fblog\u002Fresponsive-design\u002F\">Responsive Design\u003C\u002Fa>) erledigen. Doch in der Analyse wurde schnell klar: Es ging nicht um eine Website mit responsivem Layout, sondern um eine grundsätzliche Weiterentwicklung der Plattform.\u003C\u002Fp>\n\u003Cp>Gemeinsam mit dem Kunden sind wir zentrale Fragen durchgegangen, die letztlich zur Entscheidung für einen Headless-Architekturansatz geführt haben:\u003C\u002Fp>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"Entscheidungskriterien_im_Projekt\">\u003C\u002Fspan>\u003Cstrong>Entscheidungskriterien im Projekt\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cul>\n\u003Cli>\u003Cstrong>Offline-Funktion:\u003C\u002Fstrong> Gibt es im Klassenzimmer zuverlässiges WLAN? Soll der Unterricht auch dann möglich sein, wenn die Verbindung mal wegbricht? Headless + PWA erlaubt eine gezielte Offline-Erfahrung. Wichtig dabei ist, Offlinefähigkeit ist kein Automatismus. Sie muss gezielt umgesetzt werden, etwa durch den Einsatz von \u003Ca href=\"https:\u002F\u002Fde.wikipedia.org\u002Fwiki\u002FService_Worker\">Service Workern\u003C\u002Fa>, Caching-Strategien und der Auswahl geeigneter Datenstrukturen.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Lokale Zwischenspeicherung (\u003Ca href=\"https:\u002F\u002Fde.wikipedia.org\u002Fwiki\u002FWeb_Storage\">LocalStorage\u003C\u002Fa>):\u003C\u002Fstrong> Wie lange dauern die Aufgaben im Unterricht? Sollen Fortschritte lokal gespeichert werden, um eine unterbrechungsfreie Nutzung zu garantieren?\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Benachrichtigungen:\u003C\u002Fstrong> Wie wichtig sind Push-Notifications im Alltag der Jugendlichen? Welche Rolle spielen Erinnerungen und Hinweise in der Nutzerführung?\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Orientierung & User Experience (UX):\u003C\u002Fstrong> Wie schaffen wir Übersicht in einer Plattform mit sehr vielen Inhalten, Funktionen und möglichen Einstiegen, ohne die Jugendlichen zu überfordern?\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Personalisierung:\u003C\u002Fstrong> Wie kann die Plattform individuell unterstützen, z. B. mit Fortschritt, eigenen Favoriten oder angeleiteten Aufgaben?\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>All diese Fragen führten zu einer gemeinsamen Erkenntnis:\u003C\u002Fp>\n\u003Cp>Die bestehende Struktur war zu starr. Es brauchte eine flexible, modulare Plattform, die inhaltlich wie technisch weiterwachsen kann und dabei sowohl App-Funktionalität als auch klassische Website-Nutzung erlaubt.\u003C\u002Fp>\n\u003Cp>Das entscheidende Argument für die Trennung von Backend und Frontend war jedoch ein anderes:\u003C\u002Fp>\n\u003Cp>\u003Cstrong>Die Plattform sollte künftig auch anderen Kantonen zur Verfügung stehen können, mit jeweils eigenem Design, eigenem Auftritt (CI\u002FCD), aber gemeinsam genutzten Funktionen und weiter entwickelbaren Modulen.\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cdiv id=\"attachment_22157\" class=\"wp-caption alignnone\">\u003Cimg loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-22157\" class=\"wp-image-22157 size-full\" src=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fcantons.png\" alt=\"Architekturaufbau Berufswahl-Portal\" width=\"2046\" height=\"1388\" srcset=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fcantons.png 2046w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fcantons-576x391.png 576w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fcantons-600x407.png 600w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fcantons-768x521.png 768w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F07\u002Fcantons-1536x1042.png 1536w\" sizes=\"auto, (max-width: 2046px) 100vw, 2046px\" \u002F>\u003Cp id=\"caption-attachment-22157\" class=\"wp-caption-text\">Architekturaufbau Berufswahl-Portal\u003C\u002Fp>\u003C\u002Fdiv>\n\u003Cp>Architekturaufbau Berufswahl-Portal\u003C\u002Fp>\n\u003Cp>Eine entkoppelte Architektur schafft genau diese Voraussetzung:\u003C\u002Fp>\n\u003Cul>\n\u003Cli>Die Inhalte und Funktionen können zentral gepflegt und weiterentwickelt werden\u003C\u002Fli>\n\u003Cli>Gleichzeitig kann jede Instanz ihr eigenes Look & Feel und spezifische Anpassungen erhalten\u003C\u002Fli>\n\u003Cli>Neue Kantone können sukzessive andocken, ohne das gesamte System umzubauen\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>Modularität, Mandantenfähigkeit und technologische Offenheit waren am Ende ausschlaggebend.\u003C\u002Fp>\n\u003Ch2>\u003Cspan class=\"ez-toc-section\" id=\"Typische_Stolperfallen_und_Herausforderungen_bei_Headless_Web-Projekten\">\u003C\u002Fspan>\u003Cstrong>Typische Stolperfallen und Herausforderungen bei Headless Web-Projekten\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>Headless klingt im Pitch oft wie die perfekte Lösung: flexibel, performant, modern. In der Realität bringt dieser Ansatz aber neue Verantwortlichkeiten und Herausforderungen mit sich, sowohl technisch als auch organisatorisch.\u003C\u002Fp>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"Mehr_Architektur_mehr_Initialaufwand\">\u003C\u002Fspan>\u003Cstrong>Mehr Architektur = mehr Initialaufwand\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>Bei klassischen CMS-Websites kann man oft auf bestehende Themes, oder in unserem Fall, Custom Boilerplates zurückgreifen. Im Headless-Setup muss alles noch mehr durchdacht und sauber entwickelt werden:\u003C\u002Fp>\n\u003Cul>\n\u003Cli>Wie sind Inhalte strukturiert?\u003C\u002Fli>\n\u003Cli>Wie sprechen Frontend und Backend über die API miteinander?\u003C\u002Fli>\n\u003Cli>Welche Komponenten können wiederverwendet werden?\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>Das ist anspruchsvoller und kostet in der Konzeptions- und Setup-Phase deutlich mehr Zeit.\u003C\u002Fp>\n\u003Cp>In unserem Projekt, dem Berufswahl-Portal, war das genau so: Wir haben länger gebraucht als ursprünglich geschätzt – nicht weil das Projekt schlecht lief, sondern weil das saubere Setup einfach mehr Denkarbeit verlangt und natürlich auch entsprechend etwas Know-how-Aufbau erforderte.\u003C\u002Fp>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"Erfahrene_Entwickler_innen_sind_Pflicht\">\u003C\u002Fspan>\u003Cstrong>Erfahrene Entwickler:innen sind Pflicht\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>Headless Web-Projekte verlangen fundierte Kenntnisse in mehreren Bereichen:\u003C\u002Fp>\n\u003Cul>\n\u003Cli>API-Design (REST oder GraphQL)\u003C\u002Fli>\n\u003Cli>JavaScript-Frameworks (React, Vue, etc.)\u003C\u002Fli>\n\u003Cli>Deployment-Prozesse und Hosting\u003C\u002Fli>\n\u003Cli>Content-Modelling und Redaktionsprozesse\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>Einfach ein CMS installieren und «losklicken» ist hier keine Option. Es braucht ein Team, das Frontend und Backend entkoppelt denken und trotzdem eng verzahnt arbeitet.\u003C\u002Fp>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"Redaktionsfreundlichkeit_muss_bewusst_mitgedacht_werden\">\u003C\u002Fspan>\u003Cstrong>Redaktionsfreundlichkeit muss bewusst mitgedacht werden\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>Ein oft unterschätzter Aspekt ist die Redaktionssicht:\u003C\u002Fp>\n\u003Cp>Headless bedeutet, dass das CMS keine direkte Vorschau oder visuelle Kontrolle mehr bietet (da entkoppelt vom Frontend). Redakteur:innen arbeiten in einem abstrahierten Interface – Navigation, Layout oder Verlinkungen sind keine Standard-Funktionen wie in einem klassischen CMS. \u003Cstrong>Das WYSIWYG-Prinzip (What You See Is What You Get)\u003C\u002Fstrong> – also direkt sehen, wie eine Seite später aussieht – entfällt meist vollständig.\u003C\u002Fp>\n\u003Cp>Gerade für Redakteur:innen ohne technische Kenntnisse ist das ein echter Nachteil. Ohne Zusatzentwicklung können sie Änderungen nicht visuell prüfen oder Inhalte im Kontext sehen.\u003C\u002Fp>\n\u003Cp>Das bedeutet konkret:\u003C\u002Fp>\n\u003Cul>\n\u003Cli>Eine enge Zusammenarbeit mit Redaktion & UX ist nötig\u003C\u002Fli>\n\u003Cli>Vorschau-Funktionen müssen oft manuell implementiert werden\u003C\u002Fli>\n\u003Cli>Es braucht mehr redaktionelle Schulung und Support\u003C\u002Fli>\n\u003Cli>Und: Erwartungen müssen frühzeitig geklärt werden, sonst droht Frust nach dem Launch\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"Maintenance-Aufwand_nicht_unterschaetzen\">\u003C\u002Fspan>\u003Cstrong>Maintenance-Aufwand nicht unterschätzen\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>Im Gegensatz zu einem klassischen CMS, bei welchem man sich mit Core- und Plugin-Updates auseinandersetzt, erfordert eine Headless Web-App zusätzlich auch nach dem Launch erweiterten Aufwand in Pflege und Weiterentwicklung:\u003C\u002Fp>\n\u003Cul>\n\u003Cli>API-Kompatibilität sichern\u003C\u002Fli>\n\u003Cli>Nicht nur Backend-CMS, sondern auch Frontend-Frameworks aktuell halten\u003C\u002Fli>\n\u003Cli>Security, Hosting, Performance aktiv betreuen\u003C\u002Fli>\n\u003Cli>Redaktion unterstützen, wenn sich Anforderungen ändern\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>Bei uns sind nicht nur die Initialkosten, sondern auch das Maintenance-Budget für Headless-Webprojekte entsprechend höher als bei klassischen Websites, weil die Verantwortung auch technischer ist.\u003C\u002Fp>\n\u003Caside class=\"explanation\">Headless ist kein Shortcut. Es ist ein Architekturansatz, der mehr Möglichkeiten, aber auch mehr Verantwortung mit sich bringt. Wer das unterschätzt, wird schnell an Grenzen stossen.\u003C\u002Faside>\n\u003Ch2>\u003Cspan class=\"ez-toc-section\" id=\"Fuer_welche_Projekte_lohnt_sich_Headless_und_fuer_welche_nicht\">\u003C\u002Fspan>\u003Cstrong>Für welche Projekte lohnt sich Headless und für welche nicht?\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>Der Architekturansatz entfaltet den Mehrwert nicht in jedem Projekt, sondern dort, wo bestimmte Voraussetzungen erfüllt sind, sei es funktional, organisatorisch oder strategisch.\u003C\u002Fp>\n\u003Cp>Hier ein paar Leitfragen und Szenarien, die sich aus unserer Erfahrung bewährt haben:\u003C\u002Fp>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"%E2%9C%85_Headless_lohnt_sich_wenn_%E2%80%A6\">\u003C\u002Fspan>\u003Cstrong>✅ Headless lohnt sich, wenn …\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cul>\n\u003Cli>\u003Cstrong>Die Plattform mittelfristig wachsen soll\u003C\u002Fstrong>\u003Cbr \u002F>\nNeue Funktionen, neue Zielgruppen oder zusätzliche Mandanten (z. B. in unserem Fall, mehrere Kantone) sind absehbar? Dann bringt ein Headless-Ansatz langfristige Flexibilität.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Frontend-Logik komplex ist oder stark individualisiert werden muss\u003C\u002Fstrong>\u003Cbr \u002F>\nWenn die Darstellung nicht mit einem einfachen Theme gelöst werden kann (z. B. in unserem Fall, interaktive Anwendungen, personalisierte Dashboards, Inhalt und Funktionen über 5 verschiedene Schnittstellen).\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Die Applikation auch als PWA oder auf mehreren Geräten genutzt werden soll\u003C\u002Fstrong>\u003Cbr \u002F>\nMobile Nutzung mit Offline-Funktion, installierbare Web-Apps, Push-Nachrichten: All das lässt sich mit einem API-basierten Frontend gezielt realisieren.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Mehrere Teams oder Dienstleister an verschiedenen Teilen arbeiten\u003C\u002Fstrong>\u003Cbr \u002F>\nDurch die Trennung von Backend und Frontend können Design, Inhalt und Funktion parallel entwickelt und gewartet werden, oft ein entscheidender Effizienzfaktor für grosse Projekte und Teams.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Der Kunde oder das Produkt eine langfristige Digitalstrategie verfolgt\u003C\u002Fstrong>\u003Cbr \u002F>\nHeadless zahlt sich nicht sofort aus, aber sehr wohl über mehrere Jahre hinweg, gerade bei Plattformen mit hoher Relevanz und kontinuierlicher Weiterentwicklung.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"%E2%9D%8C_Headless_lohnt_sich_nicht_wenn_%E2%80%A6\">\u003C\u002Fspan>\u003Cstrong>❌ Headless lohnt sich nicht, wenn …\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cul>\n\u003Cli>\u003Cstrong>Das Projekt ein einmaliger Webauftritt mit wenigen Inhalten ist\u003C\u002Fstrong>\u003Cbr \u002F>\nEine klassische CMS-Website ist schneller realisiert, einfacher zu pflegen und günstiger in der Wartung.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Der Fokus auf visueller Kontrolle und Redaktionskomfort liegt\u003C\u002Fstrong>\u003Cbr \u002F>\nWenn Kund:innen direkt im Backend Seiten gestalten und Vorschauen sehen wollen, ist ein klassisches CMS oft sinnvoller, zumindest kurzfristig.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Das Budget oder die Zeit zu knapp ist\u003C\u002Fstrong>\u003Cbr \u002F>\nHeadless braucht sauberes Konzept, gutes Setup, erfahrene Leute und genau die Zeit, all das gibt ordentlich zu tun. Für Schnellschüsse ist es der falsche Weg.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Die Redaktionstechnologie bereits gesetzt ist , aber Headless als «Muss» gefordert wird\u003C\u002Fstrong>\u003Cbr \u002F>\nEin Warnsignal: Wenn die technische Strategie von der Kundenseite kommt, ohne dass klar ist, was sie lösen soll.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"Unser_Fazit\">\u003C\u002Fspan>\u003Cstrong>Unser Fazit\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>Headless ist dann eine gute Wahl, wenn sie das Projekt technisch und organisatorisch besser tragfähig macht, nicht nur, weil sie als «modern» gelten.\u003C\u002Fp>\n\u003Cp>Deshalb ist es umso wichtiger, dass Agenturen und Entwickler:innen hier beratend auftreten und nicht nur Buzzwords erfüllen. Denn nur mit einem klaren Verständnis der Anforderungen und Ziele kann die passende Architekturstrategie entschieden werden.\u003C\u002Fp>\n\u003Caside class=\"explanation\">\u003Cstrong>Checkliste to go: \u003C\u002Fstrong>Wann lohnt sich Headless und wann wird es zu kompliziert? Unsere PDF-Checkliste hilft bei der Einordnung.\u003Cbr \u002F>\n\u003Ca href=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F08\u002Fcyon-Checkliste-Headless-Architektur-1.pdf\" target=\"_blank\" rel=\"noopener\">Jetzt herunterladen\u003C\u002Fa>\u003C\u002Faside>\n\u003Ch2>\u003Cspan class=\"ez-toc-section\" id=\"Wie_wir_Headless_Web-Projekte_umsetzen\">\u003C\u002Fspan>\u003Cstrong>Wie wir Headless Web-Projekte umsetzen\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>In Headless Web-Projekten zählt nicht nur die Architektur, sondern auch das Zusammenspiel zwischen User Experience, Redaktion, Entwicklung und Betrieb. Ein gutes Setup vereinfacht langfristig den Alltag für uns als Agentur und für unsere Kund:innen.\u003C\u002Fp>\n\u003Cp>Hier ein Einblick, wie wir typischerweise arbeiten:\u003C\u002Fp>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"Unser_technisches_Setup\">\u003C\u002Fspan>\u003Cstrong>Unser technisches Setup\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>Wir setzen auf ein schlankes, bewährtes Setup mit Fokus auf Performance, Wartbarkeit und Erweiterbarkeit:\u003C\u002Fp>\n\u003Cp>\u003Cstrong>Backend:\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>Ein \u003Ca href=\"https:\u002F\u002Fjamstack.org\u002Fheadless-cms\u002F\">Headless-fähiges CMS\u003C\u002Fa>, das Inhalte, Navigation und Userrollen via API bereitstellt (z. B. \u003Ca href=\"https:\u002F\u002Fjamstack.org\u002Fheadless-cms\u002Fstrapi\u002F\">Strapi\u003C\u002Fa> oder in unserem Fall \u003Ca href=\"https:\u002F\u002Fjamstack.org\u002Fheadless-cms\u002Fwordpress\u002F\">WordPress\u003C\u002Fa>, wichtig ist Offenheit & API-Kompatibilität).\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>\u003Cstrong>Frontend:\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>\u003Ca href=\"https:\u002F\u002Freact.dev\u002F\">React\u003C\u002Fa> + \u003Ca href=\"https:\u002F\u002Freactrouter.com\u002F\">React Router 7\u003C\u002Fa> (JavaScript-Bibliothek zum Erstellen von Benutzeroberflächen)\u003C\u002Fli>\n\u003Cli>\u003Ca href=\"https:\u002F\u002Fvite.dev\u002F\">Vite\u003C\u002Fa> als Build-Tool\u003C\u002Fli>\n\u003Cli>State-Management je nach Projekt (z. B. Context API)\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>\u003Cstrong>Deployment & DevOps:\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>Lokale Entwicklung mit \u003Ca href=\"https:\u002F\u002Fwww.docker.com\u002F\">Docker\u003C\u002Fa>\u003C\u002Fli>\n\u003Cli>\u003Ca href=\"https:\u002F\u002Fgithub.com\u002F\">GitHub\u003C\u002Fa> Actions für automatisiertes Deployment\u003C\u002Fli>\n\u003Cli>Hosting je nach Setup: klassisch beim Kunden oder auf Hosting-Plattformen, wie in unserem Fall als \u003Ca href=\"https:\u002F\u002Frequired.com\u002Fde\u002Fblog\u002Fcms-traditionell-oder-headless\u002F#single-page-application\">Single Page Application\u003C\u002Fa> auf \u003Ca href=\"https:\u002F\u002Fwww.cyon.ch\u002F\">cyon\u003C\u002Fa>.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"Redaktion_Content-Management\">\u003C\u002Fspan>\u003Cstrong>Redaktion & Content-Management\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>Ein oft unterschätzter Teil in Headless-Projekten ist der redaktionelle Workflow. Wir achten darauf, dass die Inhalte so strukturiert sind, dass sie für Redakteur:innen verständlich und effizient bearbeitbar sind. Und zwar mit:\u003C\u002Fp>\n\u003Cul>\n\u003Cli>Bearbeitbare Navigation (z. B. Menüs, Seitenstruktur)\u003C\u002Fli>\n\u003Cli>Rollen- und Rechteverwaltung für unterschiedliche Nutzergruppen\u003C\u002Fli>\n\u003Cli>Editor-Vorschau (mit \u003Ca href=\"https:\u002F\u002Fdeveloper.wordpress.org\u002Frest-api\u002Fextending-the-rest-api\u002Fadding-custom-endpoints\u002F\">Custom Endpoints\u003C\u002Fa>) und vereinfachte Admin-Interfaces\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>Unser Ziel ist immer: maximale Flexibilität im Frontend, ohne dass die Redakteur:innen dabei auf der Strecke bleiben. In unserem Setup hat sich WordPress als Content-Hub bewährt, weil wir damit den \u003Ca href=\"https:\u002F\u002Frequired.com\u002Fde\u002Fleistungen\u002Fwordpress-entwicklung\u002Fwordpress-block-editor\u002F\" target=\"_blank\" rel=\"noopener\">Block-Editor\u003C\u002Fa> anbieten können: ein vertrautes, visuelles Interface, das eine angenehme Content-Writing-Experience ermöglicht. So arbeitet die Redaktion nicht nur mit abstrakten Formularfeldern, wie es bei reinen Headless-CMS wie Strapi & Co. oft der Fall ist, sondern mit einem übersichtlichen Editor, der Nähe zum späteren Layout schafft und die Pflege von Inhalten deutlich erleichtert.\u003C\u002Fp>\n\u003Ch3>\u003Cspan class=\"ez-toc-section\" id=\"Modularer_Code_bessere_Wartbarkeit\">\u003C\u002Fspan>\u003Cstrong>Modularer Code = bessere Wartbarkeit\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh3>\n\u003Cp>Wir entwickeln wiederverwendbare Frontend-Komponenten, die wie Bausteine zusammengesetzt werden. Das macht Erweiterungen einfacher, z. B. wenn ein neuer Kanton hinzukommt oder eine Funktion verändert werden soll.\u003C\u002Fp>\n\u003Cp>Das bedeutet aber auch: Gute Dokumentation, Versionskontrolle und ein durchdachter Komponentenkatalog (z. B. mit \u003Ca href=\"https:\u002F\u002Fstorybook.js.org\u002F\">Storybook\u003C\u002Fa>) sind Pflicht.\u003C\u002Fp>\n\u003Ch2>\u003Cspan class=\"ez-toc-section\" id=\"Headless_ist_kein_Hype_sondern_ein_bewusst_gewaehlter_Architekturansatz_fuer_bestimmte_Anforderungen\">\u003C\u002Fspan>Headless ist kein Hype, sondern ein bewusst gewählter Architekturansatz für bestimmte Anforderungen.\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>Headless Web-Projekte sind nicht automatisch besser, aber sie bieten echte Vorteile, wenn sie strategisch eingesetzt werden. Für uns als Agentur ist es kein allgemeiner Technologiewechsel, sondern nur für geeignete Projekte ein bewusster Schritt:\u003C\u002Fp>\n\u003Cp>Mehr Kontrolle über die Architektur, bessere Skalierbarkeit für komplexe Plattformen und ein hoher Qualitätsanspruch im Frontend.\u003C\u002Fp>\n\u003Cp>Die Einstiegshürde ist jedoch höher. Die Verantwortung grösser. Die Kund:innen müssen richtig beraten werden und die eigene Infrastruktur sollte so aufgestellt sein, dass sich diese Freiheit auch wirklich ausspielen lässt.\u003C\u002Fp>\n\u003Cp>Wir haben die Erfahrung gemacht, dass sich Headless lohnt, wenn man die richtigen Projekte auswählt.\u003C\u002Fp>\n\u003Ch2>\u003Cspan class=\"ez-toc-section\" id=\"Weiterfuehrende_Links\">\u003C\u002Fspan>\u003Cstrong>Weiterführende Links\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>Wenn dich interessiert, wie wir das Berufswahlportal für verschiedene Kantone konkret umgesetzt haben – welche zielgruppenspezifischen Funktionen wir dank des Headless-Ansatzes realisieren konnten und wie wir UX und Personalisierung auf einer modularen Plattform gedacht haben – dann findest du hier den ausführlichen Beitrag auf unserem Agenturblog:\u003C\u002Fp>\n\u003Cp>\u003Ca href=\"https:\u002F\u002Frequired.com\u002Fde\u002Fblog\u002Fheadless-wordpress-pwa\u002F\">Headless, aber nicht kopflos: zur modularen Web App (required.com)\u003C\u002Fa>\u003C\u002Fp>\n\u003Cp>Oder lehne dich zurück und schau dir den Talk «\u003Cstrong>How to Keep Your Head While Going Headless with WordPress»\u003C\u002Fstrong> an, den ich im Juni 2025 an der \u003Ca href=\"https:\u002F\u002Feurope.wordcamp.org\u002F2025\u002Fsession\u002Fhow-to-keep-your-head-while-going-headless-with-wordpress\u002F\">European WordPress Conference\u003C\u002Fa> gehalten habe.\u003C\u002Fp>\n\u003Ch2>\u003Cspan class=\"ez-toc-section\" id=\"Deine_Meinung\">\u003C\u002Fspan>\u003Cstrong>Deine Meinung?\u003C\u002Fstrong>\u003Cspan class=\"ez-toc-section-end\">\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>Hast du ähnliche Erfahrungen gemacht? Oder stehst du gerade vor einem Headless-Projekt? Ich freue mich über Austausch und Diskussion, gerne hier in den Kommentaren\u003C\u002Fp>\n\u003Cp>Titelbild: \u003Ca href=\"https:\u002F\u002Funsplash.com\u002Fde\u002F@3tnik\">A.C. \u002F Unsplash\u003C\u002Fa>\u003C\u002Fp>\n","2025-08-05T08:00:03","2025-08-07T17:17:38",4,"publish",{"node":420},{"sourceUrl":421},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F08\u002Fheadless-cms-architektur-MToL.jpg",{"nodes":423},[424,425],{"id":179,"name":180},{"id":426,"name":427},"dGVybTo2NzA0","CMS & Co.",{"fullHead":429,"metaDesc":430,"metaRobotsNofollow":431,"metaRobotsNoindex":432,"title":413,"opengraphModifiedTime":433,"opengraphImage":434},"\u003C!-- This site is optimized with the Yoast SEO Premium plugin  - https:\u002F\u002Fyoast.com\u002Fproduct\u002Fyoast-seo-premium-wordpress\u002F -->\n\u003Cmeta name=\"description\" content=\"Karin Christen von required zeigt am Beispiel des Berufswahlportals Zürich, wann Headless-Architektur sinnvoll ist. Jetzt den Reality-Check lesen!\" \u002F>\n\u003Clink rel=\"canonical\" href=\"https:\u002F\u002Fwww.cyon.ch\u002Fblog\u002Fheadless-cms-architektur\" \u002F>\n\u003Cmeta property=\"og:locale\" content=\"de_DE\" \u002F>\n\u003Cmeta property=\"og:type\" content=\"article\" \u002F>\n\u003Cmeta property=\"og:title\" content=\"Headless-Architektur: Wann lohnt sie sich wirklich\" \u002F>\n\u003Cmeta property=\"og:description\" content=\"Karin Christen von required zeigt am Beispiel des Berufswahlportals Zürich, wann Headless-Architektur sinnvoll ist. Jetzt den Reality-Check lesen!\" \u002F>\n\u003Cmeta property=\"og:url\" content=\"https:\u002F\u002Fwww.cyon.ch\u002Fblog\u002Fheadless-cms-architektur\" \u002F>\n\u003Cmeta property=\"og:site_name\" content=\"cyon-Blog\" \u002F>\n\u003Cmeta property=\"article:publisher\" content=\"https:\u002F\u002Fwww.facebook.com\u002Fcyonhosting\" \u002F>\n\u003Cmeta property=\"article:published_time\" content=\"2025-08-05T06:00:03+00:00\" \u002F>\n\u003Cmeta property=\"article:modified_time\" content=\"2025-08-07T15:17:38+00:00\" \u002F>\n\u003Cmeta property=\"og:image\" content=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F08\u002Fheadless-cms-architektur-fb-li.jpg\" \u002F>\n\t\u003Cmeta property=\"og:image:width\" content=\"1200\" \u002F>\n\t\u003Cmeta property=\"og:image:height\" content=\"627\" \u002F>\n\t\u003Cmeta property=\"og:image:type\" content=\"image\u002Fjpeg\" \u002F>\n\u003Cmeta name=\"author\" content=\"Karin Christen\" \u002F>\n\u003Cmeta name=\"twitter:card\" content=\"summary_large_image\" \u002F>\n\u003Cmeta name=\"twitter:image\" content=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F08\u002Fheadless-cms-architektur-tw-card-1.jpg\" \u002F>\n\u003Cmeta name=\"twitter:creator\" content=\"@cyon\" \u002F>\n\u003Cmeta name=\"twitter:site\" content=\"@cyon\" \u002F>\n\u003Cmeta name=\"twitter:label1\" content=\"Verfasst von\" \u002F>\n\t\u003Cmeta name=\"twitter:data1\" content=\"Karin Christen\" \u002F>\n\t\u003Cmeta name=\"twitter:label2\" content=\"Geschätzte Lesezeit\" \u002F>\n\t\u003Cmeta name=\"twitter:data2\" content=\"13 Minuten\" \u002F>\n\u003Cscript type=\"application\u002Fld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\u002F\\\u002Fschema.org\",\"@graph\":[{\"@type\":[\"Article\",\"BlogPosting\"],\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur#article\",\"isPartOf\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur\"},\"author\":{\"name\":\"Karin Christen\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#\\\u002Fschema\\\u002Fperson\\\u002F01469ec3ac5a001eedbff1acd657e1ad\"},\"headline\":\"Headless-Architektur: Wann lohnt sie sich wirklich\",\"datePublished\":\"2025-08-05T06:00:03+00:00\",\"dateModified\":\"2025-08-07T15:17:38+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur\"},\"wordCount\":2556,\"commentCount\":4,\"publisher\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#organization\"},\"image\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur#primaryimage\"},\"thumbnailUrl\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2025\\\u002F08\\\u002Fheadless-cms-architektur-MToL.jpg\",\"keywords\":[\"Content-Management-System\",\"Headless\",\"Headless-Architektur\",\"Webentwicklung\",\"WordPress\"],\"articleSection\":[\"Blog\",\"CMS & Co.\"],\"inLanguage\":\"de-CH\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur\",\"url\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur\",\"name\":\"Headless-Architektur: Wann lohnt sie sich wirklich\",\"isPartOf\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur#primaryimage\"},\"image\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur#primaryimage\"},\"thumbnailUrl\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2025\\\u002F08\\\u002Fheadless-cms-architektur-MToL.jpg\",\"datePublished\":\"2025-08-05T06:00:03+00:00\",\"dateModified\":\"2025-08-07T15:17:38+00:00\",\"description\":\"Karin Christen von required zeigt am Beispiel des Berufswahlportals Zürich, wann Headless-Architektur sinnvoll ist. Jetzt den Reality-Check lesen!\",\"breadcrumb\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur#breadcrumb\"},\"inLanguage\":\"de-CH\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de-CH\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur#primaryimage\",\"url\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2025\\\u002F08\\\u002Fheadless-cms-architektur-MToL.jpg\",\"contentUrl\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2025\\\u002F08\\\u002Fheadless-cms-architektur-MToL.jpg\",\"width\":1200,\"height\":675,\"caption\":\"Abstrakte Grafik einer modularen Struktur in Blau-, Orange- und Grautönen. Die Elemente erinnern an miteinander verbundene Komponenten oder Blöcke, die eine technische Architektur symbolisieren. In der Mitte steht der Titel: „Headless: Für welche Projekte es sich wirklich lohnt“. Unten rechts ist das Logo von cyon (Webhosting und Domains) platziert.\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fheadless-cms-architektur#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Headless-Architektur: Wann lohnt sie sich wirklich\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#website\",\"url\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F\",\"name\":\"cyon-Blog\",\"description\":\"Herzlich. Nachhaltig. Schnell. Sicher. Ästhetisch. Unser Blog - Deine Plattform für inspirierende Hosting-News.\",\"publisher\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de-CH\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#organization\",\"name\":\"cyon\",\"url\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de-CH\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#\\\u002Fschema\\\u002Flogo\\\u002Fimage\\\u002F\",\"url\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2025\\\u002F06\\\u002Fo_RGB_ColorfulOnWhite-01.png\",\"contentUrl\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2025\\\u002F06\\\u002Fo_RGB_ColorfulOnWhite-01.png\",\"width\":939,\"height\":938,\"caption\":\"cyon\"},\"image\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#\\\u002Fschema\\\u002Flogo\\\u002Fimage\\\u002F\"},\"sameAs\":[\"https:\\\u002F\\\u002Fwww.facebook.com\\\u002Fcyonhosting\",\"https:\\\u002F\\\u002Fx.com\\\u002Fcyon\",\"https:\\\u002F\\\u002Fswiss.social\\\u002F@cyon\",\"https:\\\u002F\\\u002Finstagram.com\\\u002Fcyon.ch\\\u002F\",\"https:\\\u002F\\\u002Fwww.linkedin.com\\\u002Fcompany\\\u002F1876493\\\u002F\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#\\\u002Fschema\\\u002Fperson\\\u002F01469ec3ac5a001eedbff1acd657e1ad\",\"name\":\"Karin Christen\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de-CH\",\"@id\":\"https:\\\u002F\\\u002Fsecure.gravatar.com\\\u002Favatar\\\u002F297220244bd2f66cda6365a85f88593f0b3b6d3bce340d84d251ce8418e97314?s=96&d=mm&r=g\",\"url\":\"https:\\\u002F\\\u002Fsecure.gravatar.com\\\u002Favatar\\\u002F297220244bd2f66cda6365a85f88593f0b3b6d3bce340d84d251ce8418e97314?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\u002F\\\u002Fsecure.gravatar.com\\\u002Favatar\\\u002F297220244bd2f66cda6365a85f88593f0b3b6d3bce340d84d251ce8418e97314?s=96&d=mm&r=g\",\"caption\":\"Karin Christen\"}}]}\u003C\u002Fscript>\n\u003C!-- \u002F Yoast SEO Premium plugin. -->","Karin Christen von required zeigt am Beispiel des Berufswahlportals Zürich, wann Headless-Architektur sinnvoll ist. Jetzt den Reality-Check lesen!","follow","index","2025-08-07T15:17:38+00:00",{"mediaItemUrl":435},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F08\u002Fheadless-cms-architektur-fb-li.jpg",{"node":437},{"id":438,"email":439,"name":440,"avatar":441},"dXNlcjo0Mg==","karin@required.ch","Karin Christen",{"url":442,"height":198,"width":198},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002F297220244bd2f66cda6365a85f88593f0b3b6d3bce340d84d251ce8418e97314?s=96&d=mm&r=g",{"nodes":444},[445],{"author":446,"content":454,"date":455,"dateGmt":455,"parentId":12,"databaseId":456,"replies":457},{"node":447},{"id":448,"email":449,"name":450,"avatar":451,"__typename":453},"Y29tbWVudF9hdXRob3I6MTk5NTE5","nl@dig-sig.ch","Schoelu",{"url":452,"height":198,"width":198},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002Ff2451506985e587995634c00bc849ad207c83eec77f3ba7ffd4877ac480c51d8?s=96&d=mm&r=g","CommentAuthor","\u003Cp>Ein sehr spannender Artikel, zweifellos interessant für ein angedachtes Projekt.\u003Cbr \u002F>\nAber bitte hört einfach mit diesem unsinnigen Gendern auf.\u003Cbr \u002F>\nEs ist nicht nur hässlich und mühsam zu lesen, es zerstört den Lesefluss, bringt absolut keinen Mehrwert und wirkt schlicht lächerlich.\u003Cbr \u002F>\nMeine Zeit ist zu wertvoll, um sie mit solchem Sprachmüll zu verschwenden.\u003C\u002Fp>\n","2025-08-19 08:26:46",199519,{"nodes":458},[459,471],{"author":460,"content":464,"date":465,"dateGmt":466,"parentId":467,"databaseId":468,"replies":469},{"node":461},{"id":193,"email":195,"name":194,"avatar":462,"__typename":463},{"url":197},"User","\u003Cp>Danke dir für das Feedback, Schoelu. Und schön, dass du den Beitrag spannend fandest.\u003C\u002Fp>\n\u003Cp>Was das Gendern betrifft: Wir leisten damit unseren Beitrag zur Gleichstellung. Für uns gehört geschlechtergerechte Sprache einfach zu einem respektvollen Miteinander dazu.\u003C\u002Fp>\n","2025-08-22 09:04:33","2025-08-22 07:04:33","Y29tbWVudDoxOTk1MTk=",199527,{"nodes":470},[],{"author":472,"content":479,"date":480,"dateGmt":480,"parentId":467,"databaseId":481,"replies":482},{"node":473},{"id":474,"email":475,"name":476,"avatar":477,"__typename":453},"Y29tbWVudF9hdXRob3I6MTk5NTIw","micha@heimat.to","Michael",{"url":478,"height":198,"width":198},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002F5a0a982cd5e25697e446bb4aa4db66789d137ca5e2036a4a1945927ae3ae78bb?s=96&d=mm&r=g","\u003Cp>Nein, genau richtig. Danke fürs Gendern. \u003C\u002Fp>\n\u003Cp>Was stört es Dich, wenn alle Geschlechter gleichermassen angesprochen werden? Also bitte weiter gendern. \u003C\u002Fp>\n","2025-08-19 10:07:44",199520,{"nodes":483},[484],{"author":485,"content":488,"date":489,"dateGmt":490,"parentId":491,"databaseId":492,"replies":493},{"node":486},{"id":193,"email":195,"name":194,"avatar":487,"__typename":463},{"url":197},"\u003Cp>Vielen Dank für deine Rückmeldung, Michael. Es freut uns sehr, dass du das genauso siehst.😊\u003Cbr \u002F>\nGeschlechtsneutrale Sprache gehört für uns einfach zu unserer Kultur dazu. Gerade in der IT-Branche gibt’s nach wie vor wenig Diversität. Und wir finden, Sichtbarkeit ist ein erster, einfacher Schritt.\u003C\u002Fp>\n","2025-08-22 09:15:40","2025-08-22 07:15:40","Y29tbWVudDoxOTk1MjA=",199528,{"nodes":494},[]]