Read on Twitter
1/ Site conversion should be the single most important KPI for every eComm site
Why?
Small increases in conv can lead to big increases in sales, all else equal
Lots of things affect conv, which makes it hard to improve
Let me show you how it's done
First up: @byhumankind
Why?
Small increases in conv can lead to big increases in sales, all else equal
Lots of things affect conv, which makes it hard to improve
Let me show you how it's done
First up: @byhumankind
2/ Let's tackle the low hanging fruit - page speed
Page speed is often sacrificed for the sake of a cool, overdesigned website
But customers care about it and it's the first thing to greet them when they walk in your (virtual) front door
Slow page speed leads to bounce
Page speed is often sacrificed for the sake of a cool, overdesigned website
But customers care about it and it's the first thing to greet them when they walk in your (virtual) front door
Slow page speed leads to bounce
3/ You can check your page speed stats here: https://developers.google.com/speed/pagespeed/insights/
@byhumankind has a pretty good score for desktop at 75, but only 23 on mobile
I noticed it most on mobile when trying to Shop All -> View All products
Def something to improve, but should be an easy fix
@byhumankind has a pretty good score for desktop at 75, but only 23 on mobile
I noticed it most on mobile when trying to Shop All -> View All products
Def something to improve, but should be an easy fix
4/ Now I'm on the site and see a Free Ship message in the header
Smart move
Customers hate paying for shipping but not every retailer can afford to offer free ship
If that's you, make it clear early in the customer journey what your shipping policy is
Don't make me guess
Smart move
Customers hate paying for shipping but not every retailer can afford to offer free ship
If that's you, make it clear early in the customer journey what your shipping policy is
Don't make me guess
5/ I'm not commenting on editorial decisions but I am happy to see a "Shop Now" CTA above the fold
You'd be surprised how many brands leave this out
Next, I check the nav and am surprised to see prices listed next to the categories...
You'd be surprised how many brands leave this out
Next, I check the nav and am surprised to see prices listed next to the categories...
6/ I don't know much about the products yet but these prices feel high - $15 for a bar of soap?
With few exceptions, leave prices out of your nav
You want your customers to make a decision about the value of your products only after they have enough information to do so
With few exceptions, leave prices out of your nav
You want your customers to make a decision about the value of your products only after they have enough information to do so
7/ I learned a lot working under Mickey Drexler but this was the most important thing:
Value = price + quality
Your customers are constantly assessing the value of your products
And value is different for every customer
Value = price + quality
Your customers are constantly assessing the value of your products
And value is different for every customer
8/ I'm here to buy body wash bc I'm out so I click on it in the nav
High intent customers go directly to product categories and bypass the "Alls" - pay attention to this behavior to learn more about them
On the PDP there's a lot to unpack
High intent customers go directly to product categories and bypass the "Alls" - pay attention to this behavior to learn more about them
On the PDP there's a lot to unpack
9/ The information density on the right is intense and increases cognitive load - this is bad
Meanwhile, there's a lot of empty space on the left and there's nothing below the fold
I'm not here to critique web design...
Meanwhile, there's a lot of empty space on the left and there's nothing below the fold
I'm not here to critique web design...
10/ Unless it gets in the way of conversion, which in this case it does
The PDP is a workhorse - it should provide just enough info for the customer to assess value and easily add to cart
Always optimize your PDP layout for these 2 things
The PDP is a workhorse - it should provide just enough info for the customer to assess value and easily add to cart
Always optimize your PDP layout for these 2 things
11/ The 3 critical decisions that must be made before adding to cart are tucked under accordions
They have to be selected in order, kind of like a setup wizard
When you make the first selection, the accordion immediately closes and you're propelled to the next selection
They have to be selected in order, kind of like a setup wizard
When you make the first selection, the accordion immediately closes and you're propelled to the next selection
/12 This level of user control isn't necessary on an eCommerce site
And while it's not particularly harmful on desktop,
The mobile experience is much more challenging because of the one thing:
Hover states
And while it's not particularly harmful on desktop,
The mobile experience is much more challenging because of the one thing:
Hover states
/13 Hover states are a fantastic design tool, but they don't exist on mobile
I see this come in to play most with product shots, which is the case here
On desktop, you can hover over a dish color or soap scent to see the product image
I see this come in to play most with product shots, which is the case here
On desktop, you can hover over a dish color or soap scent to see the product image
/14 But on mobile, you have to *select* the color or scent to see the product image auto-closing
This is important because customers rely on visual cues to make product decisions
The auto-closing accordions make it really hard to make a selection on mobile
This is important because customers rely on visual cues to make product decisions
The auto-closing accordions make it really hard to make a selection on mobile
/15 I'm almost done on the PDP but something big is missing
Reviews
Reviews are critical for helping customers choose
Even bad reviews are better than no reviews
Lots of good reviews are best
Reviews
Reviews are critical for helping customers choose
Even bad reviews are better than no reviews
Lots of good reviews are best
/16 Onward
I've selected my dish color and scent and I've also selected a subscription
There was a lot of information to unpack about the subscription, but they navigate it well
I add to cart
I've selected my dish color and scent and I've also selected a subscription
There was a lot of information to unpack about the subscription, but they navigate it well
I add to cart
/17 Again we're in this weird design where the most important information is squished to the right
The info I don't necessarily need (the cross-sell) is taking up most of the page
I'm all for distorting the design in a big way, just make sure it's benefiting the customer
The info I don't necessarily need (the cross-sell) is taking up most of the page
I'm all for distorting the design in a big way, just make sure it's benefiting the customer
/18 They corrected this on mobile
The cross-sells are at the bottom, below the most important info
The cross-sells are at the bottom, below the most important info
/19 My only option in the cart is to remove the body wash
I can't change my selections or add more bars
This is a miss - I just did all the work to get here, don't make me start all the way over if I want to change my scent
I can't change my selections or add more bars
This is a miss - I just did all the work to get here, don't make me start all the way over if I want to change my scent
/20 On second glance there is an "edit" button but it doesn't seem to work :(
/21 CTAs in the cart have to be super clear because now we're talking about the exchange of $$
Customers want to be able to review their purchase and double-check the address, etc.
"Complete Order" is misleading because what I'm actually about to do is...
Customers want to be able to review their purchase and double-check the address, etc.
"Complete Order" is misleading because what I'm actually about to do is...
/22 Add my shipping info
Which is a separate step from adding my credit card info
By combining these two steps you reduce clicks to purchase, which should always be the goal
Do this whenever possible
Which is a separate step from adding my credit card info
By combining these two steps you reduce clicks to purchase, which should always be the goal
Do this whenever possible
/23 Now I've made my selection, added my shipping address, and I'm ready to commit
The CTA is super clear
"Place my order"
It's important to be explicit when a card is going to be charged - they nailed it
The CTA is super clear
"Place my order"
It's important to be explicit when a card is going to be charged - they nailed it
/24 Yay - conversion complete! In conclusion:
- improve page speed
- remove prices from the nav
- tweak PDP design to reduce cognitive load
- add reviews on PDP
- remove "wizard" flow from choice selection on mobile
- combine shipping and cc info in cart
- fix cart "edit"
- improve page speed
- remove prices from the nav
- tweak PDP design to reduce cognitive load
- add reviews on PDP
- remove "wizard" flow from choice selection on mobile
- combine shipping and cc info in cart
- fix cart "edit"
/25 Note: This was one small piece of the customer journey and I'm sure there are more improvements to be made
I used to do this for a living, but it's been a while since I put my eCommerce merchant hat on - how'd I do?
That was fun
thank you @byhumankind
I used to do this for a living, but it's been a while since I put my eCommerce merchant hat on - how'd I do?
That was fun
thank you @byhumankind
Also - I'm going to do these more often
Let me know if there is a brand you think I should review!
Let me know if there is a brand you think I should review!
