Creating the perfect eCommerce checkout process

Creating the perfect eCommerce checkout process

Wednesday, 26 August 2020

According to eMarketer, eCommerce sales will account for 27.5% of total retail sales for 2020, this is up from 21.8% in 2019. With the repercussions of the lockdowns from coronavirus, people have been forced for the first time to purchase online, and many are likely to repeat this process. Ecommerce will become even more important in generating sales for businesses, resulting in increased online competition and the need to stand out from your competitors. Competition has never been greater, especially if your product is not unique with distinct USPs. For a lot of businesses, Amazon is your main competitor, according to Inviqa, 59% of millennials will go straight to Amazon before any other website. In addition, the Baymard Institute estimates average cart abandonment to be running at 69.89%. It is vital that your website has an intuitive, UI and UX optimised experience ensuring that conversions are high, dropouts rare and customers don’t look elsewhere.

For this article, we are going to concentrate solely on the checkout process and assume that the website looks and works great and has been built by a reputable web design agency. Right let's dive in...

Common eCommerce checkout mistakes

Overcomplicated / too many steps – Keep it simple, you want customers to make purchases quickly and effortlessly from your website. The longer you make the process, the more likely your potential customers will abandon the purchasing process. Common mistakes include too many form fields to complete, creating unnecessary extra steps, poor UI.

Too many options – You obviously want to impress your website visitors, however, the main objective is to achieve a sale. Too often, you are nearing the end of the purchasing process and you are given additional options that can distract the end-user from completing the purchase. If someone has selected a product or service to buy, create a user interface and process that enables them to quickly make the purchase. No distraction!

No guest option – It is understandable that the majority of businesses want people to register so they can gain crucial marketing information, however, a lot of people don’t want to register. Trying to force them will cause customers to look elsewhere, I can testify to that personally. This can be backed up by research conducted by Invesp, 14% of shopping cart abandonment is due to no guest checkout option.

Asking for email address first – Do not start by demanding the email address first thing, this can be collected later on in the process. Let your potential customers add their product, then towards the end ask for their personal contact details. No one likes to feel they are being pushed to give information. Make it feel natural and intuitive. However, there is also the argument that by obtaining the email address first, if they abandon the checkout process, you have the ability to contact them to try and salvage the sale. An option would be to try both scenarios on your website and then using analysis to determine which way works best.

No auto-fill of billing address – This is a pretty simple script to add, why make potential customers have to complete another form? As stated previously, make it simple, easy and effortless. Any website that does not have this functionality must seriously look at their overall eCommerce UI and UX, it’s a no brainer.

No social media registration – By now you should see a consistent pattern and chain of thought with this article. The eCommerce checkout process needs to be made as simple as possible and caters to customers' needs. Some online purchasers will only use social media registration, according to CXL, 77% of users believe social media registration is a good solution!

Allow for feedback – Only ask for feedback once the online sale has been completed, adding additional tasks to the purchasing process will cost you orders. Once the sale has been made and gone through, there is nothing to be lost by asking for feedback. According to WPForms, 47% of purchasers will share feedback, this can be used to improve and perfect the checkout process even further.

Non-responsive checkout – Any eCommerce website built now should be responsive and optimised for mobile devices. If customers have to keep scrolling around a page and find it difficult to make a purchase you are going to lose customers. According to Apptive, 40% of mobile customers will go to a rival site if the website is not optimised for their device.

Slow page load time – Every second costs 7% conversion according to Baymond Institute. You can help improve the speed load time by adding the following, optimise caches, Ajax applied (see next point), optimise images, minimal scripting, use lightweight frameworks, minify unnecessary characters, 

No Ajax applied – Development teams need to apply Ajax, this will render directly on the mobile site without redirects.

Not secure / trust – This is one of the most obvious fundamentals any eCommerce checkout process must get right. The amount of times I have gone to make an online purchase and the website doesn’t even have an SSL. Who in their right mind would add their personal contact details as well as their banking information? The actual appearance of the site needs to create trust, when presented with a poorly built, shoddy looking website people will ‘walk’.  Some areas that need to be addressed include:

  • Use SSL certificates
  • Use a reputable hosting provider
  • Professional design
  • Endorsements
  • Reviews
  • Statistics

