This category of websites flies under the radar for most people, often because of the foreign sounding name. The term 'headless' may conjure up a B-movie plot line but in web development, the term simply means the website doesn't have a user interface. This may sound counterintuitive but the concept makes sense the more you learn about the process.

Before diving into what a headless CMS offers, it's important to know what a CMS does so check out that explainer if you haven't already [link to CMS explainer]. 

Conceptually, this class of websites should probably be called Unbundled CMS or Content-Only CMS products. The idea behind them is two fold: 

1- These sites concentrate solely on the task of content management / distribution and,

2- They separate the back-end content of a website from the front-end presentation

Both of these ideas have grown from the new capabilities that the world of software-as-a-service (SaaS) cloud platforms have unlocked. Older, monolithic CMS products attempted to handle everything, whereas headless CMS products are laser focused on content. The features that headless CMS sites lack (search, UI, authentication) are instead served by other cloud products. This model creates a constellation of best-in-class services from a host of specialized providers.

This doesn't mean all web projects will benefit from a headless approach. Smaller sites tend to actually do better with a basic CMS, as the monolithic nature of those products better matches those use-cases. However, if the site has thousands of pages or if you anticipate a network of sites where you will want to mix and match content, headless systems are the preferred method to build today.

With this impressive technology comes some subtle drawbacks. The price point to procure this type of site is higher and the integration of multiple cloud services necessitates increased maintenance over time. The initial development also takes an experienced firm like THOR to design and develop the site. The technical aspects and in particular the interface of the site must be constructed using specific methods..

What will my Headless CMS website look like if the service doesn't offer a UI?

If you're investing in a new website for your organization, more than likely you're looking for a custom look and feel as the primary feature. That's part of the reason headless solutions make sense: no-code and traditional CMS sites force you into a templated look that advanced developers throw away immediately upon starting a site using those basic platforms. 

Another revolution in web development that has taken shape over the last five years and enables headless sites are component-based interfaces powered by React. Most traditional CMS products were designed around page-based templates that assume each content item only shows up on a single type of page. Component systems free you from that constraint and allow reusable content items to appear on one page, many pages, or even many different websites. 

This is possible because a headless CMS doesn't tie the front-end of a website to the content in the back-end. Instead, developers can access all of the website content as a data object coming from an API or GraphQL service. This is especially powerful if your organization plans to reuse content across different sites over time. 

Component-based UI, headless CMS and cloud-native tools are sometimes grouped together into a category of websites called the JAMStack. 

Some of the Headless Providers and Our Thoughts

Contentful: This firm was one of the first headless CMS providers and is still one of the best. Their product emphasizes an approach they call 'content mesh' which creates a highly modular approach to content creation that some content teams find confusing when coming from a WordPress or similar background. Their product is class leading but as you might expect, it is also one of the most expensive options. It is a good idea to demo this product before buying.

Prismic: This is another solid option for headless sites, as it offers a lot of the same features of Contentful but at a much lower price point. THOR has used this tool with great success on numerous projects. The only downside is that their dev team can be a little slow to respond to requests and their application suffers from bugs more often than Contentful.

Sanity: Sanity is one of the newest headless providers and offers a highly opinionated way to develop content. Whereas Contentful and Prismic offer a web-based backend that many editors coming from WordPress-like CMS products will find familiar, Sanity offers a desktop application that builds out a 'content lake' that necesitates customization to get right. Historically they have used a proprietary data retrieval standard called GROQ instead the industry standard GraphQL (although they now support both).

Strapi: Strapi is the open-source alternative to the three proprietary options listed above. It covers most of the same feature set although it is rough around the edges and does not offer a cloud-based hosting option (although it's coming). It is the newest of the headless providers and THOR recommends a wait and see pattern with this tool for now, but it is developing very nicely.

Price Points

When shopping for a headless CMS, you will need a content cloud service to power your CMS and a separate cloud instance for the front-end of your website. This results in multiple paid hosting accounts. Added to this will be services like authentication and search with their own set of hosting fees. This results in an approximate hosting cost of  $250-500/mo range. By comparison, a traditional CMS can be hosted on quality infrastructure for $100-200/mo.

Additionally, the cost to develop and maintain a custom UI with components is higher than a traditional CMS with page-based templates. We recommend a budget of at least $50K to start a project like this, with the assumption that there will be additional on-going maintenance costs given the network of integrations that compose the site.

How to get started

The best place to start this process is with a deep site audit. If you need guidance you can reach out to THOR for assistance in that process. Audits are valuable in revealing organizational challenges, under leveraged strengths, new strategies for optimizing the use of existing assets, and areas of new content development to support goals within the organization. This is also a time to establish support for the project since a major website redesign will likely touch every part of your organization at some level. 

If you're starting from scratch, content development is a key area to consider. Begin by profiling 3-4 sites you appreciate that are at least tangentially related to your field. You'll start to see patterns within them that indicate what you perceive as good usability. Developing an understanding of the components that create a good user experience - both functionally and aesthetically - is a great place to start.

Your friends at THOR are happy to talk through some of the options, implications and how we can help make your headless CMS site a reality.