Co je headless CMS a kdy dává smysl
Headless CMS je redakční systém bez vlastní „hlavy“, tedy bez pevně spojeného vzhledu webu. Obsah se v něm spravuje stejně jako v běžném CMS, ale na web, do mobilní aplikace nebo do e-shopu se posílá přes API. O tom, jak bude obsah vypadat, rozhoduje samostatně postavený frontend. Díky tomu lze jeden obsah zobrazit na více místech a web postavit libovolnou technologií. Za tu volnost se platí vyšší náročností vývoje, a proto headless není správná volba pro každého.
V článku vysvětlíme, jak headless CMS funguje, čím se liší od tradičního CMS typu WordPress, kdy se vyplatí a kdy ne, jak to vypadá u e-shopu na Shopify a které headless CMS se nejčastěji používají.
Klíčové body
- Headless CMS odděluje správu obsahu od jeho zobrazení. Obsah se předává přes API (REST nebo GraphQL).
- Výhody: jeden obsah pro více kanálů, volnost ve volbě technologie, rychlost a bezpečnost frontendu.
- Nevýhody: vyšší náklady na vývoj, složitější náhled obsahu a víc systémů na údržbu.
- Pro běžný e-shop na Shopify stačí moderní šablona. Headless dává smysl u více kanálů, velkého obsahu nebo specifického zážitku.
Obsah článku
- Co je headless CMS
- Tradiční a headless CMS: jaký je rozdíl
- Jak headless CMS funguje
- Výhody headless CMS
- Nevýhody a rizika
- Kdy headless dává smysl a kdy ne
- Headless commerce a Shopify
- Headless CMS jako datová platforma
- Přehled headless CMS
- Headless a SEO
- Kolik stojí headless řešení
- Jak přejít na headless krok za krokem
- Časté dotazy (FAQ)
Co je headless CMS
Headless CMS je systém pro správu obsahu, který obsah jen ukládá a vydává přes API, ale sám ho nezobrazuje. Název vychází z přirovnání: „tělo“ (body) je místo, kde obsah žije a spravuje se, „hlava“ (head) je prezentační vrstva, kterou návštěvník vidí. Headless CMS má jen tělo. Hlavu si postavíte sami, a klidně několik najednou.
V tradičním CMS je obsah, šablona i výsledný web jeden celek. Redaktor napíše článek a systém ho rovnou vykreslí podle šablony. V headless CMS redaktor napíše článek, ale CMS ho vydá jako data, například nadpis, perex, text a obrázky ve formátu JSON. Webová stránka, mobilní aplikace nebo e-shop si data vyžádají a zobrazí je po svém.
CMS (content management system) znamená systém pro správu obsahu.
Tradiční a headless CMS: jaký je rozdíl
Tradiční CMS dodává obsah i vzhled v jednom, headless CMS jen obsah. Z toho plynou všechny další rozdíly.
| Tradiční CMS (např. WordPress se šablonou) | Headless CMS | |
|---|---|---|
| Obsah a vzhled | Jeden systém | Oddělené systémy |
| Kam se obsah zobrazuje | Hlavně na jeden web | Kamkoli přes API: web, aplikace, e-shop, displeje |
| Technologie frontendu | Daná systémem a šablonou | Libovolná (Next.js, Nuxt, Astro, mobilní aplikace) |
| Spuštění webu | Rychlé, hotové šablony a pluginy | Pomalejší, frontend se vyvíjí |
| Náhled obsahu před zveřejněním | V základu | Je potřeba ho dovyvinout |
| Rychlost a bezpečnost webu | Závisí na šabloně a pluginech | Obvykle vysoká, frontend je oddělený od administrace |
| Náklady | Nižší na start | Vyšší na start, nižší při více kanálech |
| Kdo web upravuje | Redaktor i vzhled, často bez vývojáře | Obsah redaktor, vzhled vývojář |
Existuje i mezistupeň: tradiční CMS používaný „headless“. WordPress má například REST API, takže ho lze použít jen jako administraci obsahu a web postavit jinou technologií.
Jak headless CMS funguje
Headless řešení má tři části: administraci obsahu, API a frontend. Postup od napsání článku po jeho zobrazení:
- Vývojář nadefinuje strukturu obsahu: například typ „článek“ s poli nadpis, perex, text, obrázek, autor a datum.
- Redaktor vyplní obsah v administraci headless CMS.
- CMS obsah vydá přes API, obvykle REST nebo GraphQL.
- Frontend si data načte a vykreslí stránku. Buď předem při sestavení webu (statické generování), nebo při každé návštěvě na serveru (server-side rendering).
- Stejná data může použít i mobilní aplikace, e-shop nebo jiný systém.
Klíčový je první krok. Headless CMS pracuje se strukturovaným obsahem, ne s „velkým textovým polem“. Dobře navržená struktura je to, co umožní používat stejný obsah na více místech.
Výhody headless CMS
Hlavní výhodou je, že obsah není svázaný s jedním webem a jednou technologií. Konkrétně:
- Jeden obsah, více kanálů. Produktové informace, články nebo FAQ se zadají jednou a zobrazí se na webu, v aplikaci i v e-shopu.
- Volnost v technologii. Frontend lze postavit moderními nástroji a vyměnit ho bez migrace obsahu.
- Rychlost. Frontend může být staticky vygenerovaný a servírovaný z CDN.
- Bezpečnost. Administrace není součástí veřejného webu, takže útočná plocha je menší.
- Škálovatelnost. Frontend a backend se škálují nezávisle.
- Více jazyků a trhů se spravuje přehledněji díky strukturovanému obsahu.
Nevýhody a rizika
Headless přináší složitost, která se u jednoduchých webů nevyplatí. Na co se připravit:
- Vyšší náklady na vývoj. Frontend se vyvíjí na míru, hotové šablony a pluginy chybí.
- Závislost na vývojáři. Změna vzhledu nebo nové pole znamená práci programátora.
- Náhled obsahu před zveřejněním je potřeba dovyvinout. Redaktoři na něj bývají zvyklí z WordPressu.
- Více systémů: CMS, frontend, hosting, případně e-shop. Každý potřebuje aktualizace a dohled.
- SEO se musí řešit vědomě: vykreslování, metadata, mapa stránek a přesměrování nejsou automaticky v ceně.
Kdy headless dává smysl a kdy ne
Headless se vyplatí, když potřebujete obsah na více místech nebo zážitek, který hotový systém neumí. Pro jednoduchý firemní web nebo menší e-shop je zbytečně drahý.
Headless dává smysl, když:
- obsah se zobrazuje ve více kanálech (web, mobilní aplikace, e-shop, kiosky),
- spravujete velké množství strukturovaného obsahu ve více jazycích,
- web potřebuje specifický zážitek, který šablony neumožní,
- máte vývojový tým nebo dlouhodobého dodavatele,
- propojujete obsah s daty z jiných systémů (produkty, sklady, rezervace).
Headless nedává smysl, když:
- máte jeden web, který se nemění častěji než párkrát ročně,
- marketing potřebuje sám stavět stránky bez vývojáře,
- rozpočet je omezený a hotové řešení vaše potřeby pokryje,
- nemáte nikoho, kdo se bude o frontend dlouhodobě starat.
Headless commerce a Shopify
Headless commerce znamená, že e-shopová platforma slouží jako backend (produkty, košík, pokladna, objednávky) a vzhled obchodu se staví samostatně. Shopify tento přístup podporuje třemi cestami:
- Hydrogen a Oxygen: Hydrogen je sada nástrojů od Shopify pro stavbu vlastního obchodu na frameworku React Router, Oxygen je hosting Shopify pro takto postavené obchody.
- Hydrogen React: komponenty a funkce Shopify pro jiné React frameworky.
- Storefront API s libovolnou technologií: obchod postavený na čemkoli, co umí volat API Shopify.
Pokladna a objednávky přitom zůstávají na Shopify, takže platby, daně a správa objednávek fungují stejně jako u běžného obchodu.
Pro většinu e-shopů ale headless potřeba není. Moderní šablony Online Store 2.0 jsou rychlé, editor umožňuje stavět stránky bez programování a aplikace z App Store fungují bez úprav. U headless obchodu řada aplikací, které vkládají prvky do šablony, nefunguje a jejich funkce je potřeba řešit jinak. Headless se vyplatí velkým značkám s vlastním vývojovým týmem, obchodům s velkým množstvím obsahu nebo projektům, kde e-shop je jen jednou částí většího digitálního produktu. Jak vybrat šablonu, popisuje článek Jak vybrat správnou Shopify šablonu. Jak měřit a zlepšit rychlost bez přechodu na headless, vysvětluje článek Rychlost e-shopu a Core Web Vitals.

