Headless CMS: vad det är och när det lönar sig för ett företag

Ett headless CMS är ett system där du skriver och lagrar innehåll, men som inte själv bestämmer hur innehållet ser ut på sajten. Texterna, bilderna och sidorna ligger i CMS:et. Själva webbplatsen hämtar dem via ett API och visar dem med sin egen kod.

"Head" är presentationen, alltså det besökaren ser. I ett vanligt CMS som WordPress sitter innehåll och presentation ihop i samma system. I ett headless CMS är huvudet borttaget, och utvecklaren bygger ett eget.

Så skiljer det sig från WordPress#

I ett klassiskt WordPress väljer du ett tema. Temat styr layouten, och plugins lägger till funktioner som formulär, bokning eller SEO-fält. När en besökare öppnar en sida bygger WordPress sidan i samma stund, ur databasen, temat och de plugins som är aktiva.

I en headless-lösning är det två separata delar:

• CMS:et, till exempel Sanity, Contentful eller Strapi. Här redigerar du innehållet i ett gränssnitt som påminner om WordPress-admin.
• Webbplatsen, ofta byggd i ett ramverk som Next.js. Den hämtar innehållet och genererar färdiga HTML-sidor.

Det går också att köra WordPress som headless. Då används bara adminläget för att skriva, och en separat frontend visar innehållet. Det kallas headless WordPress.

Fördelarna, konkret#

Snabbare sidor

När sidorna genereras i förväg och levereras som färdig HTML från ett CDN behöver servern inte bygga dem för varje besök. Det märks mest på mobil och på sajter med mycket trafik.

Färre saker som kan gå sönder

En vanlig WordPress-sajt har ofta en lång rad plugins som ska uppdateras och kan krocka med varandra. I en headless-lösning skrivs funktionerna i koden i stället. Det finns ingen pluginlista att hålla efter, och den publika sajten har ingen inloggning som går att attackera.

Samma innehåll på flera ställen

Eftersom innehållet hämtas via ett API kan samma text användas på webbplatsen, i en app och i ett nyhetsbrev. För de flesta mindre företag är det en bisak, men för den som har flera kanaler sparar det dubbelarbete.

Bättre förutsättningar för SEO

Google behöver kunna läsa sidans innehåll direkt i HTML:en. Med serverrenderade sidor i Next.js finns rubriker, text och länkar i koden från början, utan att Google först måste köra JavaScript. Det tar bort en vanlig källa till problem med indexeringen. Läs mer i vår guide om teknisk SEO.

Behöver ni en ny hemsida? Läs om Webbutveckling →

Nackdelarna#

Headless passar inte alla, och det har en kostnad:

• Det krävs en utvecklare. Det finns inga färdiga teman att klicka ihop. Någon måste bygga frontend, och nya funktioner kräver kod i stället för ett plugin.
• Förhandsvisningen måste byggas. I WordPress ser du direkt hur sidan blir. I ett headless CMS måste förhandsvisning sättas upp som en egen funktion.
• Två system i stället för ett. CMS:et och webbplatsen har var sin drift och var sina uppdateringar.

När lönar det sig för ett företag?#

Headless är värt det när minst ett av följande stämmer:

• Sajten ska ranka i Google och laddtiden spelar roll, till exempel för en lokal tjänsteverksamhet som konkurrerar om samma sökningar som grannföretaget.
• Ni vill slippa plugins och den löpande uppdateringen av dem.
• Sajten ska kopplas mot andra system, som bokning, CRM eller betalning.
• Ni vill kunna byta design senare utan att flytta allt innehåll.

En enkel visitkortssajt på fem sidor, som sällan ändras och inte behöver ranka på något, klarar sig ofta bra med ett vanligt CMS eller en sajtbyggare.

Vilket headless CMS ska man välja?#

De vanligaste alternativen skiljer sig mest i hur de drivs:

• Sanity är molnbaserat, har ett anpassningsbart redigeringsgränssnitt och en gratisnivå som räcker för många mindre sajter.
• Contentful är vanligt i större organisationer med många redaktörer och flera kanaler.
• Strapi är öppen källkod och kan köras på egen server, vilket ger kontroll men också mer drift.
• Storyblok har en visuell redigerare där du ser sidan medan du skriver.

Valet av CMS spelar oftast mindre roll än innehållsmodellen, alltså vilka fält och sidtyper som finns. Den ska byggas efter hur ni faktiskt arbetar.

Så gör vi på Solva#

Vi bygger våra sajter i Next.js med innehållet i Sanity. Sidorna renderas på servern, och kunden redigerar texter och bilder själv i Sanity utan att behöva kontakta oss för att byta en rubrik. Vill du veta hur ett sådant bygge går till, läs om vår webbutveckling eller se resultatet i våra kundcase.