The Customer Experience Experts

Retail E-commerce Usability Part 6: The Shopping Cart

Home / Blog / eCommerce Usability / Retail E-commerce Usability Part 6: The Shopping Cart

Retail E-commerce Usability Part 6: The Shopping Cart

Sometimes it’s a basket. Sometimes it’s a bag. Whatever you decide to call it, the online shopping cart is one component you do not want to underestimate! A great shopping cart can make or break a sale in the virtual world. On the web, there is no salesperson ushering the customer towards the register or post-dressing room with chatter, “Can I hold these at the front for you?”

Instead, there is usually a small icon or text link at the top right of the page that keeps track of the products that the customer is interested in purchasing. These virtual shopping carts (unfortunately) are easier to abandon than one a customer might fill up in person, after all it just takes one click to leave the site.

It’s easy to want to get creative when putting together your website, but there are some aspects that work best when kept simple. The shopping cart is one of them. Use industry standards to your advantage so users do not have to think twice when they are shopping on your site. The golden rule is that the shopping cart should always be intuitive, easy to access, easy to update, and drive customers to checkout. Here we will go over the basics of an ideal shopping cart.

The #1 DON’T OF THE E-COMMERCE SHOPPING CART:

DO NOT take the user to the shopping cart page each time they add an item. It is best to let the user control their shopping experience and provide assistance and ease of use throughout that process. Pushing users to the shopping cart page is kind of like a waiter giving you your bill while you are still eating your entrée.

Now let’s continue with 5 basic best practices of the retail e-commerce shopping cart!

1. Cart, Basket, or Bag?

  • Make life easier for your customers by providing an easy to read icon and text link in the top right section of your site for the shopping cart. If you are using just a text link, don’t be surprised if some users can’t find it. Don’t forget that not all customers are computer savvy and not all customers have 20/20 vision.

Here are some examples of shopping cart images out there on the web today along with some do’s and don’ts!


2. Link Your Cart!

  • Make the shopping cart a clickable link that leads the user to a place where they can view, edit and update their cart. Avoid using a logo of a cart that isn’t linked to the product information as this can easily frustrate the user. If you are using both text and images to signify the shopping cart, it is ideal to have both linked to the shopping cart page.

3. Add + It + Up

  • Each time a user adds an item to the shopping cart, confirm that the item has been added. The confirmation can be anything from a number signifier or something more elaborate like a dropdown that shows the product with the dollar amount, size, color, etc. The best e-commerce websites will allow users to preview the shopping cart without navigating away from the page they are currently on, as WalMart.com and Jcrew.com let you. After all, if you were shopping in a real store you would be able to peek into you cart at any time, not just at checkout! If you are going to enable a dropdown preview of the shopping cart for users here are a few tips on maximizing its usability.




4. The Next Steps

  • Close by the shopping cart link, it is ideal to include other information related to the shopping cart/checkout process to help the user find the next piece of information they are looking for.
    • Provide information about shipping and handling – If your site offers free shipping, it is a good idea to include it in this area because you know customers will already be attracted to this section of your website as they shop. Free shipping can encourage users to go through with the checkout process, as it leaves no questions about how much will be added to their total.
    • Checkout – Give the user a link to the checkout flow within the shopping cart dropdown menu and in the general area of the cart. After all, the point of your site is to get the user to purchase, meaning there should ALWAYS be a clear path to the checkout!

5. Shopping Cart Overview – One step away from Checkout!

  • The shopping cart overview should be similar to the layout of the dropdown menu for consistency sake. The item images and information should have the same or similar layout and the colors should also be consistent.
  • Make sizes, colors, quantities and stock availability easy to digest so the user can confirm that their order is correct and that they have chosen their items accordingly
  • Removing items from the shopping cart should require one click! Do not make users edit quantities down to zero in order for them to be removed from the cart.



While the majority of sites we looked at today are apparel websites, many of the same guidelines can be applied for all e-commerce websites. If you are in interested in learning more about how to improve other areas of your retail e-commerce site, please check out our other blog posts on retail e-commerce usability! Also, feel free to contact us if you are interested in finding out even more about how to improve your site.