Poor UI and UX – By creating a hassle-free, intuitive cart checkout process you will undoubtedly improve your conversion rate. UI and UX needs to examine the entire process, from registration (or guest login) to payment confirmation. Analytics can be a great way to find out if you have any issues with the checkout process. All eCommerce websites should conduct user testing, I will write an additional blog on how to test website usability and will link from here once completed.

Lacking information – Another common mistake and yet again, so easily rectifiable. Consumers will not purchase a product until they have had all their concerns addressed, questions answered and fully appreciate what they are purchasing is correct. Too often simple information such as shipping times, guarantees, return policy, basic product information is missing or hidden in an obscure area. Make sure that your website contains all vital information and that it is easily obtainable.

Progress bar – Using a progress bar can show the consumer how close they are to achieving their purchase and where they are in the process, helping to keep them from abandonment. It also creates a feeling of achievement and feedback on how they are doing, according to the book ‘Rules of Play’, people like this. Progress bars don’t have to be boring, there are numerous ways you can use them:

  • Progress line horizontal and vertical with percentage completed
  • Animated using illustration complimenting your business, product or brand
  • A Loading bar, probably one of the most common types
  • Circular completion 360

Many well-known brands make use of this functionality including LinkedIn, Amazon, PrestaShop, Magento etc. 

Limited payment methods – There are numerous payment gateways, PayPal, Stripe, Skrill, Google Checkout, Apple Pay etc. There is no point trying to offer them all, however, offering just one solution can alienate your business from potential customers. In addition, some payment methods suit certain businesses and not others. When selecting your gateway, some points to cover include:

  • What are the signup fees and transaction fees?
  • Are they well known and will they help create confidence in your product?
  • Do you need to handle international payments?
  • Which credit cards do they accept? For example, Stripe accepts six and PayPal only accepts five.
  • Do they protect sellers from fraud?
  • How do they handle refunds for the customer?
  • Do they use a user-friendly format?
  • Do they provide excellent customer service?

Unexpected costs – This can be in the form of taxes, shipping, additional fees… I expect most people who shop online have experienced this, it is frustrating and annoying to be lumbered with additional costs that are hidden from you initially. According to Tyche, 44% of eCommerce cart abandonment is due to unexpected higher costs. Another tactic often used is hiding the cost of essential accompanying products. An example of this could be a power drill, you purchase the drill but then you need to purchase the lithium battery separately. Not only do people find this irritating, but it can also be deemed as devious and damage your brand. On a personal note, I despair when this occurs and immediately look elsewhere.

Errors – As covered previously, not only will errors cause usability issues, they will devalue confidence and trust in your website resulting in lost customers and sales.

Distractions – One of the main objectives of all eCommerce checkouts is to convert visitors into paying customers, this needs to be achieved as quickly and effortlessly as possible. Offering alternatives right at the end can lead to indecisiveness, if they have added a product to the shopping cart and want to pay, let them! You can offer similar products, others bought this, join our newsletter, write a review, share on social media once they have become a customer.

No form validation – Form validation checks to see if the form has been completed correctly by the user. It makes sure the email format is correct, the address is valid etc. Validation can help save a potential sale, if you have their incorrect contact information there is no way you can send a product or email their vouchers. As great as validation is, it is also important not to be too strict. For example, no spaces for phone numbers or date of birth year must be 2 or 4 digits. Try and accommodate your customers and be as lenient as possible.

No autosave option – Many people view this as an option for only long and tedious form completions. It can also be useful for simple checkouts. For example, someone is in the middle of a purchase and they have to leave due to unforeseen circumstances, with an autosave option they can come back to the form and complete at a later stage. This will require some user input and agreement though, you also need to decide if this is right for your business. If you are experiencing high abandonment, it could be one option to look at and review the success after a set period.

No clear customer support – This goes hand in hand with building trust in your product or service, purchasing online can be daunting for some people, especially if they are new to your business. If there is no obvious customer support, or you have bad customer support reviews people will look elsewhere. Make sure you make customers feel valued, secure and safe during the checkout process.

No free shipping - According to the Baymond Institute – 55% of abandonment is due to extra costs. Free shipping is not practical or even financially feasible for many businesses, however, a lot of potential customers expect it. Especially with the advent of such services as Amazon Prime, the expectation is often there and can lead to cart abandonment if it is not offered as part of the service.

At ID Studio we have some great experience designing eCommerce websites with effective and optimised checkout processes. If you would like to discuss your next eCommerce project or have any questions we would love to hear from you. Here is the checkout process for our client Mantriella, who are prefessional fashion designers: