The final frontier in our series on mobile web design and usability for ecommerce — and likely the one you are most concerned about — is the checkout. Visitors that make it to your checkout show the clearest purchase intent, so the conversion is yours to lose if your checkout process is long, confusing, slow to load, broken or otherwise sub-optimal.
Today we’ll examine the factors that influence mobile checkout abandonment and how to craft your first checkout A/B test.
Page load speed
Remember that jaw-dropping research released by Forrester that 44% of web users will wait only a measly 2 seconds for a page to load before abandoning a site? Think mobile web users show a bit more mercy? Do you want to take a chance?
Fix these problems first and measure the before/after result for conversion rate. The data won’t be as perfect as with A/B testing (did I just say that? No analytics data is perfect), but you’ll likely see an upward trend. Even if nothing changes metrics-wise, you’ve done your customer a service.
Security and privacy
Consumers are worried about security regardless of what they are using to connect to the web. We’re afraid of what we don’t understand and most folks don’t know what makes a device, connection or website safe and secure. You have to overcommunicate that mobile shopping is safe with your site. You have to overcommunicate that mobile shopping is safe with your site (repeated for emphasis). But avoid jargon, most of your customers couldn’t define SSL, encryption, etc.
Asking for a customer’s digits? That may raise eyebrows. Link to a reason why you’re collecting a customer’s phone number and how it will be used.
While it may not impact your conversion rate in the short term, pre-checking email opt-in boxes is just as sneaky on mobile as on the desktop. Why not leave it unchecked and include another opt-in request in the purchase confirmation email and on the physical invoice with the shipment? (You can even create a custom URL to track sign up from packing slips).
The perceived difficulty of the checkout process has a major impact on cart abandonment. This is why many sites find an increase in conversion shrinking a 5 step process to 3, 2 or even one “step” (though the actual length of the checkout stays the same). The length of the first step tends to set the stage, users will make a judgement call by the length of your progress indicator (number of steps promised) and how daunting your “Billing Address” form appears.
Capturing email in the first step is an uber-best practice. Not only does it allow you to attempt to save the sale by emailing the cart contents and cart recovery link to the abandoner, it also makes for an easy-peasy lookin’ first step.
Form design and usability
Once you get past the major FUD, form design and usability takes over, such as…
Show clearly required fields
Mobile devices may be smaller or used in darker lighting so don’t rely on “required fields in bold” as I see many sites doing. Use the conventional red asterisk to denote required fields or a bright, bold color like Crate and Barrel:
Don’t ask for TMI
TMI, you know, “too much information.”
Of course, there are cases where extra fields are “untouchable” for one reason or another, but fields like “Title” (Mr. Mrs. Miss, etc) are really not necessary. Fields like naming an address profile for easy checkout next time have some value, but measure how many users actually take advantage of the fields, and if you have the freedom to do so, test the form without them.
Information for segmentation purposes can be asked after the checkout is complete (an optional form on the thank you page, for example).
Did I mention to overcommunicate the safety of shopping with your mobile site?
Not just at the beginning but also where the most anxiety is experienced (hint: credit card entry).
Call to action placement
Of course you want your call to action to be big, juicy, colorful, screaming “I’m over here, click me!” You knew that already. But make sure calls to action are not too close to other active links. I spotted this a number of times. Assume your customer has the biggest mitts known to man (or just terrible aim). Would he mistakenly hit a “back to Home” button?
When users flub their inputs for one reason or another, make it very obvious which fields had the error, and even better, what the error is.
Mention any password instructions such as “minimum 8 letters and 1 number.” I’m astounded how simple this is and how many sites don’t do it.
CVV huh? Explain it.
Don’t forget the staple checkout usability best practices like copy billing to shipping address (and vice versa) and showing your main countries at the top of a country selection drop down menu (unless you have a core customer base in Afghanistan, Algeria and Albania that is).
Saving the sale
Click-to-call (or should I say…tap-to-talk?) customer service is great. A bit tough to work live chat into a mobile checkout, so the presence of a visible and clickable phone number can also save sales.
Triggered cart recovery email
Got the email in the first step? Good! Fire away.
You will lose some impatient customers who won’t wait for checkout pages to load, and some who are not ready to buy, some who can’t find their credit card, some who fear their connection is insecure, others whose taxi just arrived, and so on, and so on. Many will be gone for good or will start from scratch on the web. A persistent cookie set for a reasonable amount of time (7 days) could save some, and for that, its worth it.
If your checkout misses some of the above, my first recommendation is to A/B test the existing checkout process pages against challenger that makes “all the fixes” – just to measure what you were leaving on the table before. But as I’ve mentioned the last 5 posts in this series, you can start with user testing to identify additional issues you may want to address in your first A/B test.
How user testers fare with your current checkout will also guide how you begin A/B testing. If your usability is fairly smooth you should forego the button-over-here and nix-this-field tweaks and jump right into a split path test – a variable that has a reputation for moving the needle for ecommerce sites. A split path test basically tests the number of steps in your checkout.
Once you determine which process works best, do a second round with a “radical redesign” and see if you can squeeze some more juice out of form field design, labels, instructions, buttons, etc.
If user tests revealed the worst – start with the radical redesign that makes as many “fixes” as you can. Then, you got it, split path test.
You don’t want to run test after test after test measuring incremental changes, especially since your mobile checkout traffic and conversions may be low. Aim for a bang-bang killer test in your first round.
Looking for help with mobile commerce strategy? Contact the Elastic Path consulting team at firstname.lastname@example.org to learn how our ecommerce strategy and mobile strategy services can improve your business results.