Shopping cart design best practices

Following are the shopping cart design best practices:

#1 Show thumbnail images of the products placed in the shopping cart

The objective of a shopping cart page is to preview the order before completing a purchase. 

Without thumbnail images, your customers may not know exactly what they are buying. This could result in placing a wrong order and request for refund/return down the line for you.

#2 Display ‘big’ thumbnail images of the products placed in the shopping cart

Just displaying a thumbnail image of the products added to the shopping cart is not enough. The image needs to be big enough to show the finer details (like size, color, model) of the product being added. A big image re-confirms your customers that they are placing the correct order.

If you are selling anything wearable (like clothes, jewelry, shoes, etc) where knowing the finer details of a product are very important then using large thumbnail images on the shopping cart page is a must.

#3 Use ‘clickable’ thumbnail images of the products added to the shopping cart

The thumbnail images on the cart page should be clickable so that your customers can easily go back to the product detail page to:

  • Look at the product details one more time before placing the order.
  • Change the order by changing the quantity and other product attributes like size, color, model, etc.

#4 Use clickable names of the products added to the shopping cart

The names of the products added to the shopping cart should be clickable so that your customers can easily go back to the product detail page to:

  • Look at the product details one more time before placing the order.
  • Change the order by changing the quantity and other product attributes like size, color, model, etc.
Get the 62 Point GA Checklist E-Book (50 Pages)

Get the E-Book (50 Pages)

Get the ebook on learning to read e-commerce reports (100+ Pages)

Get the E-Book (104 Pages)

#5 Clearly show the ‘price’, ‘quantity’ and ‘availability’ (in stock, out of stock) of each product added to the shopping cart

Product price, quantity, and availability all play an important role in re-confirming your customers that they are placing the correct order.

‘Availability’ feature is especially useful when your customers return back to their shopping cart after several days or weeks. You don’t want your customers to check out a product that is out of stock.

#6 Provide the ability to change the quantity of the product added to the shopping cart

If your customers can change the quantity of a product from the cart page without visiting the product detail page then it provides a good shopping experience which reduces friction and boosts sales.

#7 Provide the ability to remove a product from the shopping cart

Your customers must be able to remove a product from the cart page in case they changed their minds and don’t want to purchase it. If you do not provide such functionality then it could result in high checkout abandonment. 

#8 Show the cart subtotal on your shopping cart page

The subtotal shows the total price of the products added to your cart without shipping cost and/or taxes. It is just another way of re-confirming your customers that they are placing the correct order.

#9 Show the cart total on your shopping cart page

A cart total (or order total) shows the total price (including shipping cost and/or taxes) of the products added to the shopping cart. Whereas the subtotal shows the total price of the products without shipping cost and/or taxes. 

According to the study conducted by Statista.com the number 1 reason for checkout abandonment is hidden charges:

Any extra charge/ fees during the checkout process can immediately put off a visitor and can cause him to abandon the shopping cart straightaway. Therefore be upfront with your prices including shipping fees esp. when your shipping fees and/or taxes considerably increase the total size of the shopping cart.

Instead of just displaying subtotal on your cart page, whenever possible, also display the cart total. 

#10 Do not prominently display the coupon code field on your shopping cart page

When you prominently display a coupon code field on the cart page, you are encouraging your customers to leave the website and find the discount code. And when they leave the website there is no guarantee that they will return.

Minimize the size of the coupon code field. In this way, you are minimizing the magnitude of coupon code on your checkout process. You are making the use of coupon code trivial. 

#11 The cross-selling or upselling you are doing on the shopping cart page should make sense

Upselling is the practice of encouraging a customer to buy a higher-priced version of the product he is planning to buy. 

If a customer is planning to buy an iPhone 7, you recommend him iPhone 7 plus (which is a better but more expensive version of the iPhone).

Cross-selling is the practice of encouraging a customer to buy products that are related or complementary to the product he is planning to buy.

If a customer is planning to buy an iPhone 7, you recommend him to also buy an iPhone charger and iPhone case. 

If you are already doing cross-selling or up-selling on a shopping cart page then check the quality of the products’ recommendation. Do they make sense? 

#12 A/B test your cross-selling or upselling offers 

Cross-selling or upselling on a shopping cart page can both increase or decrease your website sales. 

