Mobile Commerce Optimization Best Practices: From Landing Page to Checkout


Mobile shopping continues to break records. On Black Friday 2014, shoppers snuck their phones and tablets under the Thanksgiving table more than ever before to shop online. PayPal reported that online purchases on Black Friday resulted in a 62% increase in global mobile commerce volume. A few days later, Cyber Monday broke $2 billion in online sales, with mobile commerce increasing at 53%, a much faster rate than desktop commerce growth.

There are four interesting facts driving the current increase in popularity of mobile commerce.

  1. Viewing habits: People are spending more time on their phones than ever before –– at an average of three hours a day, which is more than they spend watching TV.
  2. Increased comfort: Consumers are — for the first time — spending nearly as much on mobile orders as they do on desktops, as a result of a growing sense of comfort with mobile shopping.
  3. Build it and they will come: Most of the major retailers now have mobile-optimized ecommerce apps and/or mobile-responsive shopping experiences.
  4. Reinforcing behavior: Most retailers are training customers to shop mobile with earlier access to deals and even better discounts than online or in-store offers.

So, how can you get in on the action? Lessons from retailers who already have mobile-optimized experiences can help the rest of us still on our way to the mobile commerce promised land. Below, a few takeaways from the retail industry leaders when it comes to mobile optimization and what is now being called m-commerce.

Ensure a Mobile-Optimized Experience

Don’t assume that your desktop website works just as well for mobile viewing. Pick up your phone and tablet and see how user-friendly your experience is. Google Developers has a mobile-friendly test you can take. Ask friends and colleagues to do the same. You can uncover many big issues with as little as 3 to 5 people.

If needed, look for a developer or platform-provider –– such as Bigcommerce –– to help you make your experience mobile-ready.*

Configure How You Optimize for Mobile

There are three ways to help configure your shopping and checkout to ensure the best possible experience for mobile shoppers:

  1. Responsive web design: Probably the simplest approach, your goal here is to build one website (that is, one URL, one set of HTML, etc.) that looks great no matter what device or size screen it’s viewed on. Tools used in responsive web design include fluid grid layouts for your pages, flexible images that resize and media queries that trigger different CSS style rules.
  2. Dynamic serving: This takes the above one step further by actually serving up two sets of code (essentially, two different websites) depending on the viewing device, for an even more mobile optimized experience. Your domain name (URL) stays the same.
  3. Mobile website: Mobile websites use a different domain name (and HTML) for mobile shoppers. If you’ve ever seen a URL like “,” you’re on a mobile site.

Each approach has its pros and cons, mainly with regard to development and maintenance costs and time. In general, for a small online business, responsive web design is the most cost and time-effective approach.

Mobile Experiences Aren’t Less Than, So Don’t Cut Out High Value Features

It’s tough to have a great mobile-optimized experience that has all of the functionality of your desktop version. You’ll have to make decisions about what features aren’t as important to include. For example, adapting your site might require you to drop Flash™ demos or other features that make your site appealing and enjoyable.

Just remember: mobile shoppers expect to be able to use nearly all of the same features as desktop shoppers, including access to high-value features including discount codes, shipping offers and return processing. In fact, you might want to reward your mobile customers and keep them coming back by offering unique mobile-only perks like special discounts and flash sales.

Checkouts Must Be Mobile-Optimized

One of the most important features of your mobile-friendly site is an easy-to-use checkout process. Create a mobile-friendly checkout experience with the following:

  • Ensure the “Add to Cart” and “Checkout” buttons, as well as your shopping cart icon, are easy to find and read. Place them at the top and bottom of every page, or on a sticky navigation bar, which sticks to the top of the screen when the customer scrolls down the page.
  • When a customer is researching a product, include all extra charges (shipping, tax, etc.) upfront to help ensure the shopper clicks through to the final conversion step.
  • Keep image use to a minimum because load time affects site abandonment. Or, ensure all of your photos are optimized for the web. You can do this in photoshop, or use one of these tools for jpeg or png optimization.
  • Use large buttons that can be tapped easily on a small screen.
  • The simpler the process and the less data entry required, the better the conversion rate. In short, fewer checkout steps mean fewer abandoned carts.
  • Ask for as little new information as possible from existing customers. They should be able to check out with just their username and password — don’t ask them to re-enter their credit card, shipping and billing information. PayPal’s payment processing, for example, does exactly that: customers log in with their PayPal credentials — and their payment and shipping information is already stored in their PayPal account. They just confirm the order and click “Buy Now.”

Know Your Audience

Finally, learn what you can about both your mobile and your desktop customers. You might be surprised to find out your mobile shoppers are unique and different than your traditional online customers. You might want to consider crafting an experience that’s more relevant to mobile shoppers. For example, changing what you sell, how you talk about your products and even how you design the shopping experience.

Pieces of this blog post were taken from Inc.’s byline by PayPal’s Dan Leberman: Mobile eCommerce is Here to Stay. Is Your Business Ready to Take Advantage?

*Links to the Google Developers and Bigcommerce sites are provided for informational purposes and in no way represents an endorsement or approval by PayPal Inc.

Disclaimer: These tips aim to promote ways for merchants to optimize their websites for mobile shoppers. The information it contains is offered as a guide only and should not be treated as a full statement on the subject.

The post Mobile Commerce Optimization Best Practices: From Landing Page to Checkout appeared first on The Bigcommerce Blog.