The Checkout Page: The Final Frontier

I rarely buy anything online anymore, as I miss the interactions I have when purchasing at brick and mortar stores. But as the holidays approach, I’ve become more active in eCommerce again and am saddened by so much of what I see. 

On Limited Supply, Nik Sharma would constantly talk about optimizing funnels and responding to customer questions and objections on your landing pages and product detail pages in order to get a prospect to convert. Has he been shouting into an abyss? Why are so many companies leaving dollars on the table because they haven’t thought about funnels? 

While I could go on about this starting at every stage in the funnel, let me focus on the final frontier: the checkout page. While other pages on your site talk about your product, this page has only one mission: to get a customer to enter his information with as little friction as  possible. 

And so many people aren’t focused on reducing friction here.

Let me give you a few examples:  

Here’s an example of a Shopify checkout form that could use some work. First, the box that asks you to sign up for offers should automatically be checked. In fact, I think if you’re going to show that box at all, you should do it at the final step near the “PAY NOW” or “COMPLETE CHECKOUT” button where it will get lost in the sea of approving the terms of service. That way, customers are more likely to leave it checked. 

Second, and far worse, in order to opt in to a text offer, you have to re-enter your phone number and click subscribe. Why are there two fields for phone numbers? Is anyone still entering a landline as their phone number, and then a mobile number for SMS texts? No - you should combine this into one field. 

Third, and this is a problem with Shopify’s checkout - if you have a different billing address than you do shipping address, you have to enter your billing name twice. Why do you have to do that? In fact, it gets worse in two ways. First, the fields are right next to each other. Imagine bubbling in your name on your SAT scantron, right after you just bubbled in your name. Why am I doing this twice you’d ask, annoyed and irritated? Second, best practice should dictate that either your FIRST NAME and LAST NAME are separate fields, or they are one field (FULL NAME). Most CRO agencies will tell you one field is better. Here, you literally have both options right next to each other. Shopify must know which does better across the billions of transactions they’ve completed, so why haven’t they fixed this? 

On Harry’s checkout page, the first field you are asked to fill out asks for your Full Name. They got the memo. Still, this is not what Harrys should be doing. You want to ask for the email address first, so that you can capture it in case someone abandons their cart. Imagine someone goes through that form and fills out everything except their email address. You have no way to contact them, and you just lost the customer forever. Instead, ask for an email address first, so if they abandon their cart after that, you can still email them. 

Conversely, Harrys does a great job asking for your payment information. All they ask for is your credit card information and zip code for your billing address. I’m not sure why other businesses ask for your name and street address when asking for billing information. When you run the card through the credit card processor, you can choose to verify the CCV and Zip code of the billing address, but you never verify the physical street address. The street number, street name, city, and state are all irrelevant in terms of whether the charge is approved. So why ask for information that we don’t need? 

I think all ecommerce brands should think about the following: 

  • Make as few fields as possible. 

    • There’s a term you learn in your first year of law school called res ipsa loquitur. It translates to “the thing speaks for itself”. The classic example of this involves two trains colliding. If two trains collide, there has been negligence. You don’t need any more information - the thing speaks for itself. Are you asking for the same information twice at checkout? If so, you’ve made a mistake. How do I know this? Res Ibsa Loquitur.

  • Google Maps API

    • Use Google Maps API to populate addresses. This wasn’t necessary in the days where most transactions happened on desktops, but today, where most happen on mobile phones, you want people to be able to enter their address easily. 

  • Links

    • There should be virtually no links to get off the checkout page. You finally have checkmated your customer into buying. Do you really want to give them an out? 

  • Color

    • You do have to have certain links - your terms of service and privacy policy - so that customers know what they are agreeing to. But make sure you use color so that customers know which way to go. That is, make the next step a different color than all links. Don’t do this

  • Address Verification

    • How many times have you tried to make a purchase but the system tries to update your address? “We suggest you don’t use 123 Main Street, but use 123 Main St.” it says. I never like this friction because it introduces an element that can allow the customer to abandon their cart. Instead, I’d prefer to verify their address after the purchase is made, so that you don’t introduce friction to checkout. 

  • Credit Card Only

    • Finally, I think someone (hopefully Shopify) introduces something where all you do is put in your email address and credit card information and get an email later to fill out the rest of your information. Imagine how many transactions get abandoned because a customer doesn’t want to fill in all the fields? Instead, just let me put in my payment information and email me, and when I get to my desktop or have more time, I’ll fill in my shipping  information. Is this crazy? Or genius?

Have any other CRO tips? Please drop me a line @moizali