Headless CMS jako datová platforma
Některé headless CMS umí víc než spravovat články. Fungují jako univerzální administrace nad databází a stávají se z nich interní systémy. Typickým příkladem je Directus. Připojí se k databázi a automaticky nad ní vytvoří REST a GraphQL API a administraci pro správu dat, s oprávněními podle rolí. Provozovat ho lze na vlastním serveru nebo v cloudu.
V praxi to znamená, že jeden systém může sloužit jako:
- CMS pro web a jeho jazykové verze,
- správa produktových dat pro e-shop na více trzích,
- interní nástroj pro evidenci klientů, zakázek, rezervací nebo schvalování,
- rozhraní nad existující databází, které propojí ERP, CRM a e-shop.
Na Directusu stavíme administrace, interní systémy a napojení na Shopify. Podrobnosti najdete na stránce Directus.
Přehled headless CMS
Headless CMS se dělí na open-source systémy, které můžete provozovat na vlastním serveru, a cloudové služby, které se platí předplatným. Nejčastěji zvažované:
| CMS | Typ | Čím vyniká |
|---|---|---|
| Directus | Open-source, vlastní server nebo cloud | Pracuje nad libovolnou SQL databází, hodí se i pro interní systémy |
| Strapi | Open-source, vlastní server nebo cloud | Rozšířený systém postavený na Node.js, velká komunita |
| Payload | Open-source | Postavený na TypeScriptu, úzce propojený s Next.js |
| Contentful | Cloudová služba | Zavedený systém pro velké firmy a více kanálů |
| Sanity | Cloudová služba | Přizpůsobitelný editor a spolupráce v reálném čase |
| Storyblok | Cloudová služba | Vizuální editor, ve kterém redaktor vidí stránku při úpravách |
| Hygraph | Cloudová služba | Postavený na GraphQL, propojování obsahu z více zdrojů |
| WordPress (headless) | Open-source | Známá administrace, obsah přes REST API |
Při výběru rozhoduje hlavně to, kdo bude obsah spravovat (pohodlí editoru), kde mají být data uložená (vlastní server, nebo cloud) a jak se cena vyvíjí s počtem uživatelů, jazyků a položek obsahu. Licenční a cenové podmínky se u řady systémů v posledních letech měnily, ověřte si je vždy před rozhodnutím.
Headless a SEO
Headless web může mít výborné SEO, ale nic z toho nedostanete automaticky. U tradičního CMS řeší metadata a mapu stránek plugin, u headless je musí naprogramovat frontend. Kontrolní seznam:
- Vykreslování na serveru nebo předem. Obsah musí být v HTML kódu stránky, ne až načtený JavaScriptem v prohlížeči. Jinak ho vyhledávače a AI roboti nemusí přečíst.
- Titulky, meta popisy a kanonické URL jako pole v CMS, která redaktor vyplní.
- Mapa stránek (sitemap) generovaná automaticky z obsahu.
- Strukturovaná data (Article, Product, FAQ) vkládaná frontendem.
- Přesměrování při změně URL a při migraci ze starého webu.
- Rychlost, která je hlavní výhodou headless, ale jen při správném nastavení obrázků a cache.
Obecný základ SEO najdete v článku SEO pro Shopify.
Kolik stojí headless řešení
Headless je dražší na start a vyplácí se při větším rozsahu nebo více kanálech. Do rozpočtu patří:
- CMS: open-source zdarma plus provoz serveru, cloudové služby předplatné podle uživatelů a objemu obsahu.
- Návrh struktury obsahu a nastavení administrace.
- Vývoj frontendu: obvykle největší položka.
- Hosting frontendu a CDN.
- Náhled obsahu, vyhledávání, formuláře a další funkce, které tradiční CMS má v základu.
- Průběžný vývoj a údržba, protože změny vzhledu dělá vývojář.
Srovnávejte celkové náklady za několik let, ne jen cenu spuštění. Headless se vyplatí tam, kde ušetří duplicitní práci s obsahem ve více kanálech nebo umožní projekt, který by v tradičním CMS nešel postavit.
Jak přejít na headless krok za krokem
Přechod na headless je projekt na několik měsíců, ne výměna šablony. Postup, který omezuje rizika:
- Ujasněte si důvod. Více kanálů, specifický zážitek, nebo rychlost? Pokud jde jen o rychlost, zkuste nejdřív optimalizaci stávajícího webu.
- Zmapujte obsah: jaké typy stránek a obsahu máte, kolik jich je a kdo je spravuje.
- Navrhněte strukturu obsahu: typy obsahu, pole, vazby a jazykové verze. Na tom stojí celý projekt.
- Vyberte CMS a technologii frontendu podle editorů, kde mají být data a kdo bude systém dlouhodobě udržovat.
- Postavte náhled obsahu hned na začátku. Redaktoři bez náhledu systém nepřijmou.
- Připravte SEO: metadata, mapu stránek, strukturovaná data a tabulku přesměrování ze starých URL.
- Převeďte obsah a zkontrolujte ho na testovací verzi.
- Spusťte a sledujte indexaci a návštěvnost v Search Console první týdny po spuštění.
U e-shopu doporučujeme přecházet po částech: například nejdřív postavit headless jen obsahovou část webu (blog, magazín, landing stránky) a obchod nechat na šabloně Shopify. Když se headless osvědčí, lze pokračovat. Riziko i náklady jsou tak výrazně menší než při přestavbě celého obchodu najednou.
Často kladené dotazy (FAQ)
Co je headless CMS?
Headless CMS je redakční systém, který obsah ukládá a vydává přes API, ale sám ho nezobrazuje. Vzhled webu, aplikace nebo e-shopu se staví samostatně a obsah si z CMS načítá. Jeden obsah tak může být zobrazený na více místech a web lze postavit libovolnou technologií.
Jaký je rozdíl mezi headless a tradičním CMS?
Tradiční CMS, například WordPress se šablonou, spravuje obsah i vzhled webu v jednom systému. Headless CMS spravuje jen obsah a vzhled řeší samostatný frontend. Tradiční CMS je rychlejší a levnější na start, headless nabízí volnost technologie a více kanálů za cenu vyšší náročnosti vývoje.
Je WordPress headless CMS?
Ve výchozí podobě ne, WordPress je tradiční CMS se šablonami. Má ale REST API, takže ho lze použít jako headless: obsah se spravuje ve WordPressu a web se postaví jinou technologií. Řada pluginů, které ovlivňují vzhled webu, pak ale nefunguje.
Potřebuje e-shop na Shopify headless?
Většina e-shopů ne. Moderní šablony Shopify jsou rychlé a dají se upravovat bez programování. Headless přes Hydrogen nebo Storefront API se vyplatí velkým značkám s vlastním vývojem, obchodům s velkým množstvím obsahu nebo projektům, kde e-shop je součástí většího digitálního produktu.
Jaký headless CMS vybrat?
Záleží na tom, kdo bude obsah spravovat, kde mají být data a jaký máte rozpočet. Open-source systémy jako Directus nebo Strapi můžete provozovat na vlastním serveru. Cloudové služby jako Contentful, Sanity nebo Storyblok se platí předplatným a nevyžadují správu serveru.
Má headless web horší SEO?
Nemá, pokud je správně postavený. Obsah musí být vykreslený na serveru nebo předem, ne až JavaScriptem v prohlížeči. Titulky, meta popisy, mapa stránek, strukturovaná data a přesměrování se musí naprogramovat, protože je nedodá žádný plugin jako u tradičního CMS.
Zvažujete headless řešení?
Posoudíme, jestli se vám headless vyplatí, nebo vám stačí úprava stávajícího webu či e-shopu. Pokud ano, postavíme administraci na Directusu a napojíme ji na Shopify i další systémy. Podívejte se na naši tvorbu aplikací nebo si domluvte konzultaci zdarma.
Zdroje
Autor: Miroslav Volovec, CEO 3NODE Software s.r.o. – specialisté na vývoj e-shopů a aplikací na platformě Shopify.