Headless CMS

Traditionalvs.Headless CMS

by Arso and Ilona
15 min
23. Nov 2021.

To transition or not to transition, that is the question.

Should you continue with an all-too-familiar traditional CMS, or should you bid on flexibility, top speed, and Headless CMS versatility offers?

The future of CMS is quickly moving away from traditional, database-driven systems and toward API-driven headless or decoupled systems. The headless content management system architecture is rising in popularity in the development world. So, while still using traditional systems, you might feel you’re missing something. You’ve heard about the main headless CMS features: it’s faster, it’s secure, it delivers headless content via API. But, do you really know is it worth a try? Read this blog post and find the answer to that exact question. Here you can find what are the 5 most popular Headless CMS features over a traditional CMS. So, what have we done in this article? We’ve picked six famous traditional CMSs and compared their main aspects (like the ease of development, price, functionality, and purpose) to the headless, in detail.

No one ever did something similar.

All six CMSs are on this list because of their popularity and the types of projects they are used for. Let’s introduce them. 👇

The first one is, of course, WordPress. Believe it or not, WordPress runs around 40% of all websites in the world. Yup, fresh news. They indeed continued to dominate the CMS market; we have to give them that credit. Joomla is the second most known content management system and our second choice. It has significantly less audience than WordPress - it powers around 3% of all the websites on the Internet. Drupal follows it. Despite being used by fewer websites than the first two, Drupal is still more trendy than Magento, Blogger, Shopify, or Squarespace. At present, it’s being used by 2.3% of all websites (while having a worldwide market share of 4.6%). The following important character in our little story today is Magento. The eCommerce platform is the 9th most favored CMS globally (0.8% of all known websites). More accurately, the second most attractive platform in 2020, with an overall eCommerce market share of 12% globally.  The last two CMSs we’re going to talk about are Umbraco and Episerver. Umbraco is the 11th most known in the Top 1 Million sites in the Open-Source category, and Episerver is the leading commercially licensed CMS in the Nordics (used by less than 0.1% of all the websites).  Now, most of you know that WordPress is used for any type of website. It started as a simple blogging platform, but today it’s without limit. Websites of all shapes and sizes can be made in Joomla, too. Personal or business websites, e-commerce, portfolio, Q&A, profit or non-profit, newspapers and publications - you name it and, these two CMSs can endure it. On the other hand, Drupal is often the best choice for complex, content-heavy, and high-traffic websites and those with large resource libraries and databases. Companies most often use Umbraco with 10-50 employees and 1M-10M dollars in revenue. As mentioned, Magento is an e-commerce program, as well as Episerver.

But what about headless?

Headless is quite different from these six. Of course, it allows businesses to manage, store, and track content projects from creation to publication, just as a conventional CMS does. The main difference is the fronted-end delivery layer which is removed from CMS. Therefore, developers use any front-end framework they want to present the content. Because of that, headless CMS doesn’t have limits in creating only certain types of websites. It also goes a step further. It can deliver content beyond websites, putting it on smartwatches, VR devices, and more.

Get familiar with headless concepts. Read what headless CMS is and why you should use it. Our first comparison of traditional and headless CMS will concern the simplicity/complexity of development.

Traditional vs. Headless CMS - Ease of development

