The Mythical Headless CMS: What Is It and Why/When Should You Consider It?

With every passing year, there is an explosion of new devices to consume content and information on. Updated versions of cell phones, tablets, phablets, smart watches, kiosks, new devices in the IoT (Internet of Things) bandwagon – the list is seemingly endless. So, it’s no surprise that many organizations are exploring headless CMS implementation options for their next digital initiative.

What Are Headless CMSs All About

The content from a headless CMS implementation is delivered through an API, allowing you to use your preferred programming languages and tools to build out the user interface. Most headless CMSs are new, and cloud-native as a result, offering up their CMS as a service. This makes it easier to start working with them as they don’t require installation.

The focus on serving purely as a back-end content repository without any management of the front-end presentation layer also enables headless CMSs to be more agile and take advantage of the latest front-end technologies, like React or Gatsby. These frameworks are more flexible, making them better suited for implementing complex designs and they also offer increased speed and performance over older tools.

All these benefits make it possible to distribute content to multiple devices more easily, which means your marketing teams have more bandwidth and creative brain power to expend on producing and delivering impactful digital experiences to your customers.

However, there are certain scenarios where a headless CMS is not the best option. For large, multinational websites, for example, a headless CMS would likely not offer the necessary functionality to meet the complex business and technical requirements involved with these solutions. Instead, a traditional CMS would better fit the needs of globally distributed marketing and content teams who typically make content updates and changes frequently.

For the cases we discussed above, however, headless CMSs have a lot to offer. Below, we'll dive further into these benefits and look at two examples of these implementations in action.

Benefits of a Headless CMS

Faster Time to Market  

Headless implementations make it possible to separate technology projects (product issues or upgrades) from those that are more focused on design updates. For example, with a headless setup, you can upgrade to the latest release of a platform such as Drupal without affecting the presentation layer. This gives you more operational control over your solution – you have the flexibility to complete your projects independently and more quickly and also, spread out your expenditures over time.   

Additionally, development work can go faster because the designs aren’t tied to existing CMS-specific frameworks. When you don’t have to retrofit your design to match the back-end you can create your design without having to go back and forth with the development team, ultimately making it easier to get your design to market faster.

However, the lack of CMS-specific frameworks means that you won't have the server-side code necessary to handle certain tasks and will need to rely on third-party integrations for these. Depending on the complexity of your project, having to coordinate these integrations may end up taking longer to roll out. This makes it critical to determine whether a headless CMS implementation will, in fact, be the most suitable option based on the specific requirements of your project.

Prioritize Customer Needs Through a Design-First Philosophy  

Often, traditional CMSs necessitate the use of a technology-first approach where you alter your design to fit the constraints and behaviors of the CMS. In these scenarios, compromising on your designs ensures that your solution is more robust and doesn’t require lots of custom code that is difficult and expensive to maintain over the long run.

Headless CMSs, on the other hand, allow you to follow a design-first approach as your front-end and back-end teams are able to work independently of each other. By adopting a design-first philosophy, you can make sure that you stay focused on the needs of your customers and build a solution that is truly customer-centric.

Develop Content Easily for Multiple Devices   

Part of prioritizing customer needs and continuing to provide value to your audiences includes serving up content when and where they want to receive it. As we noted earlier, this increasingly means being able to distribute content to a list of ever-evolving devices.

When your content is decoupled from the CMS, you can design and develop for multiple devices using the same content source. While many traditional CMSs support the ability to author content once and push it to different channels, they face growing tension between this functionality and their in-page (or in-experience) editing capabilities. They also have to balance their focus and investment among all the other features that they provide – workflow, governance, user management, etc.

In contrast, most headless CMSs that are new to the market are laser-focused on one thing – content infrastructure. This means that for the appropriate projects, they provide you with a quick and easy avenue to model your content and house it in a central repository that can then be accessed for multiple purposes and applications.

Theory in Action: Case Studies of Headless CMS Implementations

Using Contentful for a Product Launch Campaign 

One of our clients wanted to roll out a marketing campaign for the U.S. launch of their product. Since a fast time to market was the primary business goal, we used a headless CMS for the solution and were able to deliver a functional website within a month. A traditional CMS build would likely have taken longer and cost more, given the effort and resources involved with those projects.  

Contentful was the headless CMS that was selected to house the content for this project. Since our client pays for this product, they didn’t have to invest in the infrastructure to host their own solution. This also helped to reduce complexity by avoiding the need to deal with server management and back-end development.

Given the lack of server-side code, we had to get creative with 3^rd-party integrations to fulfill all the requirements of this effort. For example, the campaign site had a contact form with the standard input fields for contact details and a message. Without a traditional CMS, there was no endpoint to submit the information that was collected through this form.

Fortunately, there are many applications and tools that are available to support this type of serverless architecture and a variety of them also integrate with other products that are common in the digital marketing technology stack – CRMs, email marketing tools, shopping carts, etc. The solution we built ended up being highly cost-effective for our client as it utilized services that integrated with the technologies they already used - Salesforce to provide the form functionality and Shopify for e-commerce.

Supporting Unique Front-End Interactions for The MET Lauder Project 

The renowned Metropolitan Museum of Art in New York has been leading the charge to make art universally accessible by bringing it online. In one of its most recent endeavors to push the envelope with digital, the Leonard A. Lauder Research Center for Modern Art at The MET Museum wanted to make the 100+-year old, original Kramar Notebook available for free through its website. The goal was to create a digital facsimile, which would include a side-by-side transcription of the illustrious original notebook to augment the handwritten notes, as well as an English translation of the Czech notebook.  

Given the uniqueness of this project and the type of interactions with the content that the MET wanted people to have, we determined that the solution would be best served by a headless implementation. This would make it much easier for our front-end developer to build an app around the content without adhering to the constraints of a specific back-end platform. 

Using a headless CMS allowed us to collaborate closely with a designer to quickly produce working prototypes. This enabled us, in turn, to have The MET team test features out sooner and request functionality updates earlier in the process, making for a highly efficient project all around.

In terms of the technical details, the project is a great example of how an enterprise CMS can be utilized for a headless implementation. The MET used Sitecore for data entry and outputted JSON for us to use in the app that we built. This app was created using Gatsby, a static site framework based on React.

We set up a build task to automatically generate new pages that were based on the project template. This build task only runs when it detects content changes, so the database is out of the picture until the solution needs to rebuild. From a performance perspective, this makes the page very fast because the browser doesn’t need to wait on the back end.  

Determining When to Use a Headless CMS Implementation

As you can see, headless CMS implementations offer a variety of benefits when applied to the right types of projects. These solutions can empower your marketing teams to be nimble and get campaigns out to market faster. They can also help you prioritize your customers’ needs and stay relevant by making it easier to distribute content to multiple devices.

Assessing whether a headless implementation is the right choice for your project is a crucial step towards ensuring a successful outcome. If you’re exploring the idea of using a headless CMS implementation for your next digital initiative and would like some guidance with making that decision, we’d be happy to share our insights and answer your questions. Send us a note via email or join the discussion by commenting below.