It is important that you A/B test your cross-selling or upselling offers before you make it available for all website users.

#13 The content of your shopping cart should not expire after a certain time period

Ideally, your shopping cart content should never expire. This lets your customers continue shopping where they left off. It is good user experience.

#14 Remove any unnecessary element on the shopping cart page which takes a user away from the page

The objective of a cart page is to encourage users to checkout.

Any unnecessary web page element (like banner ads, Google AdSense, Email pop-up, etc) which takes a user away from the cart page creates a distraction and should be removed. 

Use the heatmap tool (like the one provided by hotjar.com) to determine whether certain elements on your page steal users’ attention from the ‘checkout’ button.

#15 Make sure the checkout button stand out on the cart page

The ‘checkout’ button is the most important element on a shopping cart page. 

Without the ‘checkout’ button, the cart page has no purpose. You want people who view their shopping cart to checkout. However, this is possible only when the ‘checkout’ button stands out on the page. For your ‘checkout’ button use a contrasting color and larger font. 

#16 Place the ‘checkout’ button above the fold

Above the fold refers to the upper half of a web page which is visible to website users without scrolling down the page. Since the ‘checkout’ button is the most important element on a cart page, it should be placed above the fold where the bulk of website visitors focus on. 

#17 Use two checkout buttons on the cart page, one above and one below the cart

The advantage of using the second checkout button below the cart is that when there are a lot of items in the shopping cart, it becomes easier for customers to checkout from the lower half of the cart page without scrolling all the way up.

Related Articles

  1. Schwartz five stages of awareness in marketing
  2. Product detail page design best practices
  3. Product images best practices for ecommerce websites
  4. Product pricing strategies for ecommerce websites
  5. Writing product descriptions that convert
  6. 12 ecommerce best practices for your category pages
  7. 25 web form design best practices – Optimizing forms for conversions
  8. Shopping cart design best practices
  9. Website navigation best practices
  10. Brand reputation audit to find conversion issues

Register for the FREE TRAINING...

"How to use Digital Analytics to generate floods of new Sales and Customers without spending years figuring everything out on your own."



Here’s what we’re going to cover in this training…

#1 Why digital analytics is the key to online business success.

​#2 The number 1 reason why most marketers are not able to scale their advertising and maximize sales.

#3 Why Google and Facebook ads don’t work for most businesses & how to make them work.

#4 ​Why you won’t get any competitive advantage in the marketplace just by knowing Google Analytics.

#5 The number 1 reason why conversion optimization is not working for your business.

#6 How to advertise on any marketing platform for FREE with an unlimited budget.

​#7 How to learn and master digital analytics and conversion optimization in record time.



   

My best selling books on Digital Analytics and Conversion Optimization

Maths and Stats for Web Analytics and Conversion Optimization
This expert guide will teach you how to leverage the knowledge of maths and statistics in order to accurately interpret data and take actions, which can quickly improve the bottom-line of your online business.

Master the Essentials of Email Marketing Analytics
This book focuses solely on the ‘analytics’ that power your email marketing optimization program and will help you dramatically reduce your cost per acquisition and increase marketing ROI by tracking the performance of the various KPIs and metrics used for email marketing.

Attribution Modelling in Google Analytics and Beyond
Attribution modelling is the process of determining the most effective marketing channels for investment. This book has been written to help you implement attribution modelling. It will teach you how to leverage the knowledge of attribution modelling in order to allocate marketing budget and understand buying behaviour.

Attribution Modelling in Google Ads and Facebook
This book has been written to help you implement attribution modelling in Google Ads (Google AdWords) and Facebook. It will teach you, how to leverage the knowledge of attribution modelling in order to understand the customer purchasing journey and determine the most effective marketing channels for investment.

Himanshu Sharma

Digital Marketing Consultant and Founder of Optimizesmart.com

Himanshu helps business owners and marketing professionals in generating more sales and ROI by fixing their website tracking issues, helping them understand their true customers' purchase journey and helping them determine the most effective marketing channels for investment.

He has over 12 years of experience in digital analytics and digital marketing.

He was nominated for the Digital Analytics Association's Awards for Excellence. The Digital Analytics Association is a world-renowned not-for-profit association that helps organisations overcome the challenges of data acquisition and application.

He is the author of four best-selling books on analytics and conversion optimization:

error: Alert: Content is protected !!