Headless CMS


What is a headless CMS?

A headless CMS is a content management system that separates the backend content management from the frontend, presentation layer.

The frontend, or presentation layer, is everything a user sees and interacts with, traditionally on a website, but today on any device with an internet connection. This layer includes aspects of a website like images, text, layouts, etc. Three common frontend development languages include HTML, CSS and JavaScript.

Whereas the backend is the developer's side of the website where server, application and database information is managed. Therefore, aspects of a website like rules, integrations and how pages are connected are controlled here. Common backend development languages include PHP, SQL and Java.

In a headless architecture then, the head, or frontend of the system is chopped off from the body, or the backend of the system.

Leveraging a headless Content Management System, you can power various customer-facing digital experiences including native mobile apps, smart devices or existing web applications not built directly within the platform itself.

Coupled vs. Decoupled vs. Headless

Coupled, decoupled and headless are forms of content management delivery architectures. A delivery architecture is the relationship between where your content is managed and where it is delivered. You can read more about delivery architectures here.

The most common delivery architecture is a coupled architecture in which the frontend and backend are bound together. In a coupled architecture, content is created, managed, stored and delivered in the same system.

A decoupled CMS separates the frontend and backend. The content is managed separate from the delivery. It is prepared on the backend, then delivered and presented in the frontend through APIs. A decoupled CMS enables content managers, editors and designers to work on the frontend, while developers work on the backend.

Finally, a headless architecture is a content only data source without a presentation layer. In practice, headless is really just another form of decoupled architecture, but instead of the CMS pushing artifacts to the frontend, the front-end pulls content from the CMS. 

It's important to note that not all headless CMS solutions are created equally. Some of them are pure headless while others are a mix of headless and traditional architecture. A pure headless system never does any templating and only serves raw data to another system. A hybrid headless system, on the other hand, can operate in a traditional coupled architecture, but also has tools to serve content headlessly.

How headless architecture works

A headless solution is a backend-only CMS built with a repository that can be accessed, for example, through a RESTful API for display in multiple channels.  An API is a set of rules that enables programs to talk to each other. RESTful or REST (Representational State Transfer), is a set of rules developers follow when creating the API.  APIs allow you to pull content into the presentation layer and receive commands from the users into the headless application.

A headless CMS has a database to read and write content to, and an administration interface where users manage content. A headless solution only allows for the creation, reading, updating, and deleting of content. 

In a headless architecture, developers can use any frontend tool to present, reuse, and deliver content to any channel. The separation of the frontend and backend makes it easier to update the underlying systems independently, among other benefits, which we will cover in a later section.

Developers can read more about how Optimizely's headless solution works here.

How headless came to be

Content management first emerged with the creation of static websites in the 1990s, during Web 1.0. These websites were simple HTML text files. Content management has evolved from Perl scripts and flat files to robust CMS offerings and even sophisticated DXPs.

The evolution of the headless CMS was driven by the mobile revolution, the rise of omnichannel publishing and the viability of JavaScript.

When mobile technology and devices like watches and voice-activated assistants rose, users needed the flexibility to push content wherever they needed or wanted which presented a challenge for traditional content management systems.

Additionally, when jQuery was introduced in 2007, JavaScript became a rich programming environment and the idea of actually templating a site in a browser came to be. Developers were able to pull pure data from the server and template it in the client's website.

Technology is constantly evolving and shaping the CMS landscape. Because a headless CMS enables you to integrate with other technologies and applications as they emerge, it is a very common delivery architecture offered today. 

Is headless right for me?

Today, developers often push for headless because they believe they get more flexibility from a headless solution and understand the implications of APIs, CDNs and SDKs. But is a headless solution really right for you?

Ultimately marketers and technology professionals need to decide whether a headless solution will help their organization close the gaps in their customer experience faster, cheaper and better than existing alternatives. Often the usage and necessity of headless CMS is misunderstood by buyers, but we're here to help.

Just like any decision in technology, headless architectures have benefits and drawbacks. Ultimately, you have to decide what's right for your business.

Keep in mind, there are requirements beyond headless that you'll want to consider when choosing a CMS and various personas like content editors, website administrators, developers and marketers that you'll want to enable with your CMS. Buying content technology can be a confusing process, but Optimizely's Senior Director of Content Management Strategy, Deane Barker wrote a book all about considerations you should make before investing in a CMS.

Benefits vs. Drawbacks of a headless CMS

Benefits

