You may have heard the words tossed around, and you've nodded along — but in reality, maybe you aren't quite sure what a headless Content Management System is. We assure you — it's nothing to lose your head over! Let's pull back the curtain to clarify some things about headless, decoupled, and hybrid Content Management Systems (CMS).
What is a Headless CMS?
First, let's get back to the basics — the traditional CMS. You're probably familiar with systems like Drupal, WordPress, Sitecore, and Kentico. These systems (and others) are traditional in that they allow developers to author and edit content to create a web page. They also include a built-in templating and storage system. In short, a traditional CMS allows for storing content, creating templates, and building a web page.
Headless Content Management Systems start the same. You can author, edit, and store content and data within the system, but the departure from a traditional CMS is in the templating. Instead of using the CMS templating system to create the page, all of that is offloaded onto a separate framework outside the CMS. This is accomplished through an Application Programming Interface (API), which allows content within the system to be accessible as data. That's a simplified version of the API concept, but all you really need to know is that rendering your web page is external to the CMS.
Why Go Headless At All?
Why bother offloading rendering to a different system if traditional Content Management Systems already have the functionality to render the content? Well, there are a few reasons.
The Latest Front-End Technologies
The line between websites and web applications is blurring due to an increase in frameworks built with application-level interactivity in mind. These frameworks are becoming the norm because they ease the development and handling of complex real-time interactions, animations, and visualizations.
These frameworks rely on APIs for grabbing data. Because of this separation between content (CMS) and presentation (frameworks), each system can focus on what they are exceptionally good at. The CMS is excellent at content authoring and storing data, and the front-end frameworks have the power of displaying this data in whatever way your designers' hearts desire. The open-ended nature of the presentation layer is what gives this concept so much strength and flexibility.
Multiple platforms, one website
Nowadays, companies have a Constituent Relationship Management software (CRM), an Association Management System (AMS), and all sorts of other platforms that house all of their different types of data. These data can be brought together through APIs that integrate with a headless CMS and framework that grabs the data from the CMS. This allows all of your data to interact seamlessly, creating a better user experience for your visitors.
One CMS, Multiple Platforms
With a headless CMS, you're now outputting data as an API. That comes with the ability to use the same data for other platforms that rely on it. For example, a website, a separate mobile application, and a smartwatch could all use the same data that you've already outputted. The options are endless!
Long-term scalability
What's excellent about separating data and presentation is that if the CMS needed to be swapped out or upgraded for any particular reason, the look and feel of your web page could remain untouched as long as the new system's API can output the same data as the previous CMS. That functionality can save a lot of time, money, and effort when the design of your existing site is working, but the CMS is outdated.
Performance and security benefits
It takes a lot more for a traditional Content Management System to render and display a page because it has to pull and parse from the database (your stored content) every time. By default, a headless CMS ecosystem has performance optimizations built-in because the data exists in an API.
Similarly, headless CMS ecosystems have security advantages. With rendering existing outside of the CMS, there is less data that could be vulnerable to exploitation.
Sound Too Good To Be True?
Of course, it can't be all rainbows and butterflies — there are some caveats when transitioning from traditional to headless. Traditional Content Management Systems have many out-of-the-box features (e.g., preview or authentication for front-end users, e-commerce functionality, etc.). When you are no longer using the CMS templating, you can no longer use any of those features out of the box. Either that functionality would need to be recreated using an API version of the implementation, or you may consider using a hybrid approach.
Hybrid Implementation
With a hybrid approach, you can output your data using an API and use that functionality (for all the benefits mentioned above) while using the traditional CMS templating for the parts of your website that would require significant overhead and resources to output as data. That flexibility allows you to pick and choose which approach works better for each piece of functionality. For example, you may opt to use the headless approach for visualizations and interactions, as opposed to a traditional CMS template for complex authentication or member functionality.
Decoupled CMS vs. Headless CMS: What's the Difference?
Perhaps you haven't heard of headless CMS but have heard of decoupled CMS. Casually, you can use the terms decoupled and headless interchangeably. The distinction is that "decoupled" is the broad term for any CMS that separates its content authoring and data from its rendering. At the same time, some folks define a purely headless CMS as not having any templating system at all. In those terms, Drupal is not a headless CMS because it has a templating system but could technically be a decoupled CMS if you were to offload the rendering to another framework.
Is a Headless CMS Right for Me?
When deciding whether you should be building headless, there isn't a hard and fast rule. Each implementation may benefit more readily from a headless or traditional CMS, depending on the needs of the site. Generally, the complexity in how you manipulate or interact with your data, in addition to how many data sources you have, are good indicators for which system is most beneficial.
Kristine Fernandez
Lead Front End Developer,
Kristine astounds. That’s because she is an encyclopedia of programming know-how. She builds some of Mighty Citizen's most sophisticated, technically challenging online products—and she does it in record time without a single error. It’s eerie, really, how talented she is. Not that she hasn’t worked hard to get here: Since the moment she typed her first HTML tag more than a decade ago, Kristine has been hooked on the idea of creating websites and online interactions.
