As a marketer, I’ve happily used WordPress to build and manage websites since 2012, so the concept of a headless CMS blew my mind (pun intended).
That is, until I spoke with a developer who helped me wrap my head around headless CMS benefits and use cases (I promise I’ll stop with the puns now).
In this post, I’ll define headless CMS, an alternative to the traditional CMSs that we all know, and outline when you should use one — and when you shouldn’t.
Table of Contents
- What is a headless CMS?
- Why use a headless CMS? The Benefits
- When Not to Use a Headless CMS
- What is a decoupled CMS?
- Traditional CMS vs. Headless CMS vs. Decoupled CMS: Which Is Best for You?
- Headless CMS Examples
- Is HubSpot a headless CMS?
- Headless CMS: Is it right for your business needs?
What is a headless CMS?
A headless CMS is a content management system that handles back-end content management, detaching it from the front-end presentation layer. Unlike a traditional CMS, a headless CMS does not dictate how content is displayed to end-users.
In place of a front-end system, a headless CMS shares its stored resources via an application programming interface (API). The API is essentially a set of URLs that any software tool can use to retrieve content from inside the CMS.
In a headless CMS, an editor adds content to the back end just like they would in a traditional CMS like WordPress or Squarespace. The difference is that when it comes time to publish, a headless CMS needs an additional service to fetch the content via an API, format it, serve it, and present it on any channel, whether that's a website, mobile app, or smart TV.
For this reason, headless CMSs are called front-end agnostic systems — they don’t care how content will be displayed.
Here’s a visual breakdown of the differences between a traditional and a headless CMS architecture:
So, why the name? If we imagine the front-end display as the “head” and the content stored as the “body,” a “headless” display removes the head and leaves just the body.
A tad morbid, sure. But also very useful, as we’ll see next.
Why use a headless CMS? The Benefits
At first, the idea of a headless CMS seemed counterintuitive to me. Why remove the tools that make it easier to publish content to your website? Isn’t the whole point of a CMS to connect the back end to the front end?
But as web designer and developer Tammy Hart explained to me, a headless CMS actually gets back to the core of what a CMS was always meant to be.
“If you distill down what ‘content management system’ is, it‘s only the admin side. … The head, the place where that content gets outputted, that’s a different system,” Hart says.
By separating the back end from the front end, a headless CMS offers four major advantages:
1. Grant developers full flexibility.
A major benefit that repeatedly came up in my research is that a headless architecture gives developers the most flexibility to apply their own custom front-end solutions to raw content rather than adapting a traditional CMS to fit their needs.
Well, good for them, but what about non-developers, like marketers and writers? The good news is we’ll still manage content in a WYSIWYG editor on the admin side, just like we would in a traditional CMS.
An example of how a headless CMS can balance developer needs with content creator needs comes straight from Tammy Hart’s personal life. Her 18-year-old daughter, Chloe, is an aspiring TV producer who wrote and developed artwork for her original TV series, “Heir of Dragons.”
Chloe wanted to build a website to promote her show and build a community with her fans but didn’t know how to code. So, she tapped her mom’s developer skills to make it happen.
At first, Hart considered using WordPress but ultimately opted for a headless CMS called Strapi.
“As a developer, I decided that I would go to a headless CMS because it would provide the opportunity to just say, ‘I don't need all this bloat. I just need it to do these two things well.’ And I can make it do that,” Hart explains.
It will also allow her to create a UI that’s easy for Chloe to use.
“She doesn‘t have the capability to do everything, just the things that she needs to do,” explains Hart. “That way, she doesn’t get confused and blindsided by all these features that she doesn‘t need. So, she’ll be able to manage her own content.”
To be clear, Hart could have used WordPress to achieve that. She could’ve installed the bbPress plugin to create the forum. She even could’ve modified WordPress to work like a headless CMS by using the REST API.
Free Web Hosting with HubSpot
Host your website on a fully managed and optimized infrastructure that scales with your business.
- Fully managed hosting
- No setup required
- No storage, traffic, or usage hosting fees
- Keep your website secure
But in both situations, Hart would’ve been confined to the WordPress content model. By using a headless CMS, she can pick and choose which features of the forum she wants to keep. She can also code the front end to display the content exactly as she wants.
“That's what drove my decision to use a headless CMS over WordPress,” says Hart, “the ease of development as a front-end developer.”
2. Easily display content across multiple channels.
Today’s internet is much more than websites and web pages. Now, you can find content on mobile apps, advertisements, digital assistants, wearables like smartwatches, refrigerators, and any other device with an internet connection.
With a traditional website-oriented CMS, multichannel distribution is, at best, laborious and, at worst, impossible. But with a headless CMS, you can create content in one place, and through APIs, display it across multiple channels relatively easily.
As long as the front-end delivery system knows how to use the CMS’s API, a headless CMS can take content from the CMS and format it however necessary. Put another way, developers can attach as many “heads” (display channels) to the “body” (CMS) as they please, which can be a powerful thing.
3. Streamline the management of high volumes of content.
A headless CMS also makes it easier to manage large volumes of digital assets. Content can be created completely independent of its presentation, which helps editors keep tabs on their assets without needing to add any front-end code (e.g., HTML).
Likewise, front-end developers don’t have to worry about the specifics of the content management software. They just need to fetch the right data via the CMS API and then use other software to present it properly by channel.
Take a news organization, for example. In addition to publishing stories on its website, this organization might want to share information via a mobile app, an Amazon Alexa integration, online display ads, and digital billboards.
Instead of using a different CMS for each distribution channel and storing content in several places, the news site can store content inside one headless CMS and use external front-end software to present the content.
When Not to Use a Headless CMS
As flexible as the headless CMS is, there are cases where you probably shouldn’t use it, such as when:
1. You just need a simple website.
Launching a landing page or a portfolio site? Chances are, a traditional CMS and a drag-and-drop page builder are your best bet. They come with pre-made templates that make it very fast to launch.
If you’re not planning to display content on a mobile app, a wearable device, or a complex, dynamic website — you probably don’t need a headless CMS.
2. You lack developer resources.
If you are a non-technical person without access to a developer, do not use a headless CMS. I consider myself proficient in CMSs, having used WordPress, Wix, and Squarespace, but when I attempted to test out Strapi for this article, I couldn’t even get started.
Why? To use a headless CMS, you have to first set it up, which involves knowing things like how to install Node.js and Python on your computer. The documentation was gibberish to me, so I never even got to see the headless CMS.
If you want to use a headless CMS, a developer needs to set it up and manage the front end while you manage the content through the CMS on the back end.
If you don’t have access to an engineering team, stick with a traditional CMS like Squarespace or WordPress.
3. You want something low-maintenance.
Beyond the initial setup, if you want to modify your headless CMS in the future you will, again, need a developer to code this. If you are a developer or have access to an engineering team at your organization, then great!
If that’s not the case for you, however, then realize that using a headless CMS might require more developer resources than you have available.
What is a decoupled CMS?
Headless and traditional content management systems are often compared to another architecture, the decoupled CMS.
A decoupled CMS is similar to a headless CMS in that it separates, or decouples, the back end from the front end and makes content available via an API. However, a decoupled CMS also comes with some tools for front-end presentation, such as code templates.
The decoupled CMS approach makes it possible to build basic front-end displays (like a website) with your content, but it also makes content accessible for other channels.
So, a decoupled CMS is somewhat of a compromise between a traditional and a headless CMS, a balance between website-oriented and front-end agnostic.
Traditional CMS vs. Headless CMS vs. Decoupled CMS: Which Is Best for You?
|
Traditional CMS |
Headless CMS |
Decoupled CMS |
|
|
Digital channel type |
Website (blog, personal website, portfolio, etc.) |
Multiple channels, like websites, mobile apps, smartwatches, etc. |
Multiple channels, like websites, mobile apps, smartwatches, etc. |
|
Business size |
Solo or small business |
Large organizations |
SMBs or large organizations |
|
Requires developer resources? |
No |
Yes |
Yes |
|
Setup time |
Low |
High |
Medium |
|
Maintenance needed |
Low |
High |
Medium |
Each of the CMS approaches I’ve discussed serves a different purpose, and no one approach is perfect across all business types. Your CMS of choice will depend on your technical experience and resources, content strategy, budget, and timeline.
Free Web Hosting with HubSpot
Host your website on a fully managed and optimized infrastructure that scales with your business.
- Fully managed hosting
- No setup required
- No storage, traffic, or usage hosting fees
- Keep your website secure
To point you in the right direction, here’s a quick rundown to determine which CMS type you should try:
Use a traditional CMS if:
- You want a business website, a blog, or a personal website or portfolio, and you need it launched as soon as possible.
- You want to easily and quickly be able to modify your website content.
- You‘re in charge of a website but not adept at coding, and you don’t have a developer team to back you up.
- Your content is limited to mainly text, images, and embeds.
Consider a headless CMS if:
- You’re part of a larger company with many assets that need to be handled from one place and distributed across several channels.
- You need a highly flexible tool to translate your raw content into many displays.
- You have enough time to find or build the right publishing tools to complete your tech stack.
- You have a developer team that can connect the headless API with publishing tools.
Consider a decoupled CMS if:
- You want a compromise between traditional and headless: a flexible API for accessing your content from any client, plus some front-end tools to help developers and non-developers present this content.
- You have the time and developer resources to manage your front end and make the most out of your API setup.
Still confused? Let’s look at some headless CMS examples below to help you understand the concept and decide if it’s the right CMS type for your business.
Headless CMS Examples
Here are some examples of headless CMS options:
1. Contentful
Contentful is a cloud-based headless CMS aimed at enterprises and is regarded as one of the best SaaS CMSs on the market.
2. ButterCMS
ButterCMS is both a headless CMS and a blog engine targeted at ecommerce sites, agencies, software teams, and blogs.
3. Strapi
Strapi is a leading self-hosted, open-source headless CMS — seriously, the whole thing is available on GitHub.
Is HubSpot a headless CMS?
Strictly speaking, no, HubSpot is not a headless CMS. But it can be used as such thanks to our APIs.
Why would an organization choose to do that? One use case is when they’ve built some pages in HubSpot that they want to display in a different area of their site that’s not hosted on HubSpot.
As Dave Ward, CEO of HubSpot partner agency Meticulosity, explains:
"For enterprise organizations that have a lot of multiple systems — maybe legacy stuff and ERPs, really complex requirements—those are the people who need to use headless in order to accomplish lots of different goals.”
Watch the full video below:
"The benefits of HubSpot as a headless CMS, or just as a headless marketing and sales platform, is that you can get it to play nice with all of your other systems now. You don't have to have it as an island,” says Ward.
“That really allows you to have your team be able to use the next generation or best practice marketing platform and automation platform and work within all of their awesome tools but at the same time being able to meet all the other needs that you have."
HubSpot’s CMS, Content Hub, is designed for inexperienced and experienced individuals alike who need to create and manage content. It offers a website-building tool with drag-and-drop design elements so that you can craft pages quickly without coding.
The software has a comprehensive set of marketing tools, A/B testing, personalization, analytics, and more. It integrates with its popular suite of marketing tools, including a CRM, email autoresponders, and social media management.
If you’re looking for a solution that both your marketing and engineering teams will love, HubSpot creates a single source of truth for all your customer data and gives developers control over content presentation via the APIs.
Pricing is free for basic users, then starts at $15 per month per seat for the Starter plan.
Headless CMS: Is it right for your business needs?
After speaking with software engineers, I gained a new appreciation for the headless CMS. It gives developers the freedom to code solutions as they please, while marketers like me still get the familiar WYSIWYG editor on the back end.
A headless CMS also caters to brands with a multichannel approach, where content might appear not just on their website but on apps, wearables, and virtually any other technology that exists or will exist.
For solo entrepreneurs and small businesses, a traditional CMS with a drag-and-drop website builder lowers the barrier to entry, making it easy to build and maintain simple websites.
But for larger organizations with engineering teams, the leap to a headless CMS expands the possibilities of their content distribution. Plus, they’ve got the resources to maintain it.
So, if you feel limited by a traditional CMS, consider a headless CMS or a decoupled CMS. While it’s more work to set up and coordinate, you’ll ultimately have greater control over where your content ends up and how it looks when it gets there.
Editor's note: This post was originally published in January 2021 and has been updated for comprehensiveness.
Free Web Hosting with HubSpot
Host your website on a fully managed and optimized infrastructure that scales with your business.
- Fully managed hosting
- No setup required
- No storage, traffic, or usage hosting fees
- Keep your website secure