For a developer, familiarity equals ease, and thus, "easy" is subjective. Most conventional CMSs aren't complicated for developers; they need some time to get used to them. Non-tech audiences, on the other hand, might have some problems. People usually find WordPress easy. It's quick, flexible, making it possible to build almost any kind of website imaginable. Most of the folks use WordPress without any prior knowledge of designing websites. It's likely because of the templates. You can choose from thousands of free website themes and customize them. Mostly they come with their own options panel allowing you to change colors, upload logos, change the background, create beautiful sliders, and partly customize it to your needs without writing any code at all. Joomla is pretty much similar. Its straightforward design, user-friendly features, and UX improvements enable non-tech savvy users to set it up just as easily as how they would do it with WordPress. It takes only three steps to install it and can finish the whole initial process in under 1 minute. Being non-tech and beginner-tech friendly, we must agree that both tools ARE easy (for everybody). Others are not that 'friendly.' For example, Umbraco is a powerful content management system designed for developers with a fully-featured environment for data management. It requires knowledge for managing through a dated and not very intuitive interface. There are not as many plugins as WordPress, so many features require a developer implementation. If you're a business owner considering Umbraco, we fear it won't be a painless digital experience for you. Drupal is even more challenging. It offers some themes, but most of the final websites in Drupal are custom-coded or at least highly customized. That usually means the developer had to roll up their sleeves and make something that looked good. Other than that, the Drupal interface is incomprehensible for most casual users (and many developers, too!). We can't say it's hard to use, but it can be hard to learn how to use it. Some essential advice for people with limited knowledge of website development would be to find some other CMS alternatives (like WordPress) because it's easier to understand. E-commerce websites require a developer's work by default. For instance, Magento is justifiably a complete solution for building e-commerce websites. Several features that help to enhance this functionality are Magento debugger, EcomDev PHP unit, easy template path hints, multistore search fields, and more. All of them can be easily extended or customized (especially in enterprise packages) but requires an expert's work. Working in Episerver CMS consists of defining the graphical layout of the site and creating templates for the presentation of various types of content. Episerver is conveniently installed through Visual Studio and the Episerver Visual Studio Extension, providing everything you need to get a website up and running and get started developing. Its personalization capabilities are AI-driven which means it uses algorithms and predictive analytics to eliminate guesswork and dynamically present the most relevant content or experience for each visitor. That's why someone needs to know how to handle it. Comparing these six CMSs, it's understandable why most clients have used or at least heard of WordPress in the past. Or Shopify (not mentioned in our text), which is a WordPress alternative for eCommerce. They are the simplest. So, offering your clients new technology they are unaware of can be tricky. The most important part is to describe the limits conventional CMSs have. Secondly, elaborate on the difference in development and how headless can save time/money. The difference between headless and traditional lies in setup. With older CMSs, the website is built "on top" of the CMS, meaning you will need to learn and (re)build your website based on CMS rules and processes. Headless enables you to add CMS functionality where you need it in your existing tech stack. That means developers don't need to learn all those limited rules and processes, but they can work in a familiar tool. CMS is integrated rather than the foundation. However, conventional CMSs look simple for ordinary users, authors, or content creators; they can be complex for a developer. Content, CMS code, and website code coexist and intertwine, creating interdependence and complexity. In headless, content exists separately, enabling developers to do work without the final content being ready. The ability to architect and manage your content without worrying about its delivery is a massive bonus with headless content management. As is omnichannel experience conventional CMSs cannot offer. They failed to keep pace. Because CMS organizes content in webpage-oriented frameworks, they made it impossible for the same content to adapt to other digital platforms.

So to summarise headless CMS:

  • Developers can continue to build websites or mobile applications using any programming language with their favorite tools, frameworks, and own development processes.

  • Developers and editors can work better together. Editors no longer have to rely heavily on developers to build pages with a custom layout; developers don’t have to wait for finished content. It’s an agile way of working, which for projects can mean being finished a lot faster!

  • Using a familiar stack, tool, or language and creating an omnichannel experience all at once result in fewer hours of development time and, therefore, less cost.

Because of all those reasons, headless CMS can be significantly easier for front-end developers.

Traditional vs. Headless CMS - Security

Every year, thousands of WordPress sites get hacked.

The more attractive the CMS, the more vulnerable it will be to attacks. That puts CMSs from our article on top of the list. Maybe you know the story when a member of the Joomla Resources Directory (JRD) team left a full backup of the JRD site (resources.joomla.org) on an Amazon Web Services S3 bucket owned by their own company. Data that could have been exposed if someone found and downloaded the backup includes details such as Full Name, address, phone number, password, and more. Each of the six CMSs from our list is vulnerable to attacks, and the reason lies in their open-source frameworks. Such shared development environments offer several benefits, but they also have their share of flaws, many of which arise from a lack of accountability. Meanwhile, open-source headless options reduce vulnerability and make the entire stack more secure. Secondly, various plugins and themes are also exposed to attacks. There are several ways users can protect their websites. They should:

  • regularly update their CMS, and all installed plugins and themes

  • regularly back up the CMS

  • use strong password

  • use security plugins

