Headless e-commerce explained through t-shirts
Let's have a look at images. There's quite a few of them in an e-commerce store.
Working with images and image galleries is one of the most time-consuming tasks when working with e-commerce.
Okay, so let's say you've taken some crispy photos of your beloved t-shirts.
And then let's say the t-shirts are variable products; they have different sizes and colors.
You have 4 colors and 6 sizes. You took 4 photos of each t-shirt, one for each color.
You're happy with the outcome and go online to add the photos to your store.
Everything is fine and dandy...
Until disaster strikes
You want to add all the photos of the green t-shirt to all the 6 sizes you have for that color.
Should be a piece of cake, right?
Because most e-commerce platforms does not the capability to add image galleries to product variants.
You contemplate just adding all the images in the main product image gallery.
But no, you're a perfectionist.
That won't cut it.
The gallery will be too long and will not give the optimal user experience.
You believe the user should see the photos of the green t-shirt when they select the green t-shirt.
So instead, since you're crafty, you look for a workaround.
There's definitely an app for that.
And there is.
You find an app, you install it... You're. happy.
You have to add the same photos of the green t-shirt to every single size
And you might think that this is a neccessary evil.
It's just how things have to be.
You can't have it all...
Except you can.
Here is where the power of a headless architecture comes in.
Headless means that you separate the front-end (your storefront) and the back-end (your e-commerce platform).
This allows you to use better-suited tools to solve everyday problems such as this one.
We use the content platform Sanity for our e-commerce stores.
Sanity allows us to add variant galleries, where the editor only needs to add the photos for a specific color once.
Here you can see an example from one of our client's Sanity studios.
The images for the sweater is applied to the 5 available variants of that color.
But that is just one of the benefits of a headless architecture
In addition to being able to solve everyday problems like this one, a major benefit of building is speed.
Speed is extremely important.
When we're talking about speed, we're talking about how fast the pages on your website loads.
There is a direct correlation between site speed and your conversion rate.
The faster your website loads, the higher the conversion rate.
Instead of being bogged down by old-but-not-always-so-gold technology, you can build your storefront with cutting-edge technology.
If you want to read more about why speed is so important, check out our article that outlines 8 reasons why speed is important.