Chapter 1
Buy from your own store before you change anything
Place a real order on your own store, on your own phone, paying with your own card, before you touch a setting. Not a test order with a bypass code. A real one, at a normal time of day, on the connection you would have on a train. Most owners have never done this since the store launched, and the first pass usually finds three or four things nobody knew were happening.
Do it four times, because the checkout is not one path. Buy as a brand new visitor with no account. Buy as a returning customer who is logged in. Buy with a wallet button rather than typing a card. And buy something that ships to a different country or region if you sell across borders. Each of those routes touches different code and different settings, and each of them breaks in its own way.
Record your screen while you do it and time each step. Count the taps from the cart to the confirmation. Count the fields you had to fill in. Note every moment you had to think, every moment something moved under your thumb, every message that told you something was wrong without telling you what.
Then write the path out as a list of steps with the number of taps and fields beside each one. This list is the whole project. Every chapter below is about removing an item from it. If your list runs to five screens and thirty taps, you already know why some carts do not turn into orders, and you can prioritise by which step costs the most for the least reason.
Also check the emails. Did the order confirmation arrive, and how fast. Was the sender address a real one people can reply to. Did anything land in spam. The checkout does not end at the payment button, and a receipt that never arrives generates support tickets and refund requests that look like a service problem when they are really a checkout problem.
- One real order, real card, own phone, normal connection
- Repeat as a guest, a logged in customer, a wallet payment and a cross border order
- Count taps and fields at every step and write them down
- Check the confirmation email arrives and can be replied to
Chapter 2
Fix the cart before the checkout, because that is where the surprises land
Most of what people call checkout abandonment happens on the cart, one step earlier, when the total finally appears with delivery added. Fix the cart first: it is usually fully under your control, while the checkout itself is often constrained by the platform.
The cart has to do four things. Confirm what is in it with a photo, the variant and the price, so nobody has to trust their memory. Show the delivery cost or the free shipping threshold, and how far away it is. Let people change quantity or remove an item without the page reloading and losing their place. And give one obvious way forward.
Delivery is the part that decides the outcome. If a buyer reaches the cart and sees a subtotal with no mention of postage, they have to guess, and a proportion of them will leave rather than find out. Either show the real number, calculated from a saved or estimated location, or show the threshold plainly. When there is a threshold, show the gap in money rather than as a bar with no label: you are eighteen dollars away from free delivery is clearer than a half filled progress bar.
Discount code boxes need thought. An empty code field is a prompt to go and look for a code, and the search often ends on someone else's page. If you run codes, keep the field small and late. If you rarely run them, take the field out of the cart and put it in the checkout where it belongs, or apply codes through links so buyers never see a box they cannot fill.
A cart drawer usually beats a separate cart page for stores where people buy more than one item, because it keeps the buyer where they were. If you use a drawer, make sure it is reachable, closes cleanly and does not trap the scroll on a phone.
One relevant add on can sit here. Something small, related and cheap next to what is already in the basket. Not a carousel of the whole catalogue.
- Photo, variant, price and quantity control for every line
- Delivery cost or the exact gap to free shipping, in money
- Quantity changes without a full page reload
- Keep the discount code field small, or move it out of the cart
Chapter 3
Let people buy without creating an account
Requiring an account before payment costs orders for no benefit that cannot be had another way. A first time buyer has no relationship with you yet, and asking them to invent a password to give you money is a poor trade. Turn guest checkout on and check that it is on, because this is a setting that gets changed by a theme update or an app install and nobody notices.
The reasons stores give for requiring accounts are usually solved elsewhere. You want the email address for marketing: you get that at checkout anyway, with consent, wherever the law allows it. You want order history for the customer: send it in the confirmation email with an order status link. You want repeat customers to check out faster: that is what saved payment details and wallet buttons do, and they do it without a password.
The better pattern is to offer the account after the order, on the thank you page, when the buyer has a reason to want one. Create an account to track this order and reorder in one tap converts far better than a wall in front of the payment button, because now there is something in it for them.
On Shopify, customer accounts can be set so they are not required at checkout, and there is a passwordless login option that emails a code instead of asking people to remember a password. On WooCommerce, guest checkout is a setting under the accounts and privacy options, and it is worth checking after any plugin update.
If you sell business to business, or you genuinely need approval before someone can order, that is a different case. Even then, split it: let the account application happen alongside a normal checkout rather than in front of it, so a returning buyer with an approved account is not held up by a form built for a first time applicant.
- Check guest checkout is on, then check again after theme or app updates
- Collect the email at checkout with consent instead of behind a wall
- Offer the account on the thank you page, where it helps the buyer
- Use passwordless login for returning customers
Chapter 4
Cut the form to the fields you actually need to ship
Every field is a chance to stop. Print your checkout form out, literally or in a document, and put a reason beside each field. Any field without a reason you would defend to a customer comes out.
The fields that survive that test are usually the same everywhere: email, name, address, and payment. A phone number belongs on the list only if your carrier genuinely needs it for delivery, and if so, say why beside the field. Company name, address line two, delivery instructions and date of birth are almost always optional, and optional fields should either be hidden behind a small link or removed.
Address autocomplete is the highest value single change in this chapter. It turns five or six fields into one, it reduces the failed deliveries that come from mistyped postcodes, and it works particularly well on phones where typing is the whole cost. Most platforms offer it natively or through an app.
Get the small things right and the form stops fighting the buyer. Use the correct input types so a phone shows a number pad for numbers and an email keyboard for email. Turn on autofill by using standard field names, so a saved address fills in one tap. Let the country selection drive which address fields appear, and use the local words for them, because a form asking for a state and a zip code in a country that has neither tells the buyer the store was not built for them.
Marketing consent belongs on the form, unticked where the law requires it, with a plain line saying what you will send. Buried consent produces a list that does not open your email and complaints that hurt your sending reputation, so it costs you twice.
Finally, do not ask for the same information twice. If the billing address matches the delivery address, tick that by default and let people untick it. Two full address forms in a row is the most avoidable friction in ecommerce.
- Write a reason beside every field, then delete the ones without one
- Turn on address autocomplete and standard autofill names
- Right keyboard for the right field on phones
- Local address labels for every country you sell to
- Billing matches delivery by default
Chapter 5
Offer the payment methods your buyers already have on their phone
The fastest checkout is the one where the buyer never types a card number. Wallet buttons pull the name, address and card from the phone in a couple of taps, which removes the entire form for the people who use them. Turn on the wallets your buyers actually carry and put them at the top of the checkout as well as in the cart.
Which methods matter depends on where you sell. Card and the major phone wallets cover most of North America, the United Kingdom and Australia. Buy now, pay later options matter more for higher value baskets and younger buyers. Bank transfer style methods and local schemes matter enormously in parts of Europe and Asia, and a buyer in a country whose normal payment method is missing will simply not complete. Look at your own orders by country and add what is missing where you have real volume, rather than turning on everything and cluttering the page.
Check the cost of each method against its lift. Instalment plans carry higher fees, which is worth it when they raise average order value or bring buyers you otherwise lose, and not worth it when they simply move existing orders onto a more expensive rail. Look at order value and repeat rate by payment method to see which it is for your store.
Declines deserve attention because they look like abandonment in your reports. Watch how many payments fail and why. Address checks set too strictly, a gateway rule blocking foreign cards, or a currency mismatch can quietly reject good orders. Your payment provider will show the decline reasons, and a fix there can add orders without any change to the page.
Show the accepted methods before the payment step, not only at it. A buyer deciding whether to bother filling in an address wants to know their method is there.
- Wallet buttons at the top of the cart and the checkout
- Add local methods only where your orders show real volume
- Compare order value and repeat rate by payment method
- Read the decline reasons from your payment provider every month
Chapter 6
Show every cost and the arrival date before the payment step
No number should appear for the first time on the last screen. Delivery, taxes, duties and any handling fee all need to be visible before the buyer starts entering payment details, because a total that grows at the last moment feels like a trick even when it is completely legitimate.
Delivery options should be readable as choices, not as codes. Standard, arrives Tuesday to Thursday, six dollars beats a line that says shipping method two. Give the date rather than the transit time wherever your system can calculate it, and make the free option obvious when the order qualifies. If you offer express, price it and date it so the buyer can decide whether the speed is worth the money.
Taxes need to match the buyer's expectation for their market. Shoppers in some countries expect prices shown with tax included and are startled when it is added at the end. Shoppers in others expect it to be added. Set your display to match the market you are selling into rather than the one you are sitting in.
Cross border orders need the duty position stated in words. Either duties are collected now so nothing is owed on delivery, or duties may be charged by the carrier on arrival. Both are acceptable. Silence is not, because the buyer who gets an unexpected bill will refuse the parcel, and you pay for the shipping twice and lose the customer.
If you charge anything else, a small order fee, a fuel surcharge, a card fee where it is permitted, put it in the same place with a name a person understands. Fees with internal names are the ones that generate support tickets.
The test for this whole chapter is simple. Between the cart total and the amount charged to the card, nothing should have appeared that the buyer did not already know about.
- Every cost visible before the payment details are entered
- Name delivery options by speed and date, not by internal code
- Match tax display to the market you are selling into
- State the duty position in plain words for cross border orders
Chapter 7
Make mistakes easy to fix instead of easy to make
Every error message is a moment where a buyer decides whether to carry on. Good error handling keeps people in the flow. Bad error handling sends them away with a card in their hand.
Validate as people type, not after they press pay. If a postcode is the wrong shape for the selected country, say so beside the field while the buyer is still looking at it. If a card number is a digit short, catch it before the payment attempt. Errors that surface only after a failed submission make people repeat work, and repeated work is where they give up.
Write errors as instructions. This card was declined by your bank, try another card or contact your bank tells someone what to do next. Payment failed, error 402 does not. Never blank the form on an error, and never clear the fields the buyer already filled in correctly. Losing an address you just typed on a phone is the point where most people close the tab.
Keep the error where the problem is. A red banner at the top of a long form on a phone is invisible to someone looking at a field halfway down. Put the message beside the field, scroll to it, and mark the field.
Protect the cart. If the session drops, the buyer comes back from an email, or they switch from phone to laptop, the cart should still be there. Persistent carts across devices for logged in customers, and a cart that survives a browser restart for everyone else, recover orders you would never even know you lost.
And handle the stock case honestly. If an item sells out between the cart and the payment, say which item, offer the rest of the order, and do not silently empty the basket. A buyer who is told clearly usually still buys the other things.
- Validate fields as they are typed, not after submission
- Write error text as an instruction, never as a code
- Put the message beside the field and never clear the form
- Keep carts alive across sessions and devices
Chapter 8
Put reassurance at the payment step, not in a badge wall
Reassurance works when it answers the specific worry a buyer has at that moment. At the payment step the worry is narrow: is this store real, what happens if the thing is wrong, and who do I contact. Answer those three and stop.
A row of unfamiliar security badges does not answer any of them, and a wall of logos can make a store look less credible rather than more. What does work is small, specific and true. The returns window in a sentence. A support email address or a phone number that a person answers. The name of the company and where it is based. The payment logos for the methods you actually accept, which double as a signal that the payment is being handled properly.
The padlock and the secure connection are the baseline, not a selling point. Every store has them. What buyers are looking for at this step is evidence that a human being is behind the store and that there is a way to reach them if the parcel does not turn up.
Keep the page free of anything that competes with the payment button. Popups, chat windows that open by themselves, exit offers and newsletter prompts all belong somewhere earlier in the journey, never on the payment step. A discount popup that appears while someone is entering their card number is a way of teaching them to leave and hunt for a code.
One exception is worth making. A small, relevant post payment offer, shown after the card is charged and accepted with one tap, does not risk the original order at all. That is a different mechanism from an upsell placed before payment, and it is the safer place to put one.
Finally, keep the visual design of the checkout the same as the rest of the store. A checkout that suddenly looks like a different website makes people check the address bar, and checking the address bar is a step away from finishing.
- Returns line, contact details and company name beat a badge wall
- No popups, exit offers or automatic chat on the payment step
- Keep the checkout looking like the rest of the store
- Put any extra offer after the payment is taken, not before
Chapter 9
Treat the thank you page as the last step of the checkout
The confirmation page is the most read page on your store and the most neglected. Every buyer sees it, at the exact moment they feel best about the purchase, and most stores use it to say thank you for your order and nothing else.
Start with the reassurance the buyer wants. What was ordered, what it cost, where it is going, when it should arrive, and how to reach you. Reduce the support tickets before they happen by answering the questions people email about: when will it ship, how do I track it, how do I change the address.
Then use the space for one thing that helps both sides. An account created in one tap, since the order details are already there. A referral offer for a friend. A request to join the list for delivery updates. A short question about how they found you, which gives you attribution information no analytics tool can give you cleanly. Pick one. A confirmation page carrying four calls to action achieves none of them.
This is also the right home for a post purchase offer if you run one. The payment has cleared, so nothing you show can cost you the original order. Keep it to one item, related to what they just bought, at a price that makes the extra shipping worth it for you.
Make sure the page fires your analytics and advertising conversion events correctly, once, with the real order value. This is the page that feeds every number you will use to judge your marketing, and a purchase event that double counts or misses refunds will send your ad platforms and your reporting in the wrong direction for months.
And check the order confirmation email carries the same information. Some buyers close the tab immediately, and the email becomes the only record they see.
- Order, cost, destination, arrival window and how to reach you
- One next action, not four
- Any post purchase offer goes here, after the payment clears
- Verify the purchase event fires once with the real order value
Chapter 10
Measure each step of the funnel, not just the final rate
A single checkout completion number tells you that you have a problem, not where it is. Break the journey into steps and measure the drop between each pair, because the fix is completely different depending on which gap is widest.
The steps worth counting are product page to add to cart, add to cart to cart view, cart to checkout started, checkout started to shipping details entered, shipping to payment entered, and payment entered to order placed. Most analytics setups can report those from the standard ecommerce events. A big drop between cart and checkout started points at delivery cost or the account wall. A big drop inside the checkout points at the form, the payment methods or errors.
Slice the same funnel by device and by country. Mobile and desktop often behave so differently that a blended number hides both stories, and a country where a common payment method is missing will show a distinctive collapse at the payment step. New versus returning customers is the third useful cut, because a form that returning buyers breeze through with autofill can be punishing for someone doing it for the first time.
Watch the technical numbers alongside the behavioural ones. Payment decline rate, error rate by field, and time to complete each step will explain drops that look like a change of mind but are actually a fault.
Keep a dated log of every change you make to the cart, the checkout, the shipping rates and the apps that touch them. Checkout numbers move for reasons outside your control, including a payment provider update or a promotion, and a log is the only way to tell your work apart from the noise.
Then recheck the whole path after every theme update, app install and shipping rate change. A checkout is not a project you finish. It is a piece of machinery that drifts, and buying from your own store once a month is the cheapest maintenance there is.
- Count the drop between each pair of steps, not just the final rate
- Split the funnel by device, country and new versus returning
- Track payment declines and field errors as part of the funnel
- Re-test the full path after every theme, app or shipping change
