CMS Architecture: Traditional, decoupled & headless

Content management systems. Choosing the right setup can make all the difference when it comes to reaching your customer seamlessly and easily. In this article, we define the current choices businesses have for CMS architecture (coupled, decoupled and headless), the pros and cons of each and why decoupled and headless architectures are on the rise.

Content management systems: traditional (coupled), decoupled and headless.

CMS architecture types defined — Traditional (or coupled) CMS platforms have a locked frontend and backend. Decoupled separates the back end and front end of a website into two different systems. Headless has no defined front end system. Rather, it pushes raw content to multiple devices or channels and lets them handle how the data is output.
Pros and cons of coupled vs decoupled vs headless CMS architecture — Each has its benefits and drawbacks, see our table below for the highlights.
Why are headless & decoupled solutions gaining in popularity? Simple, organizations that can reach the widest audience have the best chance of capturing market share. Decoupled and headless content management systems offer the best integration to the newest devices on the market.

There are 3 commonly-used types of technical architecture used for content management systems in ecommerce. Traditional (coupled), decoupled and headless. Each has its benefits and drawbacks. This article will briefly define each and list its pros and cons.

CMS architecture types defined

Traditional or coupled content management systems

If we are thinking about a traditional CMS architecture, the simplest way is to call it coupled. In a coupled CMS, the content, including all digital assets, is created, managed and stored on the site’s back end. The content is pushed from the database to the front end. The front end has built-in theme templates and CSS that display the content on the website.

The front and back ends are tightly connected, predefined, and fairly rigid in this setup. The database, code, HTML templates, CSS, and JavaScript files that make up the theme for the site (front and backend) are pre-set. Making changes or customizing (if possible) that setup can require a lot of developer time.

A traditional CMS is comprised of:

A database where content and digital assets are stored (back end).
A content management back end where content is created (back end).
An application where publishers and designers create and apply design schemas (back end).
A front end that displays published content on HTML pages.

Decoupled content management systems

Decoupled CMS architecture separates — or decouples — the back and front ends of a website into two different systems. One system is used to control content creation and storage. Another system, one or more, is used to ingest that data and present it to the user through some kind of interface or device like a web browser or a mobile app.

With this setup, you have two options: either use out-of-the-box templates for delivering content to the web or transmit your data to other devices via an API.

A decoupled CMS platform is comprised of:

A database where content and digital assets are stored (back end)
A content management back end where content is created (back end)
An API that connects the content management back end with the front end
A default content publishing front end

Headless content management systems

With a headless architecture, there is no defined front-end system. The back end stores the content and assets in a database, similar to how it is done in a decoupled system. But in a headless setup, the CMS doesn’t have a predefined front end with standard templates to display the data. Rather, the back end pushes the raw content to multiple devices or channels—mobile, desktop, IoT— and lets them handle how the data is output. This way, deploying or modifying one channel won’t affect the whole system.

“By centralizing and distributing content in a universal format, the system makes it possible to manage all platforms from one dashboard and to have the flexibility to personalize information for each of them. The headless approach allows brands to handle the endless number of interaction channels.” — Sam Solutions, Headless CMS IS the Future of Content Management

A headless CMS is comprised of:

A database where content and digital assets are stored (back end).
A content management back end where content is created (back end).
An API connects the content management back end to any device or channel.
The ability to connect to any publishing front end, allowing organizations to have the front-end technology of their choosing.

Pros & cons of coupled/decoupled/headless CMS architecture

	Coupled	Decoupled	Headless
Pros	Perfect for basic needs — ideal for blogs, personal sites and very basic company websites. Consolidated — everything is in one place for content, design, themes, templates and the front end. Simple setup — all components for content creation and publishing are coupled in one place, so the system is easy to set up, and a friendly user interface enables seamless usage. Clear pricing — you use one system with one account and pay for it without additional charges. No dependency on developers — the system is written in one language and can be controlled by one technical specialist, while marketers use templates for delivering content and don’t need developer assistance Entry-level friendly — low barriers to entry for developers and content creators	Speedier — faster and more flexible content delivery than traditional CMS. Future-proof — resilient in the face of changes on the user interface side. Change on the fly — rapid design iterations are possible. Less reliant on IT — fewer publisher and developer dependencies than headless. Faster-to-market — simpler deployment means getting a new architecture up and running happens quickly. Partner apps & integrations —easy third-party integrations that are less disruptive to development.	Flexibility — without built-in templates, developers and marketers are free to choose technologies for creating unique user experiences. Omnichannel experience — you can distribute content across various platforms from a single backend. Scalability — since the backend and frontend are decoupled, you can customize and upgrade your digital assets without affecting the performance of the whole system Easy redesign — making some changes doesn’t mean redesigning the whole system Time-efficient — you can quickly deliver the same content to numerous touchpoints and make changes without additional expenses
Cons	Media restrictions — content type restrictions are common (video and audio can be very hard to add to content) Website-only content — you won’t be able to seamlessly use the same content for mobile or IoT devices without APIs Limited creativity — since there is a dependency on the layout templates, you can only create a standardized presentation and user experience Complicated redesign — since the front end and back end are locked together, making changes means modifying the whole system, which is time-consuming and expensive Limited distribution channels — you can publish content for desktop, tablet, and mobile devices, but the majority of other platforms are simply out of reach.	Advanced user requirements — more complicated than a traditional CMS, content creators will need a greater understanding of the system to implement content strategies. Costs can spiral — adding 3rd-party integrations and apps adds to the base cost of your platforms and can be easily mismanaged. Technical expertise required — this system needs extra development work compared to headless, especially around building the front end.	No defined presentation layer — without out-of-the-box templates, or themes you will need additional technologies to serve as the “head.” No content previews — there’s no opportunity to easily preview content before it goes live. To overcome this, you will need to use third-party tools. Dependency on developers — marketers have no visual tools for creating page layout by themselves, so they will need to work closely with developers to be able to visualize what their content will look like on the channels it's being sent to. High costs — the implementation and maintenance are rather expensive because of the fragmented technological stack.
CMS	Squarespace, Wix	Drupal, WordPress¹	Contentful, Sitecore, Sitefinity, Episerver

¹ Drupal and WordPress can be used in a coupled architecture, but both have added options in recent years to work in decoupled and headless scenarios.

Why are headless & decoupled solutions gaining in popularity?

Growing customer expectations and the development of IoT and connected devices have resulted in an increasing demand for multichannel interactions. Brands need to be everywhere the customer is, which means having their content seen everywhere. The way to be everywhere is to publish your content on every type of smart device possible. Sadly, a traditional CMS is not powerful enough to reach that wider audience.

Decoupled and headless content management systems allow brands the flexibility to reach their intended audiences wherever they are. They deliver desired scalability and quick integrations with multiple customer-facing and internal operational platforms.

Separating your front and back ends with either a headless or decoupled cms implementation enables organizations to increase delivery times while iterating faster. And at the end of the day, he who gets his message heard/seen first wins.

Is moving to a decoupled or headless architecture right for your business?

To be completely honest, it all depends on your organization’s needs. At Acro Commerce, we have recently gone through the process of evaluating our architecture and decided that decoupled works for us. We are even in the process of decoupling our own architecture with Drupal 9 and React. You can read more about that project here.

If you are thinking that an architecture change may be part of your future plans, we are happy to talk through our own journey with you and provide some insight as to what may work best for your business. Reach out today to start the conversation.