All these tasks require time, care, and money. If you want to know more about headless CMS security, check it here: Is headless CMS a secure CMS.

Unlike a coupled CMS, which consists of backend storage and front-end presentation layer tightly coupled together, a headless decoupled CMS consists of a backend layer and connects to different front ends using APIs, thus removing the “head.” This detail improves security considerably.

Often the API used to provide content via decoupled CMS is read-only, providing a level of security that might be unavailable with a conventional CMS. What’s more, that can place API behind one or more layers of code — perhaps an application layer and a security layer — making it even less vulnerable to attack. Another standard method of hacking, through SQL injection, headless combats by running on a server without SQL or even without being connected to SQL. When a developer truly creates a unique CMS from scratch, like a headless CMS, nothing about your CMS is a known entity. As you might assume, security should be the top priority as long as CMS is concerned. And headless is trying to respect it.

Traditional vs. Headless CMS - Pricing comparison

The cost of building and hosting a website via conventional CMSs can vary from $100 to $200.000. How is that remarkable difference possible? The cost depends on so many things. What type of website do you build? How many pages will it have? Which hosting do you want? Any specific features? And so forth…

It’s like building a house. The cost of a 100m2 home will differ from one with three bedrooms, two bathrooms, security cameras, and a pool. Volume, materials, unique features - it all affects the price. That’s why you’ll always find various CMS and hosting offers. So, how much do they cost, and what does that mean compared to headless?

You can get some super simple websites in WordPress from $100 to $500. Of course, you get basic security, plugins, and a limited visual web appearance with free WordPress themes and possibilities. For more advanced features, the price goes up. It’s essential to be clear about what type of website you are building and what you need. Fully customized websites and developers’ work can cost as high as $30,000 or more. Joomla works the same way but is a bit cheaper - going from $700 to $6500. Prices can be higher with some special premium features included. Umbraco is totally different from the first two. It’s not that beginner-friendly, and non-technical business owners require assistance to set up even a basic website. In addition, it doesn’t have built-in plugins and extensions you can simply use, making it too expensive and time-consuming. Umbraco starts at $5000 per year. Drupal, too, requires a large amount of custom development, various content types, and complicated workflows. With a set of clearly defined design criteria, features and capabilities, it can reach upwards of $100,000. Of course, it all depends on the website type and the region you’re working in. It’s well-known that USA and Western Europe developers cost more than those in Eastern Europe or Asia. Also, business websites or portfolios cost less than mobile apps and, finally, eCommerce stores. Speaking of eCommerce, Magneto is a tool for precisely that. Since online stores are complicated with many details that need to be taken off, they are the most expensive to build. The optimal budget for a basic website based on Magento lies within the $22,000-50,000 range. However, the price can be both lower and way more expensive. As mentioned, it usually depends on hosting options, level of customization, in-house/custom development, design, and extensions. Episerver is the only CMS that on their website doesn’t have any packages. They form their pricing depending on the scale of the project and customer requirements, and one can expect to invest even $100k per year. Unlike other vendors, this annual subscription cost includes everything required to run a full-scale commerce dashboard.

Now, the scope of the project and developer hourly rate has a significant impact on the final prices mentioned above. But there is one more crucial thing—the hosting. Imagine the hosting as an elegant person who puts all the files - blog posts, photos, products, etc. - in a drawer. It enables you to have safe online space for your website, and it makes it accessible to anyone who wants to visit it. Businesses usually choose among these web hosting types: shared hosting, VPS, and dedicated hosting. Shared hosting is typical in co-working offices, where more websites share space on the same server. Its price is the lowest, but security is jeopardized, and it’s not recommended for eCommerce websites or ones with significant traffic. Virtual private server/hosting (VPS) is private, stable, and offers vast resources that you can customize and organize as you like. In our opinion, it is a wise investment for business websites with lots of monthly visitors. The third option is dedicated hosting, and they put massive efforts into privacy and are the most reliable type of hosting because their price is slightly higher. Speaking about the six CMSs from the text above, you can see their annual cost of hosting in the table below.

