DEV Community

Cover image for Headless CMS: The Ultimate Guide
Core dna
Core dna

Posted on • Originally published at coredna.com

Headless CMS: The Ultimate Guide

The headless Content management (CMS) space has gained traction in recent years, leading to the renewed excitement around a content management model that can help brands handle the relentless number of emerging devices and channels.

Old debates about the relevance of headless content management have reignited, leading to the invention of new acronyms and spin-off buzzwords that attempt to explain the storm in the CMS-teacup.

But with new jargon, comes new levels of confusion. So, let me break it all down for you.

Define a headless CMS?
If a traditional CMS was a body, the “head” would be the front-end components like the front-end framework and templating system. If you chop that head off, and you’re left with a headless CMS.

A headless platform has no default front-end system to determine how the content is presented to the end-user. Instead, a headless CMS is front-end agnostic, meaning that your content is raw and can be published anywhere, through any framework.

By getting rid of the front-end delivery layer, your CMS is suddenly a content-only data source. It produces content and then sits there. Waiting.

What’s it waiting for? Well, because there is no default “head”, front-end developers are free to build as many heads as they like, for however many channels they want to serve content to (think websites, apps, kiosks, billboards, smartwatches, etc). To retrieve the content for each channel, the headless CMS responds to API calls.

Okay, so what is a decoupled CMS?
I consider headless content management to be a sub-set of decoupled content management. That’s because a decoupled CMS is headless, and then some.

With a decoupled CMS – also known as a hybrid headless CMS - your content is managed separately and is front-end agnostic, just like a headless CMS. Yet, it has front-end delivery tools in the box, like templates, if you want to use them.

The difference is that the back-end and front-end are not “coupled” to each other through a database like with a traditional CMS. Instead, the front-end and back-end communicate to each other through calls to an API.

Image description

So, remember when we chopped the “head” off a traditional CMS to make it headless? Well, imagine the same scenario here, except this time, we kept the head. It’s not attached to the main body as with a traditional CMS — but you aren’t totally left to your own devices when it comes to front-end delivery, like with a headless CMS, either.

It’s the best of both worlds, you might say.

Headless CMS vs decoupled CMS: What’s the difference?
Let’s dig a little deeper into what makes these two models so different.

With a headless CMS, you have modelling and editorial tools to create and edit content. But the concept of “publishing” content just means making it available via an API. It assumes that you and your nerdy front-end development team can handle the rest with whichever frameworks and tools you prefer.

A decoupled CMS, on the other hand, doesn’t assume anything. It does everything a headless CMS does, but it doesn’t stop there. It also says, “Hey, we’ve got some templating tools here so you aren’t working from scratch.”

That’s just good manners, right?

Blend Interactive CSO, Deane Barker, summed up the difference between decoupled and headless content management quite succinctly:

“A decoupled CMS is proactive — it prepares content for presentation and pushes it into a delivery environment. A headless CMS is reactive — it manages content, then just sits and waits for some process to ask for it.”

Image description

For marketers, this subtle difference can be a significant one. While the decoupled CMS uses the templates, WYSIWYG editing, and other tools are customarily seen with traditional CMS systems, many of those tools are not available in a headless CMS architecture. However, purely headless systems allow more control over how the content appears on each type of device. So, more fun for eager front-end developers, less fun for non-tech savvy marketers.

Want to learn more about headless CMS? In our official blog we also cover:

  • Decoupled vs headless content management: Pros and cons
  • Why headless and why now?
  • Choosing a headless CMS: How to wade through the jargon
  • What is content-as-a-service?
  • Does a headless CMS help with omnichannel marketing?
  • Open-source headless CMS platforms
  • Strapi
  • Cockpit
  • Directus
  • SaaS headless CMS platforms
  • Core dna
  • Contentful
  • Kentico Cloud
  • Can a traditional CMS be used with headless CMS?
  • Is a headless CMS secure?
  • Headless CMS examples: 3 companies using a headless or decoupled CMS
  • Princess Cruises
  • The Economist
  • V-Zug
  • Real-world headless CMS use cases
  • Downtown D.C. improves tourist experience with digital signage
  • Burger King rolls out digital menu boards to 6,500+ stores
  • The American Heart Association provides life-saving information via Amazon Echo
  • IKEA launches an augmented reality catalog mobile app

Click here to visit our free blog

Top comments (0)