This is the first of a two-part series on mobile conversion and how to improve it. It’s based on thousands of user tests conducted by UserTesting, the leading usability testing service for mobile apps and websites.
If there’s a consensus about anything in the fast-changing mobile market, it’s the idea that mobile eCommerce conversions are lower than they are on personal computers.
Smartphones have the lowest conversion, but tablets are also generally seen as lower than computers.
For example, Monetate reported that conversion on personal computer websites is three times the rate on smartphones:
Monetate, Q4 2013
Other sources tell a similar story:
“It doesn’t matter which category your business is in, it’s highly likely that your mobile conversion rates are still below 1%, even with a smartphone-optimized site.“
–Mobify, February 2014
“Crate & Barrel reported a tablet conversion rate of 2.35% but a smartphone conversion rate of only 0.92% “
–Wired, February 2014
Why Doesn’t Mobile Convert?
Although we all agree that conversion is usually lower on mobile, there’s not a consensus on why it happens.
A common explanation is, “Smartphones are more of browse or research platform rather than a buy platform.” But that’s like saying an egg is round because it has no sharp corners: It describes the situation but doesn’t explain why it’s happening.
Another common explanation is that “only rich people use tablets.” In this idea, tablets convert at a higher rate because the rarefied group of tablet users spends more money on everything.
That may have been true at one time, but today tablets, smartphones, and personal computers are all mainstream devices in the developed world.
About 79% of American households have personal computers, 58% of Americans have smartphones, and 42% have tablets, according to Pew Internet and the US Census Bureau.
A third explanation is that smartphones are used on the go, when people don’t have time to shop. But if people weren’t shopping on mobile at all, there would be no web traffic from smartphones to commerce sites. But according to Forrester, up to 30% of traffic to major websites comes from mobile.
Also, people’s usage patterns would indicate that “on the go” is not even close to the only time when people are using their smart devices. entirely.
So what is it about mobile that discourages people from moving from research to purchase?
At UserTesting, we’ve been analyzing this problem for years. In thousands of user tests by e-tailers big and small. we see three recurring conversion problems:
- Some of the problem is inherent to mobile. There are indeed some features of mobile devices, especially smartphones, that discourage purchasing. But that’s not the dominant factor. Much more important are:
- The purchasing experience on mobile devices is poor, because we as an industry haven’t adapted our sites to the needs of mobile, and
- In many cases, mobile sales actually do convert, but our current tracking technologies don’t let us see it.
Let’s talk about why these things happen and what can be done to fix them.
Issue 1: Smartphone Features That Hurt Conversion
There are two limitations of mobile device hardware that interfere with purchase conversion. One is very obvious, but the other isn’t.
Screen Size Isn’t Optimal For Shopping
This is the obvious difference. Personal computers generally have much more screen real estate for displaying information, and that extra space benefits e-commerce. It’s much easier for computer users to view side by side comparisons of products.
They can easily see information that supports purchase, such as background information, reviews, and multiple images of products. And tools that help users navigate choices, such as filter buttons, are usually easy to find.
In contrast, the smaller screens of mobile devices make it impossible to display the same supporting information all at once. It’s harder for users to make product comparisons, supplemental information is often missing or hidden, and filtering tools are often limited.
As a result, users sometimes feel that they’re not getting enough information to complete a purchase.
In user tests, we find it’s common for people to get partway through the purchasing process on a smartphone, and then stop and say they’ll make the final purchase on a personal computer, where more information is available.
In fact, a 2012 study by Google titled “The New Multiscreen World: Understanding Consumer Cross-Platform Behavior” it was found that 65% of people start shopping on a smartphone & 61% will continue the shopping experience on the computer.
“I feel like there would be more product photos if I viewed the store on my PC, so I’ll wait and complete the purchase there.”
–Smartphone user, in a test session by UserTesting
Network Speed Makes For (Uncomfortably) Slow Shopping Experiences
This is the other characteristic of mobile devices that limits conversion. Most personal computers are connected through cables or wifi to high-speed wired network connections. In contrast, most smartphones connect through the cellular data network.
Although cellular network speeds have increased substantially in recent years, they’re not as fast as wired connections – and as we’ve noted before, speed matters a great deal to conversion rate optimization.
This Spring 2014 report by Radware shows that the majority of visitors will abandon a site after waiting 3 seconds for it to load. Previous research from Radware shows that 85% of visitors expect mobile devices to load as fast, if not faster, than their desktop counterparts.
It doesn’t help that mobile devices also have higher latency than wired connections, meaning that they can be slower to initially respond to network requests like loading a web page.
This is made worse, as Guy Podjarny discovered, that many mobile websites created through responsive design still download all or most of the desktop page payload, even if much of it is not displayed on screen.
The combination of latency, lower network speeds, and unnecessarily big downloads can make it slow to browse websites and make transactions on a smartphone. In our tests, these small delays accumulate and produce user frustration quickly.
Tablets vs. Smart Phones
The screen size and latency issues explain why tablet conversion hovers between that of smartphones and computers.
Tablets have more screen real estate than smartphones, letting users view more information at one time (although not as much as they can on a computer). And tablets frequently connect to the network through WiFi, giving them a faster and more responsive shopping experience.
So the more computer-like shopping experience on tablets leads to a more computer-like conversion rate.
But as the research by mobile ad company Flurry above indicates, how people use these devices is also very different.
What to do: Don’t give up. Faced with these built-in limits, it’s very tempting for a company to accept the lower mobile conversion rate as something that can’t be helped. Companies sometimes tell us they’ve made mobile a lower priority, shunting it off to a side team or starving it of resources.
That’s a big mistake, and one that is reminiscent of companies refusing to get online 20 years ago or the companies that refuse to accept that social media is a reality for many verticals.
According to Cisco, Mobile Traffic grew by 81% in 2013. Not only that but mobile traffic is now 18 times the size of the entire internet traffic from 2000.
Instead of making mobile some overworked teams side project, really take the time to investigate how your visitors use mobile & how you might be able to create an experience that fits in within their existing use patterns.
Our Tests Show There Are Workarounds To Help Overcome The Shortcomings Of Mobile.
For example, give a mobile user the option to view an item on the full version of a website. Although we don’t recommend forcing people to use a PC-formatted website on mobile (it frustrates users very quickly), giving them the option to do so feels like a service rather than an imposition.
If nothing else, it can reassure users they’re not missing important sales support information, making them more likely to go ahead with a mobile purchase.
If you’re creating a mobile commerce app, there are many things you can do to reduce perceived latency. For example, it’s often possible to pre-load information that users might ask for, allowing your app to display them without waiting for the network. Animation of buttons and other screen elements can sometimes be used to mask short delays while the network is accessed.
But more important than any particular fix, you need to understand that most mobile commerce problems are not caused by screen size or latency. Instead, they’re tied to subtle usability mistakes that companies often make in mobile commerce apps and websites.
Issue 2: Mobile Commerce Companies Make Usability Mistakes
Taking the fun out of shopping. The first, and biggest, mistake that we see companies make when designing for mobile commerce is that they try to shift customers from shopping to buying.
Shopping on a personal computer, when it’s implemented well, is seductive for many people. There are usually an enormous number of products to choose from, it’s easy to browse around, and years of design work have gone into creating a smooth, seamless shopping experience.
On mobile that process doesn’t just break down, it’s often mistakenly sabotaged by the vendor. In an effort to respond to smaller screens and slower connections, companies often try to strip down their mobile shopping experience to the basics. A particular focus is on enabling a purchase with a minimum number of taps. Here’s some typical industry advice:
“Research has shown that (mobile) conversion rates are directly impacted by streamlined paths to purchase—conversion should occur within three touch events. Two will be table stakes in the near future.”
There’s no question that minimizing taps is a good idea — after the customer has decided what to buy.
But we see many companies try to compress the whole shopping process into a small number of taps. The result is a mobile app or website that forces the user to make a quick purchase decision, rather than giving a great shopping experience. To the user it feels like the site switches from giving enticement to issuing demands.
Our research shows that the best results happen when a site or app adapts to where the user is in the decision process. Once someone decides what to buy, they should be able to do it with a minimal number of taps. But if someone is undecided, they should feel free to explore and compare.
Just look at what Greats.com does with the mobile version of their site (embedded site below is live)
That’s challenging to many companies because they want to create a single master site design for personal computers and then use responsive design to adapt it to mobile.
Our research suggests that conversion will be higher when the shopping process on mobile is rethought and tested from the bottom up, before a site design is locked in. That’s expensive and inconvenient for many companies, but as desktop traffic shifts to mobile it will be more and more necessary.
Designer Virgil Pana shows off these animations for an iPhone app that demonstrates both the fun & functionality of an engaging mobile experience.
Beyond that basic design issue, we also see a wide array of small usability problems in many commerce sites and apps.
Individually they don’t necessarily make a big difference, but each one eats away at conversion, and taken together they often make mobile commerce deeply irritating to users. Here are the most common mobile commerce flaws we see in our studies:
Confusing Terminology In Navigation Elements Leads To Frustration
Because the smartphone screen is so small, every word used in it needs to be carefully considered.
This is far more important in mobile than on the desktop, where there is more room for redundant information. Sometimes companies use terms to describe store departments and product types that are not necessarily understood by all users.
In the example below, a clothing company has chosen product categories that aren’t familiar to most people. In a test, a user asked to find boots was stopped dead by these menus.
The menu titles aren’t necessarily wrong, as long as the company is certain that its customers all understand them.
But this site would definitely be intimidating if the company wanted to reach beyond its core customers.
The lesson: know your target customers extremely well, and use their language, not your own.
Number Pad Isn’t Used When It’s Most Convenient
Entering any sort of data on a mobile device is a painful experience.
As a general rule, the more information you make people enter, the more of them will drop out of the buying process. This has led to well-publicized techniques to save taps, like asking the user to enter their zip code first in an address, and then auto-filling the city and state for them.
Another frequent mistake we see is the failure to use the number pad when asking a user to fill in numeric information.
The example below has a couple of problems in it. In the screen at left, the user is being asked to fill in the zip code after manually entering city and state. So the company already missed an opportunity to make life easier for the user.
This sort of inconsistency shows the company hasn’t thought systematically about mobile. In user tests, a mistake like this often produces extreme user irritation.
Untapable Items Confuse & Frustrate Mobile Users
Smartphone and tablet interfaces are built around the idea of direct manipulation. Any on-screen information that the user might want to modify can generally be tapped or swiped and edited in place.Mobile users come to expect this sort of interface.
Mobile commerce companies sometimes violate this principle by presenting static screens of information that can’t be tapped.
Instead, if users want to make a change, they are expected to use a back button or some other sort of navigation tool, the way they would a PC website. Mobile users often overlook nav buttons and become frustrated when tapping does nothing.
In the example below, taken from the checkout process of a mobile commerce site, the user is trying to edit her billing address. She repeatedly tapped the address and swiped up, down, left, and right, with no effect.
“How do I change my billing address?”
Image Sliders Kill Conversions, ESPECIALLY On Mobile Devices
Image carousels kill conversions.
But on mobile they present a bigger problem. In tests, we frequently see carousels whose images have been adapted from a PC website. The text is too small and the images are too crowded for easy viewing on a mobile device.
We also see many cases in which the developer uses a mobile carousel as a supplement to the site navigation. The company has some features of its PC site that won’t fit into the navigation scheme on a smaller screen, so they are bumped into the carousel.
This inevitably confuses customers who expect site navigation to be done through the site’s main menu.
PC Surprises
Although our research shows that it can be helpful to give mobile users the option of viewing an item in the PC version of a site, it’s not helpful to force people into a PC view with no alternative and no warning.
The result is usually alarm and frustration as the user struggles to read tiny text and pinch and zoom the page. It’s like a highway that suddenly switches from concrete pavement to gravel.
This is a common problem when a company relies on responsive design to reformat a PC site for use on mobile. Although responsive design is better than nothing, it should not be used blindly. You should always yourself ask whether a page should be completely redesigned rather than just rearranged.
In the example at right, the site does not have a mobile-formatted page for international shipping. But instead of dropping the user into that page unexpectedly, the feature is presented as a benefit while at the same time the user is warned that it’ll display as a computer-formatted page.
The lesson: It’s best to make sure all of your screens are rethought for mobile. If that’s not possible, at least warn people before you throw them onto the gravel.
Menu’s Make No Sense & Are Confusing To Navigate
It seems so logical: Most online stores are really a list of products, sorted by category. So why not have the user navigate through a set of hierarchical menus that list the categories?
Unfortunately, our tests show that people are rapidly confused by most menu systems that run more than two levels deep. Even relatively short menu lists can be intimidating if they contain unfamiliar terms.
In the example above, the consumer electronics site at left has attempted to arrange its offerings into a series of logical categories. The result is a labyrinth of related product terms that most users can’t navigate.
Contrast that menu structure to the one in the store at right. Arrows pointing up and down show whether a category is expanded (rather than the right-pointing arrow, which can lead some users to expect the screen to shift to the side).
In the left-hand example, the menus are a maze. In the right-hand example, the menus are like the elevators between floors in a department store. They don’t try to explain everything; they just move you between broad categories of goods.
Search & Filter Options Become Overwhelming, Redundant, Inaccurate & Confusing
One of the most difficult design tasks in mobile commerce is site navigation.
The relatively large screen size on a computer enables a site to display several different navigation tools at the time time (for example, a menu of departments and a set of filters can be displayed on the same screen). On mobile, those features are usually on different screens, and in our tests users often struggle to find them.
We also frequently see problems with wording. Often a developer will think the name it chose for a button or function is intuitive, but users do not understand it the same way. Or users will use the site’s search function to look for a particular term, and not find what they’re expecting because items in inventory have not been tagged that way.
Tommy’s already talked extensively about site search problems & effective site search design on desktop sites, but they’re magnified by the other restrictions of mobile devices.
For example, the site above has too many overlapping ways to navigate. There’s a search button at upper left (the magnifying glass), a “Shop” button, a “+” button next to Pants & Denim, a “Shop by…” button, and a “Sort By…” button.
In tests, users were flummoxed by these five choices. They might try one or two of them, but if they weren’t able to quickly find what they wanted, they just gave up.
It’s too bad really, because there’s a huge competitive advantage in mobile site search. According to this study by eConsultancy, only 7% of companies say that mobile site search is a top priority for them.
Yet, according to research by Google, 67% of customers are more likely to buy when a company has a mobile-friendly site.
One way to help with this problem is to carefully test your site to find the terms that people are most familiar with (for example, “filter” may be a better choice than “sort by”).
There’s also a good argument for combining several related functions into a single button, so there’s no risk of the user pushing the wrong one.
For example, we’ve seen mobile stores that combine filtering and sorting controls on a single screen, accessed through a button labeled “Filter.” Chances are very good that a user who wants to sort will push the Filter button anyway because it’s the only choice.
Conclusion
Those are the most common usability problems we see in mobile commerce, but every site, and every market, are different. There are an almost limitless number of small usability gotchas that need to be identified and gradually refined.
That process took years on the desktop, and there’s no reason to assume it’ll be any faster in mobile. You need to be patient, and test heavily to make sure you understand exactly where users are getting stuck, and why.
Testing is especially important if you’re making a mobile commerce app. App store reviews punish apps that aren’t excellent on day one. Rather than launching something adequate and then iterating, you need to launch something that’s great.
The only way to do that is to test heavily before you launch. In web development, the mantra is “release early and iterate.” In mobile, it’s “test and iterate before you release.”
Examples given in this article were reproduced with permission of the companies that funded the tests. Thanks to Bloomreach for sharing its results. Additional images were provided by other UserTesting clients who wish to remain anonymous. Part two of this article will talk about the frontiers of mobile commerce: trends we’re seeing in our tests that may fundamentally change not just mobile conversion, but e-commerce itself.