A headless CMS can integrate with other technology, help you reach customers on emerging touchpoints and respond to changing customer expectations. We wrote about some of the benefits of headless technology here, but here's a quick summary:

Integrate with other technology

You likely operate dozens of technologies to power various phases in the customer journey. Rather than spend hundreds of thousands of dollars to swap out these legacy systems, many companies implement a headless CMS that integrates with current and future technology. A strong headless content infrastructure will unify your content and eliminate siloes.

Reach customers on emerging touchpoints 

As smartwatches and other smart home devices expand in adoption and maturity, organizations need a CMS that can deliver content to these channels. A headless CMS can integrate to the underlying framework used by smart devices to deliver the experiences the end user expects. 

Respond to changing customer expectations 

In a headless CMS, cross-functional front-end code creates continuity in the user experience and theoretically makes organizations faster in delivering on their mission, while also making them more responsive to changing customer expectations.  

Drawbacks

Teams considering migrating to a pure headless solution often discover that while pure headless solutions help solve some problems, they also introduce some new challenges. If you are considering going with a  headless solution, you need to understand the tradeoffs and benefits of making this choice.

*Pure headless does not always equal simplicity *

It may be initially appealing and straightforward to translate your content into raw data consumed by any platform.  However, headless does not always resolve complexity, often it just moves it around. Companies often find they need more functionality than is built-in to the CMS, so they have to customize.    

Pure headless is not always faster or cheaper 

Weigh the time to value and the total cost of ownership of any system you are considering.  Adopting a pure headless CMS requires your engineering team to take on more responsibility to build out different models and templates. While this approach provides control and customizability, getting a headless system up and running can take time while engineering gathers requirements, designs the models and modules, and builds them. 

Pure headless does not always have everything you need built-in 

Pure headless systems often lack features like workflows or even drag and drop editing. Implementations fail because they don't have the built-in features. Teams often have to build the functionality that comes with a traditional CMS or hybrid headless CMS. Content creators may need to wait for engineering support if they have more custom requirements for a new landing page that isn't supported by previously created modules or templates.

Pure headless is not always functional for marketers or business users 

Since headless removes the presentation layer shipped with the application, most headless platforms do not support leading native business user tools like in-context editing or content preview before publishing.

Pure headless does not always provide the technology you need to differentiate your CX 

Today, many technologies power a company's customer experience. If you select a headless CMS, chances are it won't include key technologies that are helping companies differentiate their customer experience for today and tomorrow. Personalization, experimentation and optimization engines are key examples of technologies companies should be thinking about to future-proof their businesses and begin to differentiate.

Optimizely gives you the best of both worlds

Optimizely has traditionally been known as a coupled CMS. However, the distinction between this and a headless or decoupled CMS is much thinner than the market would have you believe. Optimizely has always been able to offer a hybrid headless solution.

Because Optimizely manages content, and not webpages, its content repository is abstracted from the content delivery. Optimizely has a continual release strategy and an API-first architecture that have kept pace with developer needs, without us resorting to complete rewrites and new products to support today's diverse audience.  

Headless CMS is often positioned as the opposite of a traditional web CMS. Optimizely rejects this idea. As a matter of fact, headless is in addition to what the Optimizely platform normally does. One discipline is simply an extension of the other. And here's why this matters: because there's a natural overlap between the two disciplines. Optimizely didn't need to build a new CMS from scratch --the core web CMS product is a natural, flexible base for an alternate delivery paradigm. 

To see an example of Optimizely's headless solution in action, check out The Student Hotel's story of digital transformation. Leveraging a headless framework, The Student Hotel has delivered a lightning fast and efficient website.

Optimizely's Deane Barker said it best in an interview with Optimizely's CMO, Kirsten Allegri Williams, "Optimizely offers a hybrid headless model. Many companies might just need a traditional, coupled CMS, especially if their dominant digital channel remains their website. But larger companies, which have many different digital presences, including mobile apps developed in different languages, have an increasing need for more diverse capabilities. That's how Optimizely sets itself apart - delivering a completely customizable CMS that can be configured around your specific needs."

Optimizely is headless when you need it to be, and a fully-featured coupled CMS when you don't. 

Discover more about headless CMS

There's a lot to unpack about headless CMS. That's why we wrote "The essential guide to Headless CMS". You can download the guide here or explore additional Optimizely resources below.

Bonus: Did you know Optimizely B2B Commerce Cloud can be ran in a headless manner? Learn more about headless commerce.