Our 2+ year Mobile UX Study reveals that, since our first Mobile Study in 2013, the mobile user experience has generally improved for users.
Yet that isn’t to say that the mobile sites overall perform well for users. Testing also revealed both high-level issues users face, as well as more granular issues — all of which can, singly or in combination, lead to abandonment.
Indeed, during the 289 test user/site sessions we conducted for this study (think-aloud 1:1 moderated lab testing), the users encountered 2,597 mobile UX and usability issues — despite testing the mobile sites from leading online brands.
Our Mobile Benchmark Database contains 12,000+ mobile site elements that have been manually reviewed and scored by Baymard’s team of UX researchers (embedded below), with an additional 9,000+ best- and worst-practice examples from the top-grossing e-commerce sites in the US and Europe (performance verified).
In this article we’ll analyze this dataset to provide you with the current state of mobile UX, and outline 18 common mobile UX pitfalls and corresponding mobile e-commerce best practices.
The Current State of Mobile UX Design
For this analysis we’ve summarized the 12,000+ Mobile Usability Scores across 31 topics and plotted the 58 benchmarked mobile sites across these in the scatterplot above. Each dot, therefore, represents the summarized UX score of one site, across the guidelines within that respective topic of the mobile e-commerce experience.
The current mobile e-commerce UX performance is listed in the first row. The following rows are the UX performance breakdowns within 31 topics that constitute the overall mobile e-commerce performance.
The mobile e-commerce UX performance for the average top-grossing US and European e-commerce site is “mediocre”, with none of the 58 sites benchmarked having a “perfect” UX implementation and performance. This leaves nearly all sites in a tight cluster of 52% “mediocre” (or worse), and 48% “decent”.
That said, while there aren’t any standout performances, there are also very few “poor” or outright “broken” experiences.
In comparison, in most of the other e-commerce UX studies we’ve conducted at Baymard Institute the average UX performance also amounts to “mediocre”, but also tends to have a wider spread of variation and performance scores (see our overall E-Commerce UX benchmark).
The mobile UX benchmark shows that there’s ample room for improvements when looking within the specific topics of the mobile user experience — in particular the UX within Mobile Homepage, Mobile On-Site Search, Mobile Forms, and Mobile Sitewide Features & Elements.
These topics describe issues that many sites have, and also include some “missed opportunities” for the e-commerce industry as a whole.
Also, note that this is an analysis of the average performance across 58 top-grossing US and European e-commerce sites.
When analyzing a specific site there are nearly always a handful of critical UX issues, along with a larger collection of worthwhile improvements. This is the case even when we conduct UX audits for Fortune 500 companies.
In the following we’ll provide a more detailed walkthrough of the UX performance and competitive landscape within 4 topics of Mobile E-Commerce UX, along with “missed opportunities” to be extra alert to. As many issues identified on desktop sites tend to carry over to the mobile site as well, we will focus on issues observed in our research to be either unique or specific to the mobile experience, and point out additional platform agnostic areas of importance.
In particular, we’ll discuss 18 general mobile UX pitfalls, and corresponding best practices to be aware of for 4 of the 31 subtopics of Mobile UX:
These subtopics were chosen as they are the most interesting or the most suitable for discussion in an article.
(For a beginner’s introduction to UX, start with this UX design definition.)
Mobile Homepage
Benchmark UX PerformancesPOORMEDIOCREDECENTGOODPERFECT
Mobile Homepage
32 Guidelines71 Major E-Commerce SitesWHAT’S THIS?
Within Mobile Homepage, the average site performs between “mediocre” and “decent”.
Behind that average is a widespread distribution of performances, with 50% of sites performing either “mediocre” or “poorly”.
In particular, there are 2 issues sites get wrong when it comes to the Mobile Homepage.
1) 95% of Mobile Sites Place Ads in Primary Areas of the Mobile Homepage
“Did I click the right link? Oh, I did, sorry.” A user had just arrived at Walmart’s homepage but initially didn’t think he’d landed on Walmart’s site. The large internal promotion doesn’t help provide an overview of the site. Such ads are especially disorienting for users on mobile, where other sources of information scent are hidden (e.g., the main navigation).
Large ads on mobile will often cause minor-to-moderate interaction issues. Here on Macy’s, a user tried scrolling past an ad — which took up the entire space for main page content on the homepage when it first loaded (first image) — and accidentally swiped the carousel while scrolling (second image). Although this user quickly recovered, others had more trouble dismissing overlays (e.g., requiring multiple taps to close them) or even ended up offsite when, for example, attempting to back out of an “Install App” ad overlay.
