Improve the shopping experience on your eCommerce store with the best UX practices.

Get useful pointers on e-commerce user experience, tablet interfaces, mobile UX, responsive design, holiday banners, email design and more.

Recent Posts

    • Data validation - Don’t wait until the user submits the form, validate and notify the user in real-time. Real-time inline validation will help your customers complete the checkout quickly with less effort and fewer errors. Make sure the notification is prominent enough that the user doesn't skip it.

      Single page checkout

    • Organize the checkout form - breakdown the checkout page into sections and keep the related items in close proximity.

      Single page checkout

    • Avoid asking unnecessary information - Single page checkout is meant to be quick and easy. So, avoid asking unnecessary information.

    Shipping and billing addresses will be the same for majority of the orders. Pre-fill the billing address details with shipping address instead of asking the user to do a redundant job.

    Single page checkout

    Show the zip code field and hide city and state. When the user inputs the zip code, expand the form with pre-filled city and state fields. Ensure these fields are editable.

    Single page checkout

    Single page checkout

    • Order summary in the right side area along with the call to action - pin this widget so that it follows the user when he scrolls down the checkout page.

      Single page checkout
  • One-page or express checkout: As the name implies, shipping information, delivery information, billing and payment details will all be in one page for easy access and to make the checkout process as quick as possible. Customers need not go back and forth between the steps.

    Single page checkout

  • Think of how you feel when you have to deal with a cashier in a brick-and-mortar store who takes a lot of time to bill your items or doesn’t know how to process your gift voucher. The more time it takes, the more frustrated you get. You are also far less likely to return. But in online stores, the more time it takes to complete the checkout, the more likely your shopper is to ABANDON the cart and less likely to return. So, design your checkout process in such a way that it is quick and easy to complete.

    Many shoppers have concerns about payment security. Reassure your shoppers that their data is safe by displaying your security credentials, customer care number and link to privacy policy.

    Don’t make your shoppers guess how many steps it takes to complete the checkout, keep them informed.

    Any small increase in the percentage of users who complete the checkout would have a direct impact in your revenue. So, keep you shoppers focussed. Ensure your main menu, cross sells or upsells etc, doesn’t distract your shoppers from completing the checkout.

    In short make your checkout process quick, easy, secure, informed and without any distractions.

  • Your shopper might buy for someone else or have to get the order approved by someone else. So make the approval process easier for them by providing an option to print or email the contents of the shopping cart.

    Allow to print the cart content

  • Use the shopping cart page to increase the cart size and the average order value by recommending personalized products or add-ons or simply sections such as customers who bought this also bought, top sellers or you might like. Test the placement, design, the products and the number of product suggestions shown.

    Cross-sell/upsell in shopping cart

  • Shoppers might abandon their cart if their preferred payment method is not accepted by you. Offer multiple payment options and show the different payment options that you accept on the cart page as it will increase the chances of your customers continuing with checkout and in turn reduce cart abandonment.

    Show different payment options in the cart page

  • You can reduce cart abandonment by creating urgency. Specify the number of units still available in stock if there are only few left. Or if you offer a deal on the products added to cart and that it ends in a day or two, then shout that out.

    Create urgency by specifying stock availability

    Create urgency with offers in the cart page

  • When on the cart page, you can persuade your shoppers to add more products to the cart by offering something. Say, if you offer free shipping or discount on orders above a certain amount, then you can remind your shoppers of how much more they need to spend to get that offer.

    Persuade your shoppers with offers

  • When possible add a gift wrapping option to purchases on your store and allow buyers to add a personal note to their gifts. Also, let the shopper choose whether or not to include the price information in the invoice during delivery.

    What if shoppers buy gifts for someone else?

  • If an user feels that they cannot afford the total cost of their order, they might remove a few items from the cart. Provide an option to save or move those products to a wishlist so that they don’t lose track of it. You could also remind them of the products in the wishlist the next time one of them is on the cart page.

    Allow shoppers to save items for later

  • Save the contents of an abandoned cart, just in case the shopper returns in a day or two. Specify on the cart page how long you will retain their selection. It is possible that they might forget their selection when they visit your website again. Greet the shopper with the old items added in the previous session along with changes in the price or availability so that the user will not be surprised to see unexpected items during checkout.

    Should you save the shopping carts?

  • Provide a clear text link to remove an item from cart and name it remove instead of delete. Also allow the user to set the quantity to zero to remove an item from cart. Once the user clicks the remove link, instead of removing the item immediately ask if the click was intentional.

    Let the shoppers easily remove items from cart

    Let the shoppers easily remove items from cart

  • Allow your customer to easily edit the quantity or the product options on the cart page itself without having to navigate to the product page. If inline editing is not allowed, then provide a quick look feature in the cart page so that the users don’t have to navigate to the product page to edit it.

    Allow the user to edit cart items

  • When a shopper adds an item to their cart don’t make them guess whether the item has been added or not, provide a prominent confirmation message. You can either provide the confirmation message on the same page or redirect them to the cart page. When you keep the shopper on the same page, provide product recommendations along with the confirmation message so that they can buy more.

    Notify when an item has been added to cart

    If most of your shoppers buy only one item at a time or if you sell high priced items, then redirect them to the cart/confirmation page after they add an item to cart.

    Notify when an item has been added to cart

  • If you ship to multiple countries or your shipping charges differ for different locations within the same country, then you definitely have to allow your customers to choose the shipping location or specify the zip code in the cart page so that they can calculate the shipping charges before proceeding to checkout. A simple pop-up that takes location input and a calculate button. If the user has already logged in, then fill the location with the default delivery address.

    Shipping calculator in shopping cart page