Times change quickly in the technologically-centered world of eCommerce. While trends come and go, some innovations can send shockwaves through the virtual space and signal changes that will redefine the entire industry.
Headless eCommerce, while not the sexiest name in the world, has already been implemented by some of the biggest brands out there including Amazon, Nike, United Airlines, and more. What’s more, their success stories contain some impressive claims:
- Venus: percentage of <1 second page loads jumped from 15% to 72%, +24% conversion rate;
- Overstock: +36% increase in revenue, +8% conversion rate;
- Annie Selke: first-page load time reduced to 0.74 seconds, +40% increased organic traffic;
- Under Armour: “double-digit revenue growth, 3x return rate, 65% less pre-bounce”;
Disclaimer Alert: we have no way to independently verify these numbers and yes, it’s possible that these companies invested resources into additional initiatives beyond “going headless”.
Now that the disclaimer’s out of the way, this author is comfortable saying the following – there’s no denying that this type of restructuring can bring significant benefits to certain companies.
Is going headless the shake-up your business needs to boost sales and traffic? How is headless eCommerce different from traditional eCommerce? What does “going headless” even mean, anyway?
You’ve got questions, we’ve got answers.
What is Headless eCommerce?
In order to fully understand what headless eCommerce is, we have to have a basic understanding of the structure of a “traditional” eCommerce setup.
Let’s start client-side. Traditional eCommerce stores have a presentation layer known as a “frontend” (typically a website or native mobile app) that users can visit and interact with in order to make purchases. This frontend is customizable through things like themes, block editors, plugins, etc., but you’re always operating within the bounds of your website/mobile app.
Your frontend works in exceedingly close tandem with your backend, which consists of the databases and servers that do the processing work and store the data for your frontend.
Anyone who has ever managed a WP site knows that fitting all of the pieces together and keeping your installation bug- and conflict-free requires a lot of time (and sometimes a lot of money too).
While this can be a bit of a hassle, this is the foundation of traditional eCommerce – carefully configuring your frontend and backend so that they play nice with one another.
Because your frontend and backend are so connected, or “coupled”, you can’t just make changes willy-nilly to a bunch of stuff onto your frontend without taking down your site for maintenance. On top of that, you can’t avoid configuring everything and then testing how it interacts with the backend and then debugging and QA-ing and so on and so forth!
…but what if you could?
That’s where the idea of Headless eCommerce comes in, which allows you to decouple the “head” (frontend) of your store from the “body” (backend).
The backend still performs all the functions that a traditional backend would, storing and processing the data that your store runs on.
The front end is a bit more complicated as the traditional architectures of a website or native app fall away. In order to fill the void, this generally means that your front-end developers can go crazy coding whatever type of presentation layer they can dream up.
Finally, a headless system relies on REST APIs to allow the frontend and backend to communicate with each other. This presents some unique benefits and challenges we’ll address further down.
What are the advantages of headless eCommerce?
Both headless and traditional eCommerce systems have their place in the market, as well as their own distinct advantages and disadvantages.
What does headless eCommerce bring to the table?
- Omnichannel Deployment
- Easy Updates
- Better Marketing
- Seamless Integrations
- Cleaner Architecture
Let’s go through these one at a time.
Even though this buzzword sounds like it’s straight out of an old Billy Mays commercial, many of the big brands mentioned above switched to headless commerce with one big goal: expanding their marketing channels to keep up with the ever-evolving Internet of Things.
With a headless frontend, no pixelated surface is safe from the grasp of your marketing team because content can be delivered to anything, and I do mean anything – progressive web apps (WPAs), smartwatches, refrigerator screens (yes, that’s a thing now), and even smart mirrors.
On top of that, you will be able to bring your content to any new technologies that emerge in the future, as your presentation is not limited to the confines of a traditional desktop or mobile viewing.
We understand how frustrating and time-consuming it can be to update a website and then troubleshoot any conflicts/bugs that emerge.
(Side Note: this is actually why we started offering Maintenance Plans to our customers!)
As a result, regular maintenance often gets pushed to the bottom of many shop owners’ “to-do” lists, despite the security and functionality risks that come along with outdated sites or plugins.
With headless eCommerce, your frontend and backend can be updated independently of one another, which is how sites like Amazon are able to update their site every 11 seconds on average.
By “better”, I mean the following:
- More Agile – your team can respond to new technologies as they arise to craft customer experiences that the market has never seen. Also, your frontend can push products to market exceedingly quickly because they don’t have to worry about wrangling backend logic;
- More Responsive to Your Customers – you can use the backend data you have about a customer to power personalization engines on CMS, mobile apps, and socials without having to design an entire website or plugin;
- More Flexible Design – your developers and marketing teams are free to present your content and products however they’d like, beyond the confines of “what works best” on a specific eCommerce platform;
- More Conversions – your test cycles will be much, much shorter than those of traditional eCommerce platforms, which means you get to know your customers much faster than your competitors;
Headless commerce is built on APIs, which means you can integrate a wide variety of other programs to great effect.
This article by CoreDNA offers a great example:
“Core DNA customer Stanley PMI experienced this first hand, using our headless commerce platform to integrate with Oracle and Slack, an integration which helped streamline their customer service workflows. Without delving too deep into this particular integration, Stanley leveraged Core DNA to […] collect customer support requests, warranty claims, and other questions while simultaneously executing a customer lookup to ensure it isn’t a duplicate request. It if is, the system appends the request, otherwise, it creates a new customer record.“
This is, of course, just one example. APIs are a powerful tool when placed in skilled hands, and the possibilities are only limited by your developers’ collective imagination!
The front end of headless commerce is focused exclusively on delivering content, which generally brings complexity levels down and increases performance.
From a security standpoint, removing your own head is actually a great idea as well. Your frontend is visible to visitors (obviously), but your backend will become inaccessible to the public.
Finally, bumping up the scale of a headless frontend is really just a matter of adding more separate frontend servers. While this isn’t a trifle, it’s certainly not the gargantuan amount of work that typically goes into scaling a traditional eCommerce site.
What are the disadvantages of headless eCommerce?
There’s no denying that headless commerce allows you to explore some amazing opportunities, but as the old saying goes, nothin’ good ever comes easy.
- Lost Functionality
- 2x Work
- Marketing Hurdles
The first item on the list is perhaps the most self-evident.
Considering that the vast majority of extant solutions, plugins, extensions, and add-ons are designed for traditional eCommerce installations, such as WooCommerce, going headless also severs your access to the mainstream market. ( In fact, the functionalities you can obtain through WooCommerce development and customization are some of the main reasons why so many of our clients choose WooCommerce for their online stores).
There certainly could be existing API workarounds for some of the functionalities that you and your team are used to enjoying, but most shops that go headless lose the ability to do things like use page builders and preview content changes.
(If you’re a marketer and your eyebrows just flew off of your face, feel free to skip to point 3 – Marketing Hurdles. Don’t worry – it’s not all bad.)
These API workarounds aren’t just falling out of the trees either – your IT team has to be up to the task of developing and implementing them. If that isn’t an option, you should have money earmarked to outsource the development work or purchase ready-made solutions.
The transition to headless commerce is a significant one and should be planned out in careful coordination with all of your teams.
Why is it so significant? It demands a considerable shift in responsibilities, workloads, and approaches. Where there was one codebase, database, maintenance procedure, or marketing strategies, now there are two, and everyone’s going to have some adjusting to do.
Your front-end developers should be prepared for the incoming overhead of designing a presentation layer from scratch.
Your backend has to contend with the transition to REST APIs and maintaining twice as many codebases and databases as usual.
Your marketing and design teams will have their work cut out for them as they lose several precious tools, revamp communication strategies with your technical staff, and shift to more channel-based approaches.
But while we’re on the topic of marketing…
One of the biggest advantages that traditional CMS offers is accessibility for non-technical users. Page builders, block editors, and templates make building a website easy even for people that have never written a <strong>single</strong> line of HTML. These solutions also make it a snap to edit websites, which means there’s no reason to call up a dev if the padding of a block element has pushed it 10 pixels off-center.
On top of that, traditional CMS offers access to content previews, which are one of the most frequently used tools in a design team’s kit. And this is a bit of a no-brainer, right? Double-checking content before you publish means that visitors to your site get the best possible experience from the moment your changes go live.
But let’s ignore all of that to return to our discussion of pure headless eCommerce – a playground for eager frontend developers that can also be a waking nightmare for marketers.
That means no more “what you see is what you get” environments and no more “quick touch-ups”. Accordingly, this can mean that a good chunk of your marketing team’s work shifts over to your developers, who were probably pretty busy already.
Note: we are discussing headless commerce, not decoupled commerce (which can be overgeneralized as “headless commerce + templating tools”). This article by CoreDNA delves into the difference between the two and we highly recommend checking it out!
In short, going totally headless means your marketing team is entirely reliant on your IT team when it comes to deploying, editing, and updating content, but that doesn’t mean your marketing team won’t have anything to do.
The ability to push content to any screen, create and publish campaigns in days (as opposed to weeks), and stay toe to toe with emerging technologies is sure to keep them on their, well…their toes!
“Dolla dolla bills, y’all.”
— Wu-Tang Clan
As you have probably gathered by this point, doing things like “doubling your amount of maintenance” or “building a frontend from scratch” or “overhauling the entire architecture of your platform” comes at a cost.
Publishing and maintaining a sleek, responsive headless commerce solution means relying heavily on your technical staff, which means allocating considerable resources to your technical staff.
The opportunity cost of your developers’ time is an essential part of this equation as well, especially when considering time dedicated to troubleshooting and updating your custom frontend.
On top of all of that, there are all sorts of other costs that can come creeping in even if your developers are up to the challenge, such as finding API-based workarounds to your most essential functionalities and subscription costs for service providers or digital experience platforms (DXPs).
There’s always the option to bring in outside help, but any business owner knows that good work doesn’t come cheap.
Now that we’ve covered the pros and cons, you probably have one burning question left – is headless eCommerce a winning strategy for me and my business?
Is headless eCommerce right for me / my store?
It depends. Another great article by Shopify breaks it down pretty well:
“If you say “yes” to at least two of these scenarios, headless eCommerce is worth considering further:
- I already have an established infrastructure, and it’s not always easy to re-platform another tool into our existing technology.
- I feel we’re moving slower than competitors because I can’t simultaneously make front- and back-end adjustments.
- I want my shopping experience to be fast for all shoppers, and to have more granular control over the elements that affect performance and site speed.
- My storefront theme or template isn’t as customizable as I’d like.
- I don’t have a native mobile app for iOS or Android, or my mobile shopping app isn’t as user-friendly as I’d like it to be.
- I want to build a unique storefront eCommerce experience that isn’t possible with my current platform (e.g., smart mirrors, wearable tech, vending machines, etc.)”
A lot of the best real-world use cases are unique use cases or innovative initiatives funded by companies and organizations with huge budgets.
While they’re great #success stories to plaster up on a website, not every business will find things like personalized billboards and 3D apps to be immediately relevant, and that’s 100% okay.
Perhaps you are hesitant to tear up your eCommerce system at the roots. Perhaps you lack the dedicated personnel (or funds) to implement the transition to headless, or perhaps you’re just experiencing incredible, continued success as is and see no reason to flip your entire business on its head.
I’m sorry, I had to sneak one in.
These reasons are all perfectly valid. No one knows your store better than you do, so we here at WooNinjas always encourage our readers to do their own research when determining what the future of their eCommerce business should look like! If you need an expert opinion, you can also count on us for an eCommerce consultation.
While proponents of headless systems proclaim far and wide that this technology will undoubtedly become the standard for all online commerce forevermore, the reality is that it’s still not as universally accessible or applicable as it could be for every business owner.
There are some awesome things that can be done when you isolate your frontend and backend, though, and this author hopes that you have a sense of how you and your shop could benefit from implementing a headless (or even decoupled) eCommerce system into your business model.
As always, if you have any questions about anything you read in this article, please feel free to drop a comment or reach out to us. Our eCommerce experts are always up for a good chat or debate on the comparative merits of different eCommerce structures.