6 Smart Ways to Optimize Your eCommerce Site for Mobile Users

During 2017’s Thanksgiving weekend, more than half of visits to U.S. shopping sites — 52 percent — came from smartphones and tablets, according to Adobe Insights. It was the first time that Americans did more Black Friday shopping on mobile than on desktop.

Table of Contents

We can help
To learn more about , just reach out to us or schedule a demo. We are here to help.

During 2017’s Thanksgiving weekend, more than half of visits to U.S. shopping sites — 52 percent — came from smartphones and tablets, according to Adobe Insights. It was the first time that Americans did more Black Friday shopping on mobile than on desktop.

But that “shopping” would be more accurately called browsing because only 36 percent of actual purchases made online were done on mobile devices. Consumers still predominantly prefer to buy on desktop rather than on mobile. They like to look on their smartphones, but they jump on the desktop when it’s time to pull the trigger.

While mobile eCommerce is growing rapidly, brands still need to meet a multitude of conditions before convincing consumers to make a purchase on their handheld device. Here are some of the top ways to ensure that your online store is optimized to capture mobile sales.

Go Native

It’s not enough to have a “responsive” version of your desktop website. To be truly “mobile first,” you need to create a browsing and buying experience that is natively built for smartphone users and leverages its unique capabilities, such as swiping and geo-targeting.

Most designers start by building an online store for the desktop and then translate that experience for the smaller screen. This usually results in compromises in how products are displayed, discovered, and purchased. It also means the “mobile site” isn’t designed around the mindset of the highly impatient mobile user.

For example, when correctly engineered, payment and customer data (name, address, and phone number) can be enabled with a single tap on smartphones. But desktop-turned-mobile sites can rarely achieve this level of ease.

Support Both Browsing and Buying

Smartphone users usually arrive at an eCommerce site with one of two goals in mind: either they want to browse or they’re looking for something in particular (perhaps an item that was spotted in a physical store). Your mobile site should fully support both of these activities within the same environment. That can be challenging to pull off.

For consumers looking to browse, your site should have images of products that look good on a mobile screen. Product pages should display only the most essential information, with more detailed description a tap away. Swiping or tapping through the different categories of products should be super easy to do.

For users eager to find a particular product, don’t make them search for the search box. The search box should be highly visible and accessible at all times. Ideally, the site should enable predictive search results and “smart search,” a design feature which automatically fills the screen with the search box to make typing and viewing easier. Visitors should also be able to use search filters to drill down quickly to the specific product that they have in mind.

Nail the Mobile Navigation

As the above illustrates, the ease with which users navigate through your mobile site will make a big difference in your conversion rates. At the same time, you need to be highly efficient with your navigation links within the space-restricted mobile environment.

Your most important links will go into your header navigation bar. The trend these days is to use a “hamburger menu” to collapse product category links and other sub-pages such as settings, store locator, or contact info into an icon that looks like three short vertical bars. The hamburger menu will give your mobile site more room to display essential links in the header, which typically includes the search bar, the shopping cart, and the logo (which doubles as the homepage link).

But the hamburger menu can also lead to “menu stuffing,” or the bad habit of putting too many unnecessary links in the menu bar. To avoid this and the hamburger menu altogether (which still confuses many consumers), you can opt for a sticky bar that’s visible at all times, as Glossier has done with its mobile navigation. This requires organizing your product offerings in the most minimal but logical manner possible because you can only fit so many links in the navigation bar.

Many mobile sites also use icons rather than text to conserve space. Just make sure the icons you’re deploying are instantly recognizable so users know exactly what they’re clicking on.

Make It Lightning Fast

According to Google’s research, the average mobile landing page takes a whopping 22 seconds to load. Yet, the majority of users will leave a mobile page if it takes longer than 3 seconds to load. That discrepancy doesn’t bode well for your sales if your eCommerce site is slow to load.

We’ve written before about how slow site performance can hurt your eCommerce business. Site speed is even more crucial on mobile. Smartphone users have even less patience than desktop users. Mobile site performance should be at the very top of your priorities as an eCommerce business.

Enable Simpler Checkout Than You’d Think

Speaking of speed, the checkout experience on your eCommerce store should be as fast and seamless as you can make it. Two-thirds of shoppers abandon their online purchases on mobile devices due to poor checkout experiences, according to Harris Poll. You really want to remove as much friction as possible to decrease cart abandonment rates and increase conversions.

Here are some important ways to do this:

  • Offer multiple third-party payment options such as Apple Pay, Google Pay, Amazon Pay, etc.
  • Enable guest checkout
  • Keep mandatory fields to an absolute minimum
  • Stack fields in vertical rows and keep to one field per row
  • Break up the checkout process into multiple pages
  • Use a progress bar to keep users engaged
  • Keep to one prominent call-to-action button per page
  • Give users the option to “click-to-call” a customer service line so they can complete purchases with a live human instead
  • Enable auto-detect and auto-fill on forms (supported by Safari and Chrome)
  • Trigger numeric keyboard for credit card and phone number entries
  • Enable address finders so home and shipping addresses can be autofilled

Address Security Concerns

Security worries can be a big barrier for many mobile eCommerce customers. According to one study, nearly half of consumers believe that mobile devices are less safe than PCs and laptops when it comes to protecting their personal data.

Overcoming these concerns will lead to higher conversion rates. At a minimum, your online store should have an SSL security certificate. SSL creates an encrypted link between a server and a client, allowing sensitive information such as credit card numbers, Social Security numbers, and login credentials to be transmitted securely. Make sure your site displays the SSL padlock icon prominently.

Better yet, you can combine your SSL certificate with an Extended Validation Certificate (EV), a higher level of certification that allows brands to display a green address bar. Many consumers feel more comfortable giving over their information on sites with these green bars.

In the U.S., conversion rates on desktop eCommerce sites are three times as high as those on smartphone-specific sites (3.73% vs. 1.14%), according to Smart Insights. By taking into account all of the best practices mentioned here, your site will go a long ways toward encouraging customers to click the buy button while on their mobile devices.

Don't forget to share this post!

Keep Reading