How To Build A Checkout Page That Converts

To deliver a great shopping experience to online consumers, you have to be able to build a checkout page that is simple, easy to use, and is ultimately built with one thing in mind: conversions.

Nick Butler


Filed Under:


Nick Butler

Nick Butler

Ireland Website Design

Nick Butler is the founder of LearnRight, a whitelabel learning management system. He’s partial to a good whiskey (Irish, of course), a meat-filled BBQ, and a good hot tub session, not necessarily in that order.

woman with credit card looking at checkout screen on website
This content contains affiliate links. View our affiliate disclaimer.

With the impact of COVID-19 still resonating around the world, many traditional brick-and-mortar stores were forced to close their doors. Here in Ireland, our level 5 lockdown lasted for over 120 days – which meant that all ‘non-essential’ retailers without an online presence had no way of making any sales.  

If businesses wanted to survive, they had to get online and start selling. Companies began pumping money into their online presence and marketing efforts. 

With so many companies competing online, it became even more difficult to stand out for the average retailer, and online shoppers expect a lot more from their shopping experience than they did this time last year. 

One of the biggest user experience issues we’ve discovered when retailers approach us for help with their websites is their checkout pages. 

Customers expect a seamless checkout process. 

They want smooth sailing all the way from when they add an item to their basket to when they see an order confirmation email in their inbox. 

To deliver a great shopping experience to online consumers, you have to be able to build a checkout page that is simple, easy to use, and is ultimately built with one thing in mind: conversions.  

Today I’m going to run through five things you can do to create a smooth checkout process that will help any eCommerce business get more conversions on their online store.

1. Get the often-overlooked basics covered

There are a few super basic, but often overlooked, elements to cover on any of your clients’ checkout pages. 

The most obvious, but also one of the most necessary, components of a successful shopping cart page is to display an order summary

Letting consumers know exactly what they’re ordering before they finalize their purchase helps build trust. They feel more comfortable buying from a store that allows them to review their order, adding or removing items that they’ve since changed their mind on. 

Give them an order summary that includes:

  • The name of each item in their basket
  • An image of each item
  • The size, color, and price of each item (especially for clothes and shoes!)
  • Coupons or discounts (if used)
  • The total amount they have to pay

Always include a shipping calculator

One of the biggest turn-offs for online buyers is surprise charges. 56% of shoppers abandon carts due to hidden costs.

Personally, we like to add upfront shipping fees on the product pages of sites we create. 

At the very least, you want to add a shipping calculator on the order summary page so your customers can calculate the shipping cost before they move on. 

By making sure consumers can check their order before they checkout, you’ll also be able to prevent any mistakes due to customer error – meaning your clients have to deal with fewer returns. 

Make checkout pages mobile-friendly & user-friendly

You know it, I know it, but there are still plenty of developers out there who don’t optimize their checkout pages for mobile. 

If a client comes to you with an already-existing eCommerce website, make sure to check over their checkout page – it’s surprising how many are brutal to use on mobile. 

Keep checkouts to one page

The ideal checkout page, or at least the one that converts the best, only has one page. 1 out of 5 shoppers will abandon their cart if the checkout page is too long and complicated. 

Nobody wants to spend time filling out pages and pages of questions just for a pair of sweatpants, so don’t make checkout pages long and complex.

If you do need to have multiple pages during the checkout process then consider adding a progress bar. This shows your customers how many steps they have to finish before their order is completed. 

Back buttons are an absolute must 

Don’t get rid of the back button. Many shoppers will go back and add more items to their basket after checking their order summary. If they have to reload your client’s home page instead of just clicking ‘back’ they’ll get irritated. 

The back button is a sense of security for many customers, if they see it vanish then they might do the same and disappear from your checkout page. 

2. Keep customers on the same domain

If you’re directing customers away from one website to another they’re going to get confused fast. Not only will they be completely disoriented but they’ll also start to distrust the integrity of the shop they’re buying from. 

Customers like to do everything in one place so if your checkout page is on a different domain they’re immediately going to sense red flags and possibly click away. 

3. Use a chatbot

When you go into a store to buy a product you might have a load of questions to ask the shop assistant, but online you don’t really have this luxury unless there’s a chatbot installed. 

Having a chatbot on your website, and your checkout page, will help reassure customers of their purchasing decisions. 

Chatbots will be able to address any concerns they might have about products and remove any doubts about following through with an order. 

Live chat is also a great way to capture your customers’ contact details for future marketing opportunities. Some chatbots can even be programmed to offer your customers discounts if they’re considering backing out of a purchase. Don’t worry, they’re not going to give items away for free, instead, they offer built-in discounts of your choice. 

Some other uses for chatbots include:

  • Allowing customers to check delivery updates
  • Giving answers to commonly asked questions
  • Inform customers about discounts or sales
  • Offering add-ons before the purchase is completed

4. Don’t have a mandatory sign-up – keep it simple

People are incredibly wary of sharing their personal information online, especially when it comes to shopping. 

