Headless Commerce Complete Guide (Examples & Platforms)
Headless commerce isn’t as scary as it sounds (or it might be, depending on the expertise of your developer). Essentially, it means that the frontend of your ecommerce platform is separated from the backend, unlike traditional ecommerce where the two are connected.
This article will do a deep dive into what that actually looks like, but it isn’t meant to be an in-depth discussion of the technical aspects of headless commerce. Instead, we’ll focus on the business side of headless commerce-the the benefits, challenges, and some illustrative examples.
What is Headless Commerce?
The technical definition: headless commerce is an ecommerce system in which the backend, where orders and payments are processed and data is stored, is separate from the frontend interface that the user interacts with when placing an order.
If you’re considering making the switch to headless commerce, this definition isn’t really of use. It’s full of jargon and doesn’t provide much insight into why or how you and your team might go about this.
Here’s A Better Way To Explain Headless Commerce
With a lunch tray.
The lunch tray represents the backend of your ecommerce system, and your lunch is the frontend.
In traditional ecommerce, the lunch tray influences what you order for lunch, while in a headless architecture you have more flexibility in what you order.
Traditional Ecommerce = Compartmentalized Lunch Tray
Go back to your grade school cafeteria, where you grab a tray for lunch. The tray has set compartments for each part of the meal.
There’s a spot or two for sides, a section for a drink, and a big compartment in the middle for the main course. You have your choice of the main course, sides, and drinks, but the lunch tray always has the same layout and doesn’t permit, say, ordering two mains and no sides.
If you wanted to do that, you’d need a whole new lunch tray with a different layout, which might take weeks or months for the manufacturer to make, and even after all that, you might decide you want to go back to the first option.
In the same way, the backend of traditional ecommerce systems limits the frontend presentation layer of your ecommerce system. The backend and frontend are tightly linked, so changes to the frontend also require changes to the backend, the same way that if you want two main courses and no sides for lunch, you need to change the lunch tray.
Headless Commerce = Flat Lunch Tray
In a different cafeteria, you grab a tray for lunch. This tray is flat, without any compartments.
What you order for lunch isn’t limited by the compartments. The lunch tray and your order are not so tightly linked, and you don’t need different trays for ordering a main course and a side one day, and two sides the next.
Headless commerce is not limited by the constraints of the backend. While there is still a connection between the backend and frontend (after all, you still need a tray to carry your lunch on), you are free to make changes to one or the other without needing to update both, or get a new tray, so to speak.
A Side Note On Content And Attributes:
Another side of headless commerce to consider is product attributes and characteristics.
Here’s an example of product attributes and characteristics to illustrate:
Say a customer is looking for pots and pans.
Ecommerce managers and marketers might classify the pots and pans products in a few ways, depending on sales or campaigns they might want to promote. For example, they might be listed separately under kitchenware, or as a set under kitchenware sets. They might be under-sale or clearance items, or sorted by color, size, a number of items in the set, or other ways.
The classification system that the attributes are part of needs to be applied the same way across every frontend that is part of the ecommerce architecture. This classification structure ensures products and content are properly retrieved across various frontends.
Let’s bring that back to the lunch tray analogy.
With attributes and characteristics used in headless commerce systems, a “lunch tray” that denotes which items can be ordered and where they are placed isn’t needed.
Rather than orders being based on what can fill the tray, it’s based on the attributes of what you want for lunch.
For example, at lunch, you might be in the mood for something:
- Spicy
- That has vegetables in it
- Is served hot
- Is a large portion
- That costs less than $10
If you input these attributes into your lunch order, you might receive a choice between a spicy Thai curry dish and a spicy minestrone. In this way — in headless commerce — you have more ways to offer choice to users and to make your products accessible to them.
Traditional vs Headless Commerce
While both ecommerce systems have their uses, headless commerce is arguably the superior option — for your customers, your ecommerce team, and your business overall.
Benefits Of Headless Commerce for Customers
Headless commerce provides a few key benefits for customers, and since they ultimately decide the success of your ecommerce business, you’ll want to keep them happy.
1. More choice.
With headless commerce, you can use APIs to connect your backend to any frontend or create custom frontends, giving your customers more ways to shop beyond your website. Think social commerce, voice-controlled ecommerce, or custom frontends.
2. Ease of ordering.
By providing more frontend options, or customizing a frontend that shortens the ordering process, customers will find it easier to order. They won’t need to go through your entire website checkout process when you have a custom one-click ordering frontend.
3. Convenience.
Convenience is very important to customers. They will abandon an order at the first inconvenience. Keep your customers on your ecommerce platform by providing them the ease and convenience of ordering through their preferred method.
Benefits Of Headless Commerce for Ecommerce Teams
Developers, ecommerce managers, and content managers all benefit from headless commerce as well. While planning for and developing numerous frontends might seem like extra work, the benefits of headless commerce balance this out.
1. Integrate with any system.
Rather than be tied to one frontend ecommerce solution, your team can use several to cover every system, so you don’t miss out on the opportunities afforded by other systems. You can integrate one backend with multiple eCommerce architectures.
Lina Bustos, an ecommerce strategist and author for ecommerce Illustrated, explains:
“Now that most ecommerce platform vendors have decoupled their front ends from their back ends and “gone headless,” headless commerce is more accessible than ever. Today, single-page applications and progressive web apps are table stakes, which is great for both front and back end developers, who no longer have to coordinate everything they do with each other (something that responsive design made even more tricky). Fast-loading pages also are great for customers and conversion!”
2. Faster updates.
As the backend and frontend are separated in headless systems, updates are faster because you don’t need to update both every time. In traditional ecommerce, changes to the frontend require difficult changes to the backend as well, but not in headless commerce.
3. Easier to scale.
You don’t need to update the backend for every change to the frontend, so it’s easier to scale your ecommerce solution up or down. You can adjust your ecommerce architecture as you see fit and add new frontends.
4. Flexibility.
Frontend developers can be more flexible and creative in their work, as they are not limited by the constraints that the backend puts on frontend development. Give your developers the freedom to come up with the latest and greatest.
5. Less Downtime.
With fewer updates to the backend when you update the frontend, it follows that there is less downtime while you’re performing and testing any updates. Updates are also less risky because you don’t need to update the backend, so there is less risk of breaking it.
6. Reuse of Content.
With traditional ecommerce, putting your content on multiple platforms involves manually adding it to those platforms. With headless applications, you can focus on content commerce and reuse your content in many places, as it can simply be called by an API and used across every frontend.
7. More User-friendly Content Management System.
Ecommerce specialist Lina Bustos explains:
“Another great benefit of headless is the ability to give business teams a more user-friendly content management system (CMS) or digital experience platform (DXP) to load their own content and make frequent (even daily) changes to the site without involving IT. This is HUGE, as in the past, sometimes even changing a home page banner could take hours of work and cost thousands of dollars through a development partner, let alone creating amazing landing pages and merchandising features.”
Benefits Of Headless Commerce for Businesses
There are benefits for businesses too, which include the continued delivery of content and convenient ordering to customers.
1. More flexibility and customization.
You can adapt your ecommerce strategy to where your customers are and how they are buying. You can give them the frontend experience they are looking for. For example, if your audience moves to use more voice-controlled shopping, you can follow them thereby creating a custom frontend that allows this.
2. More agile.
Headless commerce keeps you agile and competitive. You can quickly implement new frontend platforms without much downtime, as well as keep up with competitors and avoid lagging behind due to long development and testing times.
3. Implement omnichannel.
With more customization, you’ll be able to ensure a seamless experience across ecommerce platforms and systems that you’re using as part of your omnichannel marketing strategy. This is important to boosting your conversion rate and retaining customers. Currently, only about 52% of businesses have implemented omnichannel. Be in that percentage with headless commerce.
Challenges of Headless Commerce
For all the benefits of headless commerce, there are challenges that ecommerce teams will need to consider.
1. Managing Roles And Responsibilities
With both traditional and headless ecommerce, many team members are involved in implementing, maintaining, and improving the experience for customers. This can involve marketers, ecommerce managers, content managers, and frontend and backend developers.
In traditional ecommerce, roles are easily defined, because everyone can work on their task independently. For example, content managers can update content without necessarily needing input from developers.
In headless commerce, team members need input from each other, especially when ensuring the user’s journey is coherent and seamless. This might slow down workflow in the short term, but it can benefit your team as well. By collaborating with team members in different departments, they can avoid fishbowl thinking. The main way to avoid a slowdown is to define workflows that minimize back and forth and streamline content, development, and user journey updates.
2. Content Managers And Marketers Are Less Independent
Because the frontend requires custom coding by developers, marketers aren’t as free to go into the system and add and update content as they would with a traditional CMS and digital commerce platform. They will require support from a developer, which can be time-consuming and can cause a loss in agility.
The best way to tackle this is the same as above. Define a workflow that allows marketers to be as agile as possible.
3. Additional Work For Frontend Developers
Without a default frontend, developers need to build a custom one for each application or frontend in use. This is obviously more work upfront, and this process is ongoing as you add more applications and as maintenance is required.
Time management will become more important for frontend developers, as will allocating time for testing and maintenance. You’ll also want to make sure you’re following UX best practices for each channel.
The Birth Of A New Generation Of Headless Commerce: Microservices
With headless commerce now so common, there’s the next generation of headless commerce: microservices. This approach goes steps further than just separating front and back and starts chipping away at the commerce platform itself.
To get insight on this topic, I reached out to Lina Bustos, an ecommerce specialist and author for Ecommerce Illustrated. Here’s her explanation of microservices and where she sees the new generation “headed”:
“Because most commerce platforms are deployed as one system (monolithic code), all pieces of the platform such as catalog, cart, checkout, customer accounts, pricing, payments, and promotions are all tightly woven together. This means that any changes or updates to the platform or content impacts this large block of code, and can potentially break something anywhere in the platform. IT has to be very careful about managing the commerce application, and business users often are restricted from making updates independently (like adding promotions, changing pricing, or creating new categories).
With microservices, a promotions service (for example) would be its own application. And like with a CMS, business users could (with the right business user tooling) add, modify, delete and schedule promotions independent of IT. The microservice could also be extended to new touchpoints and experiences like an airport vending machine or pop-up shop, so customers could apply the same discounts from the online shop anywhere they encounter the brand or retailer, and self-checkout through their mobile phones (connecting to cart, checkout, and payment microservices).
Microservices can also scale independently, which helps site performance and uptime. Net-a-Porter, for example, built a microservice to support the traffic spike for their twice-annual clearance sales (events that would ALWAYS bring down the site).
With analysts recommending IT and business teams choose more modular platforms to run ecommerce, and more vendors embracing microservices architecture, I predict we’ll see more and more online merchants (large and small) using them by 2022, and blending commerce with unconventional touchpoints like voice assistants, chatbots and in-store digital.”
Originally published at https://theecommmanager.com on March 31, 2020.