But what about the headless CMS?

At first sight, headless might seem a bit more expensive than other CMS. For example, Butter CMS costs $49 monthly to add up to 50 blog posts monthly to your existing site. Marketing teams who want to scale content, product marketing, and SEO can expect a prize of $249. But, the high price is just high at first sight. Usually, decoupled CMS costs anywhere from under $100 to a few thousand per month. Like conventional content management systems, headless tools also provide multiple pricing tiers with different features provided at each level. You might have heard info like this: “Headless CMS is cheap and low-cost. It’s proven to have low monthly fees”.

People didn’t lie to you. In the long run, headless is cheaper. Here’s why:

  • It has no redundant layers that connect the front and backend system, which usually costs money. A leaner system means there’s no need for extra steps for each layer, less time for their communication and working on them, therefore fewer costs for all of that.

  • The first objection when it comes to the headless is the developer’s work. Usually, business owners need a hand when choosing headless in their projects. When you think about it, it’s not much different than the cost of developers working in conventional CMSs. Here’s the catch. With headless, you pay the developer only once. What does that mean? With conventional CMS, you would have to pay a website developer and android developer (if you need to put your online store on an app store). For additional devices, you’ll probably have to pay more professionals or a complete agency. With headless, creating an omnichannel experience between mobile and web presence is not that expensive and time-consuming. One man can do it all because headless enables it to repurpose your decoupled content to any device possible.

  • Many business owners are planning on changing the platform they use. Most of them do that because they want to scale up a business, and the platforms they use are not the best solution. For example, they want better ordering systems, payment processing, etc. It happens more often than you think. And with every scaling and re-platforming, they need to prepare the wallet. Headless, on the other hand, is designed to scale.

  • It provides the infrastructure necessary to grow along with your business. Which, again, reduces the pains associated with development costs.

If you are struggling to understand the basic headless concept and the stuff we just spoke of, check Intro to Headless CMS. So, in the long run, headless minimizes the need for future costs. Maintaining is more straightforward and cheaper, and there lies it’s an advantage over traditional when we’re talking about the price.

There is no battle between traditional and headless CMSs

At the end of the day, it’s not a battle between WordPress vs. Headless CMS, and it all comes down to the project’s requirements, budget, and deadline.

But for us, headless offers a better overall experience. And by that, we mean the user and developer, digital experience, and let's explain that further. From a frontend developer's perspective, conventional CMS sometimes seems like an endless realm of code. We have to dive into complex code and understand how the data is presented, which can be difficult and time-consuming. With headless, fronted teams can fully concentrate on visual aesthetics, choosing how to present the data at the end. They do not need to worry about constant security updates and other maintenance issues as they would have with WordPress and alternatives to WordPress. In other words, headless makes them independent, which very few traditional CMSs can offer. When it comes to the user experience (UX), it might be the most crucial thing about CMSs. A website that is hard to use is slow or poorly laid out, which will result in leaving visitors. On a larger scale, UX is vital. Its goal is to fulfill users' needs, provide consistently positive digital experiences, and keep users loyal to the product or brand. Some conventional CMSs have a great user experience. For example, WordPress is easy to navigate for a user and proves that more straightforward sometimes can be better. Another plus for beginners is they don't need to know anything about code or web design. Content creators and editors are primarily relying on CMSs like WordPress and Joomla because of their simplicity. But they shouldn't be frightened by headless. With it, they create and edit content the same way they were before. As you can see from the comparison above, headless is faster and easier for developing a great and modern website. Also, because the backend and frontend are separated, headless is much safer.

Because of the way they work, this type of CMS requires development knowledge for design, frontend, and backend. For smaller projects, this means headless can get quite expensive. For larger projects and ones that plan more platforms, cross-platform headless is much more affordable.