If they’ve been adding things to their cart and are eager to buy, but get stopped by an in-depth account sign-up page, they might leave the site altogether. 

People might like the products that are being sold, but signing up for an account with your client to buy them isn’t worth their time. 

Many eCommerce stores are pushing mandatory sign-ups on their customers, and it has drastic effects on their conversions. 30% of users will abandon their carts if asked to sign-up before checkout. 

You might want people to sign-up to your client’s website (it can be a great proof point of how good you’re doing, let’s be honest), but there are other ways to do it properly, and it’s not just before they’re checking out. 

Here are two ways you can get people to sign up without scaring them away from converting:

  1. Create a user account automatically when they sign up and send them a generated password in an email
  1. Allow guest checkout and ask them to sign up on the ‘Thank You’ page after they’ve already made a purchase

5. Take advantage of Google’s autofill

A complicated and cluttered form can scare consumers away quickly!

Nobody likes to fill out forms, even if it’s to purchase great products. 

You don’t want users to become frustrated near the end of their journey, so don’t make them fill out lengthy forms to purchase. Make it as easy as possible for them and only ask for the information that’s absolutely necessary for their purchase to go through. 

The best way to remove the stress of filling out forms is to take full advantage of Google’s autofill. 

Many users will be using Chrome or an Android phone to make purchases. The beauty of this is that Google will remember their name, address, and even their phone number from previous online purchases. 

If you use Google Autofill on your checkout page, your customers can fill out forms as smoothly as possible without even having to think about the information they’re providing you with.

6. Make the payment process easy (& trustworthy)

Your checkout page is the final stop for your customers and it’s an incredibly important one. 

People are extremely protective of their money (obviously), especially when it comes to ordering things online. They want to make sure that everything is easy, secure, and trustworthy, which is why they’ll be hesitant if payment is even a little bit tricky for them. 

By creating a simple, user-friendly payment process your customers will trust you more and be more likely to proceed with payment. 

You should also allow customers to pay using several different payment methods.

A lot of websites only offer one mode of payment which will lead to cart abandonment and unhappy customers – people can be pretty set in their ways when it comes to online payment processors. 

Offer multiple options for payment like:

  • Credit or debit card
  • Online wallets
  • PayPal
  • Stripe
  • Shopify Payments
  • Apple Pay
  • Google Pay

If your customer can choose exactly how they pay for the goods then they’ll feel more relaxed about buying from you. 

Don’t forget to highlight the benefits of buying with you to help solidify their decision to input their payment information. 

Remind them of benefits like:

  • Savings they’ve made this time
  • Free next-day delivery
  • Secure shopping (display trust seals and certifications)
  • 24/7 customer support and easy returns

You can also embed customer reviews and testimonials to ensure that customers know they’re buying from a trustworthy company. 

If your shopping cart or checkout page isn’t converting, you might be missing something vital. One of the best ways to diagnose checkout issues is third party user testing – sometimes it takes a real buyer to highlight things you may have missed. Hotjar is always a good choice, UserTesting is pretty popular, and then there’s The User Is Drunk too. 

Don’t let your clients lose out on conversions and customers with a checkout page that isn’t converting well. 

Share This Article!
Nick Butler

Nick Butler

Ireland Website Design

Nick Butler is the founder of LearnRight, a whitelabel learning management system. He’s partial to a good whiskey (Irish, of course), a meat-filled BBQ, and a good hot tub session, not necessarily in that order.

Come Join Us!

Join the #1 WordPress Community and dive into conversations covering every aspect of running an agency!

Kyle Van Deusen

Community Manager

The Friday Chaser

Wash down the week with the best of The Admin Bar! News, tips, and the best conversations delivered straight to your inbox every Friday!

Latest Events

July 12th, 2024

Vitality – Part 2: Largest Contentful Paint (LCP)

With Google's ever-evolving standards, mastering these metrics is not just nice-to-have, it's critical for every developer who wants a website that performs.

June 14th, 2024

Vitality – Part 1: Time to First Byte (TTFB)

With Google's ever-evolving standards, mastering these metrics is not just nice-to-have, it's critical for every developer who wants a website that performs.

May 24th, 2024

Mastering SMTP

This webinar has been carefully designed to turn the complex subject of WordPress email delivery into clear, actionable steps — specifically for the freelancer and agency owner delivering these services to clients.

More Articles

Stop Keyboard

Give It to Me Straight: Words to Avoid in Email for Better Communication

Want to communicate more directly & confidently – without sounding rude? Discover the top words & phrases to avoid in your emails, while still being polite.

5 Tips & Tools To Improve Your Typography B Log

Boost Responsiveness, Balance, & Accessibility with These Top Typography Tips!

Learn how just a few simple tools and tips can drastically improve your designs!


Understanding and Improving Time to First Byte (TTFB)

Learn how to improve Time to First Byte (TTFB) and boost your website’s speed with practical tips and strategies.