More than 50% of ecommerce traffic takes place on mobile.

That’s great news unless you’re among the ecommerce brands struggling to get mobile users to convert. It’s a challenge for many, with conversions on smartphones average less than half of desktop conversions.

Global desktop conversions averaged 3.63% while smartphone conversions were trailing at 1.25% (tablets came in at 3.14%) during the first quarter of 2017.

Consumers are actively searching, researching, and shopping but there are many things that force them to abandon their cart or bail before they ever click “add to cart”.

What makes users abandon their carts?

The short and sweet answer is “usability issues”. While that covers many of the causes for abandonment it’s not always usability that makes people wander. The top reasons for cart abandonment include:

• High or unexpected shipping costs
• Found a better price with a competitor
• Difficulty with navigation
• Didn’t want to create an account in order to make a purchase
• No shipping information available before checkout
• Concerned about site or payment security
• Complicated or lengthy checkout processes
• Site or checkout was slow to load
• Couldn’t find a coupon/discount voucher
• Customer was only browsing
• Distracted during the checkout process

The Top Mobile Checkout Elements to Check First

1. Making crucial elements difficult to tap

While a mouse can reach anywhere when shopping on desktop, roughly half of consumers browse on smartphones using their thumb. As the size of the screen/device increases, the “thumb zone” (the area comfortably in reach of the thumb) decreases.

Modify your checkout elements including buttons, navigation, and next-step actions so they fit inside of this natural comfort zone.

Here’s an example of a poorly optimized mobile checkout from GNC. Note the clutter requiring you to search for a next-step CTA to continue the checkout process.

And here’s an example a great mobile checkout improvement, perfectly streamlined to move the customer through to completing the sale.

2. Your header takes up too much real estate

Branding is important, but not so important that you want it to interfere with the checkout process. Your header including your navigation and logo should be minimized to allow for maximum visibility of critical checkout elements.

3. Clunky mobile checkout forms

Typing is always going to be a bit of a headache on mobile devices.

The moment you require input from the customer you lose anywhere from 30-50% of the screen due to the keyboard.

Rather than creating a long checkout form typically seen on desktop, break the process up into a multi-step process or reduce the number of form fields you need.

Lastly, design your fields with mobile in mind:

• Place labels above fields or use floating labels

• Use full-width labels that stretch to the edge of the screen so the fields can be easily tapped with either the left or the right hand.
• Include support for auto-fill to minimize text entry. When text entry is necessary then match the keyboard. For example: use the numerical keyboard for credit cards and phone numbers.
• Be sure to make text fields tall/high enough that they can be easily tapped, with enough space between one another so the wrong field isn’t selected.
• Use tabindex to support easily skipping from one field to another.

4. Progress bar isn’t visible during checkout

For multi-page checkouts you should always feature a progress indicator that is in clear view and above the fold. It’s a good practice to have this occupy the space where a normal headline might live.

5. Excruciatingly slow checkout

A delay of just 1 second during page load can reduce conversions by as much as 7%.

Focus on improving the mobile checkout experience by reducing or removing unnecessary elements:

• Graphics should be stored/cached on a content delivery network
• Remove extra scripts, like social scripts, from the checkout
• Shift scripts to load last whenever possible
• Eliminate graphic intensive elements

6. Making guest checkout difficult

Forcing customers to register is a major frustration when someone just wants to complete a purchase and move on. They may even perceive this as your intention if you put a registration option above a guest checkout option.

Home Depot’s mobile checkout is a perfect example of how to lead with the guest checkout.

You can always offer them the option at the tail end of the checkout to tick a box allowing them to save their information and register. At this point they’ve already entered their information and they can ignore the option if they aren’t interested.

7. Not accounting for cross-device checkout

1 in 3 customers are switching devices in the middle of their shopping or checkout experience.

They may add products to their cart on mobile and then complete the purchase on a tablet or desktop – even several days later.

And those cross-device consumers convert at 1.4x the rate of single-device users.

Make the cart persist for at least 7 days (and as much as 30 days) to make it easy for guests to return to their purchase.

8. Unfocused checkout CTA

The purpose of the checkout is to get the customer to convert. Once they complete the shopping experience and move on to checkout there is no reason to carry standard site navigation over into the checkout process.

Additional navigation, links, buttons, and visual elements can distract the customer from completing the purchase. The last thing you want them to do is back out of the checkout.

Be mindful of footer content which can also create distractions and exit points during checkout. If it doesn’t contribute to the end goal of conversion then suppress or remove it.

9. Correcting mistakes is tedious

Any kind of form correction will add friction during mobile checkout. If a customer needs to correct billing, shipping, or product information once they reach the end of the checkout you should make it as easy as possible to correct info.

10. Lacking trust signals through the shopping and checkout

Payment security is a leading cause of abandonment. Customers want to know they’re making a safe purchase from a reputable merchant who will protect their personal information.

Trust goes much deeper though. Customers want to avoid buyer’s remorse. They want to buy with confidence and they want to know that if there’s a problem that you’ll take care of their issue.

The green padlock is a widely identifiable trust signal for mobile users shopping online.

Conclusion

Use the 10 points above as your starting point.

Make incremental changes and then test, monitor, and analyze the results. That’s the best way to ensure the usability and persuasive improvements you’ve made are creating a lift or upward trend specifically with your mobile audience.

10 Elements of Your Mobile Checkout That Need Improvement

PS. Also, provide as many payment options as possible on mobile. Apple Pay, PayPal, Amazon, etc. You’ll see an increase in conversions, practically guaranteed.