Webflow v Headless CMS
As companies grow and consider upgrading their websites, upgrading the CMS is often a part of the journey. This article helps you navigate whether Webflow or a Headless CMS is a better route.
Co-Founder / CEO
January 3, 2023
As technology companies grow there tends to be a natural progression up a Content Management Solution (CMS) hierarchy as the company scales and the requirements grow. In the early days a solution like WordPress, Squarespace, or Wix may have sufficed, but as expectations and ambitions grow a CMS re-platforming is a common occurrence after a certain period.
The triggers for this decision can be varied, and often include both ‘push and pull’ factors. The sheer volume of ongoing WordPress issues often mean a WordPress migration / B2B SaaS site migration is a common request as marketing and technology leaders are unwilling to continue on a solution that is not appropriate for scaling startups. Similarly, the template constraints of a Squarespace or a Wix means they are no longer fit-for-purpose either.
Other driving factors can include a new Chief Marketing Officer (CMO) being hired, an investment raise, or growth targets that are unlikely to be met on a legacy platform or solution. All of these factors contribute to a decision being made to upgrade the existing website from WordPress, Webflow, Squarespace, or Wix (to name but a few).
A growing number of scaling companies are seeking to source a CMS that is fit-for-purpose, while also being future-proof thus extending the lifespan of the CMS, reducing the need for major change every few years are now turning to the category of Headless CMSs [What is a Headless CMS?] to meet their evolving needs.
Webflow or Headless CMS
In many instances, the decision relating to a new CMS for scaling companies narrows to choosing either Webflow or a Headless CMS like Contento, as the optimal upgrade choice.
So what are the Pro’s and Con’s of each route and how best to evaluate them?
What is Webflow?
Webflow is an all-in-one cloud-based platform with built-in CMS (or online visual editor platform) that gives marketing people and developers alike the ability to design, build and launch a website in a fast, economical, and collaborative manner by merging design, and content management into a single platform. As a 'no-code' website building and hosting tool, it allows these users to build websites without having to write lines of code.
Webflow is also a popular option for web designers because of the high level of customization it allows.
Advantages of Webflow
The biggest advantage of using Webflow is it allows control over the appearance of your website without having to write any code. There is no need to adhere to a theme or template which allows agencies and Freelancers to create a completely custom solution to meet the specific needs of the client.
The scroll-based animation and interaction, coupled with the flexible design capabilities means the look and feel of Webflow-based sites are also impressive. Add a drag-and-drop page builder, responsive page design, and native Zapier integrations as additional popular features and you’ve got a compelling option.
The following represent two great examples of B2B SaaS websites using Webflow to power their websites (correct as of January 2024).
Example 1: Appraisd - a B2B SaaS company built on Webflow
Example 2: MediaHQ - a B2B SaaS company also built on Webflow
Disadvantages of Webflow
However, Webflow is not without its limitations. The steep learning curve is one of the main disadvantages of using Webflow. While it is fine for developers, I have found that in most instances the marketing team has not been able to build pages without relying on an external contractor ‘on a retainer’. This is a fairly major disadvantage aside from adding to the overall cost.
Webflow also currently charges additional costs for website security and if you wish to add any custom code you must pay for an additional Webflow service called 'Workspace'.
There can also be significant build issues that only emerge “down the road” after an agency has built the original site, and has long since departed the scene.
The original agency that built the site should always use specific guidelines and strategies to build websites in a clear and scalable way, such that any person in the marketing team can easily understand. This means you need a clear structure, proper naming conventions, and well-defined rules, etc. These best practices and principles are often ignored by agencies when developing websites in Webflow leading to frustration within the marketing function.
The reasons these build principles are ignored are usually due to the following:
Having over-committed relative to the agreed budget
Having not scoped the brief properly
Seeking to upsell an annual retainer for new page builds
Seeking to cut corners (and increase margin)
A mix of mostly junior developers working on the site concurrently
I have seen the following examples of issues when looking “under the hood” of Webflow sites that look good on the outside.
No clear naming convention for class names.
Elements with no meaningful names or ones just using the default Webflow naming when applying styles. This makes it hard to maintain the website and scale it properly.
Images not well organized e.g. no proper names or alt tags.
Color variables not properly used.
All of these contribute to a platform where things can break and where adding new pages in-house becomes mission impossible thus creating an unwanted dependency on an external developer.
If you do choose a Webflow-based route the following are thus important factors:
Insist the chosen agency apply the principles outlined in Finsweet's client-first framework
Ensure there is adequate training and Loom video recordings baked into the scope
However, the biggest issue with Webflow is that it can be overwhelming but also dangerous in the wrong hands. You definitely want to avoid putting a generalist marketing person in charge of Webflow maintenance and management.
What is a Headless CMS?
A Headless CMS refers to a relatively new modern approach to website design that a growing number of leading brands are embracing due to the performance gains that result.
In short, the front-end and the back-end are ‘decoupled’, which is in stark contrast to the historical approach to building websites. Using a Headless CMS like Contento, means you can take a structured contentapproach to your content management and can use API’s to connect with leading 3rd party applications, freeing developers up to focus exclusively on front-end design and optimization without tying them to any templates, or frameworks.
What does all this mean in practical terms?
It means the design elements are not present in the CMS. So from a marketing perspective site management and maintenance is focused on content management. This all works well if the primary function of the team is to publish new blogs, and manage and maintain existing content. However, if you do expect to be creating new pages on a regular basis you'll need access to a front end dev to support you.
Is Webflow a Headless CMS?
No Webflow is not considered a Headless CMS - Webflow has a presentation layer so it is not decoupled which is a key part of what constitutes a Headless CMS. Webflow is a no-code platform and it combines design and content management within a single CMS.
What is Contento?
Contento is a Headless CMS designed with the needs of marketing people in technology companies specifically in mind. It has all the main features of leading Headless CMS competitors, while also doubling down on usability and design, ensuring it is truly easy for a marketing team to use to maintain a site. This last point is also crucial, unlike other Headless CMS solutions that promote the benefit of omnichannel content delivery, Contento is 100% focused on marketing websites.
Advantages of a Headless CMS?
The main advantages of a Headless CMS-first approach relate to enhanced performance, as this Headless approach lends itself well to creating fast sites. Solutions like Contento have an added emphasis on usability and SEO (to name but two key differentiated features) and thus the solution is appealing to both marketing leaders and developers alike.
The following article outlines the key advantages of a Headless CMS in detail.
Disadvantages of a Headless CMS?
In terms of the main disadvantages, the following are worth being aware of.
1- Developer Dependency
Technology companies are likely to have an in-house Front End developer familiar with Jamstack-based Headless CMS’ who can help create new pages on an ad-hoc basis without needing to source an external freelancer, but it still means new page creation will need the assistance of a developer.
2- No Presentation Functionality
You can’t simply “create a page” like a “drag and drop” page-builder and press publish. The front end needs to be designed as the Headless CMS relates primarily to “the content”.
3- Reliance on Additional Technologies
When it comes to putting a site live there are additional elements needed as it is not an all-in-one solution. Services from the likes of Gatsby (generating static sites) and Netlify (building and deploying your sites) will be needed. They are, however, not expensive and straight-forward for any developer to link together.
To gain a more detailed assessment of the Pro’s and Cons the following article is instructive: Benefits of Headless CMS
Decision Criteria Webflow v Headless
When it comes to evaluating the best route for your growing company several considerations need to be taken into account. These include the following:
When it comes to website costs there are one-off costs and Total Lifetime Costs. When it comes to a new website build, the CMS is often the lowest part of the cost, especially if you need to bring in a brand agency, or messaging freelancer to help with the content and design. It is important to also assess any ongoing costs as ideally, you want to avoid the need for an agency retainer to manage and maintain the site.
Webflow: Pricing varies - adding a Webflow Developer into the mix on a retainer spikes cost
Headless: Competitive pricing - but costs may add up elsewhere e.g. design costs
You need a fast site period. The websites of scaling companies are all about funnel optimization and conversion rates. Several tools can be used to measure site performance including PageSpeed Insights (Google) and Pingdom Website Speed Test (Solarwinds).
Webflow: Webflow sites will perform well but are unlikely to match speeds of a well-built Headless CMS
Headless: Nothing beats static content for speed.
3- Search Engine Optimization (SEO)
Ideally SEO is baked in and is fit for purpose in supporting on-site optimization. Take WordPress as an example, SEO is largely dependent on the YOAST plugin which is not ideal. With Webflow you can easily update page titles and descriptions. It covers most basics SEO elements without the need for a 3rd party plugin, but it is better served for those with HTML/ CSS skills to leverage it to its full extent.
When it comes to Headless CMS solutions like Contento, SEO is a key focus rather than an afterthought.
Webflow: Can be fiddly to manage properly when it comes on to on-site SEO
Headless: This can be a mixed bag depending on the Headless CMS solution chosen. Contento is hyper-focused on delivering a leading SEO module.
A primary motivation for many companies moving off the likes of WordPress relates to perceived security vulnerabilities. This is particularly the case when these sites have lots of legacy plugins and the company has a short tenure for marketing leaders (meaning over the years numerous different marketing leaders have managed the team and the site and added in different applications and plugins).
Webflow has a dedicated security page that outlines its security credentials. These range from ISO 27001, to compliance with GDPR and CCPA. Built-in features include SSO, SSL certs and two-factor authentication (2FA). As with other platforms, the risks can occur when 3rd party scripts are used inside Webflow, especially ones relating to personal data e.g. form-based applications.
Webflow: Good security incl via AWS hosting married to a strong internal focus on security.
Headless: Like Webflow, enterprise-grade security is the norm
5- Switching Costs
Many growing companies in the tech space will look to replatform every few years as mentioned above. Being aware of switching costs up-front are important to avoid vendor lock-in.
Webflow: While contract terms may have limited lock-in from a commercial perspective there may be switching costs related to employee training as well as migration costs.
Headless: A Headless CMS's modular design makes switching to a new provider for different elements substantially easier.
6- Developer Dependencies
Ideally, you want to remove any developer dependencies with the CMS chosen. However, that is not realistic with either option despite messages to the contrary. Given Headless CMS’s are on the Jamstack architecture it is likely that most front-end developers could help with site maintenance on an ad hoc basis, which is not the case with Webflow where an external resource is more likely.
Webflow: Having an in-house Webflow developer available is not common so a freelancer may be needed.
Headless: It should be possible to get limited access to an in-house Front End developer familiar with the Jamstack meaning internal resources can help on an ad-hoc basis.
Any CMS or website builder on the market will promote how user-friendly they are. However, usability is often in the eye of the beholder. Developers will navigate most CMS’s fairly easily, but the litmus test is really about how the marketing team finds it. In our experience, most applications treat the marketing team as an afterthought and fall well short when it comes to usability. It is one of the major drivers we’ve had to build Contento. It has to be easy, even enjoyable for marketing people to use.
Webflow: Don’t fall for the spin. It is not that easy for most marketing teams to use.
Headless: Most Headless CMSs are not easy for marketing. We have built Contento so it is easy.
Choosing from The Options (Webflow v Headless CMS)
When faced with an array of options it is difficult to know which route to go down. If an agency is involved it will likely try to influence the CMS decision, and it is thus better to have this decision locked down before engaging with an agency. Most agencies will look to push their CMS of choice based on the option that makes the most commercial sense to them.
Ideally, the options are discussed between the Technology and Marketing lead, in conjunction with the CEO (unless the CEO is happy to delegate the decision). The more technically minded Marketing leads are increasingly likely to consider a Headless CMS approach as they’ll be familiar with the Jamstack architecture.
Agreeing which of the above 7 drivers are the most important ones, and will help you narrow down your choice.
Webflow v Headless - A Summary
Choosing the right CMS to support your next phase of growth is never easy. The option set is wide, and it is easy to get conflicting advice as to which route to go down. It is recommended that the CMS choice is made prior to engaging with an agency as the profitability of many agencies is in ensuring that website builds align with a well-trusted in-house build methodology on a preferred CMS with as many repeatable elements as possible. Few agencies offer a complete carte blanche as to which CMS to choose from which is why it is best to try and decide on your preferred CMS upfront. A growing number of scaling businesses are turning to Headless CMS solutions, however, using the above decision criteria set will help you decide whether or not to embrace Headless CMS or to stick with a solution like Webflow.