Our latest industry benchmarking analysis confirms a mobile-first trend in many sectors, including fashion, retail and beauty, where smartphones account for approximately two-thirds of all traffic (64% for fashion, 63% for cosmetics and 62.3% for pharmaceuticals).
But what we also surfaced from our survey of 2.1 billion site visits is that mobile conversions are not following suit. In the fashion sector, for example, the mobile conversion rate still stagnates around 1.3% — half of the average desktop conversion rate, which averages in at 2.6%. This meager conversion gap also exists in the beauty sector, and even in the many other industries where the traffic gap between mobile and desktop is not so wide.
Despite mobile making great strides in terms of traffic, the data on conversions suggests that smartphone customer experience (CX) is falling short of consumer demands. Clearly, consumers are keen on connecting with brands, products and services by using their phones, but something in the mobile experience is stopping them in their tracks.
In order for users to become immersed in your brand, the navigation on mobile must be optimized for it to be seamless and intuitive. As such, brands should aim for more meaningful visitor sessions — ones that can inspire conversions and nurture customer loyalty, future visits and possible conversions.
A granular analysis of customer behavior will shine a light on areas of friction in the customer experience, and flag pages and in-page elements that need improving. This article delves into 3 mobile UX design best practices and their affiliated tips to assure an optimized mobile user experience.
Use Images Sparingly on Mobile
Humans are visual beings. Much of how we consume information and entertainment involves the use of imagery. But images can pose considerable damage to mobile user experience. That’s why you need to heed best practices to avoid a bad mobile UX.
Firstly, there is a smaller screen on mobile, so images carry a larger weight. As such, their implementation is trickier on these devices. They have to be large enough to be seen in a way that clearly and easily conveys their contents, but not so large as to require scrolling.
Make sure your images do not cause any loading delays; images are the primary cause of slow page load times and the problem is compounded on mobile. Slow load times bog down your website speed, which in turn negatively affects SEO and triggers impatience, a telling sign of a bad UX.
That’s where you have to consult your server. Make sure it has the proper speed and correct updates, so that images never set back your mobile site or app. A good server is able to distinguish which devices your visitors are accessing your content from — desktop or mobile.
Graphic designers must use the right coding so there are no issues with the general view of the image. Pay close attention to image sizing; there are recommendations on standard image sizes as they relate to pixels and the like.
The Typography Must Be Lucid & Minimal
The typography, i.e., textual style of a website, is a crucial component of the UX. Most of the information we imbue comes from reading, so the typography must be presented in an easy-to-read way.
Although the text must be large enough to see without incurring any squinting, you should steer clear of using large fonts, since mobile screens are much smaller. Otherwise, large letters would block other parts of the page from view, forcing users to constantly scroll around to find anything. But don’t settle for small fonts either — you wouldn’t want to worsen the user experience by making your visitors constantly zoom in/ squint.
So how do you determine a happy medium? The key is to keep the text in proportion to the page and screen size. Jason Pamental of H+W Design has formulated a method that maps out the correct proportions of the text (including the body copy, H2s, H3s, etc.), the line-height and characters.
Implementing Sticky Elements
Sticky elements are often those that visitors rely on most; when these elements are not in immediate view or access, it can easily irritate them. As such, you should implement sticky elements for a more convenient mobile user experience that provides a component of seamlessness.
You may have heard of the sticky search bar, but, although a sticky search bar is valuable for desktop, it is inconvenient for a good mobile UX, as it takes up a lot of space. Since it is inopportune for user experience on mobile, you’ll need to opt for another element.
In place of a sticky search bar, add a search icon at the top navigation, or provide the search function within the hamburger menu. The former is a better option, since it renders instant visibility of the icon.
Closing Off on Mobile User Experience Improvements
These 3 tips offer clever ways to boost your mobile user experience. Consider each of them and their multifaceted teachings to capture more site visits. But it shouldn’t end here; there are plenty of other ways to optimize mobile UX, no matter how small or distinct.
Keep this in mind: in each instance of changing your mobile experience, determine if the change will contribute to a pleasant experience for users. Most importantly, use data as your armor; it’ll show you in plain terms what makes for a good or bad mobile experience.
For more information on UX optimization on mobile, download our 2019 Mobile Report.