Here’s a riddle for you. What’s 5-inches tall and transforming the way we shop online?
It’s your smartphone.
Mobile is the fastest growing segment of online shoppers in the world. If you haven’t yet taken advantage of mobile shoppers, it’s time to give your eCommerce site a long overdue mobile awakening.
In this post we’ll discuss eCommerce mobile design, including key design elements, choosing the right platform for design and looking at sites that nail it in the mobile eCommerce department.
Has This Happened To You?
I’m waiting in the dentist office and I remember that I forgot to order my cousin a gift for her baby shower. Shoot, shoot, shoot!
I remember the name of a woman that makes sustainable swaddle blankets that I discovered on a blog. I Google it and the site instantly pops up. But it’s asking me to log in. I don’t have a log in! I finally create an account so I can use the site.
Now the products are loading. And loading.
Still loading.
I pride myself on having patience, but with the looming dentist chair and a slow website, I’m starting to feel a bit anxious.
After a few more refreshes on my phone, I close out of the window, hit up Amazon and order a gift within minutes.
If only their site had a mobile optimized website. She would have made a sale and I would have saved myself a headache.
Sound familiar?
It’s not surprising that I abandoned ship. According to Mobify, a whopping 30% of mobile shoppers abandon a site that isn’t mobile optimized.
That’s a lot of missed opportunities. But who’s using mobile, really?
Well, almost everyone.
Mobile Users are Everywhere
If you’re one of the non-believers about the growth of mobile, take a look at these cold hard facts.
- More than $1 billion in products were purchased on Amazon on a mobile device last year.
- 73% of U.S. mobile Internet users used Amazon via browsers or apps in Q4 2013.
- Mobile devices will account for 30% of global retail e-commerce spending by 2018, up from 15 percent in 2013.
- “Cyber Monday” in 2013 saw retail sales via mobile and tablets approach $400 million in the U.S. alone.
- 80% of mobile users’ purchasing decisions are influenced by the mobile channel, even if that’s not where they make their final purchase.(Source: CMO.com)
Mobile shopping isn’t just alive and well—it’s growing at a rapid, steady pace.
Here’s how to make sure you don’t get left behind.
Throw Out Everything You Know About Design
Before you can rework your desktop site to create a mobile site, you’ve got to do a little work behind the scenes.
Re-Think Your Keyword Research
The same keywords that are driving people to your desktop site may not be the same keywords that drive them to mobile.
Earlier this year, Google rolled out a new keyword planner that allows you to search by device so you can see if your crucial keywords are being searched for more on mobile. You also want to think about how a customer might be finding you on a mobile site differently, for example, using terms like “nearby” or being more location specific.
Pick a Platform
There are a variety of ways you can create a mobile optimized eCommerce site, from using a responsive theme to hiring a professional developer to create a mobile specific site. We’ll take a deeper look at your options later on in this post.
Pare It Down
Your product descriptions will be shorter, your navigation will be easier, your CTA’s will be sized to fit a finger, not a tiny arrow. Creating a mobile site is a great lesson in thinking about only the most necessary elements your customer needs to find what they need to shop.
And perhaps most importantly…
Make It Easy to Buy
A clunky experience while browsing on your phone isn’t going to win you any customers or sales. Here are a few things to remember, whether you’re designing the site yourself or hiring it out.
Load time:
73% of mobile users report encountering a website that was too slow to load, according to KISSMetrics. Don’t be one of the slow pokes. Compress large images, remove players like Flash that don’t work on mobile and test your site’s page load time using Google’s Page Load Tool.
Navigation:
Design as if you’re the user. Make sure your navigation is big enough for an adult finger to navigate. There’s nothing worse than super small links that are impossible to select. Same goes for any CTA – you want “Shop now” or “Buy” to be easy to click.
Click-to-call:
If someone is looking at your site from a phone, they should be able to use it to make calls too. Implementing this gives a potential customer the opportunity to call right from your site.
Check out:
Give users the option to log-in under their own account or to simply proceed as a guest. And make sure your mobile payment system offers an option to checkout without having to enter loads of personal information and long, cumbersome credit card numbers. PayPal seems to be the best option currently, though we may see an uptick with Apple Pay in the future.
Pick Your Mobile Platform
Here comes the hard part. Your checklist of features can be as long or as short as you’d like it to be, but deciding what route to take can be tricky. We’ve broken it down into two options: responsive sites versus dedicated, mobile specific sites.
Responsive Is Awesome
Responsive is tantalizing. If you design a responsive site, it means your site will adapt across all devices in a digestible, readable way using one codebase. This is a huge benefit for a company that wants to adapt to the mobile market, but doesn’t have the extra time or resources to manage multiple websites or platforms.
Plus, Google recommends you use it. And when Google says “Jump”, we say “How high?!”
“We have seen that approximately 23% of mobile website traffic is due to a product search from Google. If you don’t know that, you will lose a lot of customers going back to Google, because they have not found the right product,” warns Andrea Anderheggen, founder and CEO of Shopgate, a SaaS system that helps merchants increase mobile revenues and create mobile websites and custom apps.
If you use responsive design, your site will rank just as well as a separate mobile and desktop eCommerce site.
But just because the end result is streamlined and simple in theory, that doesn’t mean a responsive site is necessarily the easier route. It still takes time to create.
Responsive isn’t the best route if you have an information-heavy site. Since the site adapts to each device on its own, a site that relies on deep details for product pages and categories can still be a less than stellar experience for customers. If your eCommerce site requires a lot of information for customers, you might want to create a separate mobile site.
Responsive Is Overrated
Responsive sure sounds amazing. “The promise is to get one code for all devices,” says Anderheggen. “However, we see it as more of a first step. It does not deliver the results you can fully achieve with mobile.”
One of the major cases against responsive is conversion. “Responsive may increase conversion by up to 3 times compared to non-optimized sites. But a dedicated mobile website and native apps to match all customer preferences increases the conversion rate by up to 12 times!”
A dedicated mobile specific site performs better because it is being built specifically for mobile users, not just adapting to mobile users.
Simply put, 1 out of every 1000 visitors may buy something on a non-optimized website. On responsive sites, 1 out of every 250 visitors may order a product. A dedicated mobile strategy can bring this figure up to 1 in 60 – 4 times better than responsive and a staggering 15x better than non-optimized websites, according to a study published from Shopgate.
A dedicated mobile commerce strategy does 200-300% better than the averages from responsive or mobile templates while additionally offering a superior design.
Hiring custom developers for a mobile specific site can be pricey. But Anderheggen insists it’s worth the initial investment.
“It may sound like responsive allows you to save. But that’s not true for two main reasons. It’s quite some work to set it up, especially if your site is not static and includes many features. When you look at your mobile site design over time, it’s actually even more work to keep the site responsive over time when adding new features. In fact, we’ve seen in our own experiments and on our own website that responsive can increase development time three times over.”
If you hire a developer, consider time-to-market and development costs to get your mobile-specific site up and running. Depending on how in-depth you decide to make your site, it can take a long time to get it right. Which means it could take a lot of moolah to get it right too.
“If merchants want to develop for all of the six currently relevant platforms, it may take well over one year with a team of at least 3-5 developers,” says Anderheggen.
Maintenance costs will also be higher because it’s not about one platform, but up to about 6, if you decided to get the full potential of mobile. “And the devices are changing very rapidly,” points out Anderheggen.
The bottom line:
Go with what your budget can realistically allow. Any mobile site is better than no mobile site in our book.
Show Me A Cold, Hard Conversion Rate!
Steve Chou, (the man behind the awesome blog My Wife Quit Her Job), created his own mobile site of his eCommerce store Bumblebee Linens in 2011. At that time, his mobile traffic was 6%.
Today it’s at 30%.
Traffic increased by 26% since 2013 and revenues for mobile were up 41% and overall mobile revenues are on the order of double digits at this point.
Not bad, right?
Before he had a mobile optimized site, Bumblebee Linens was getting 28% less pages per visit with 1% conversion rates (in tracking targeted customers that are looking to purchase).
Once his mobile site launched, those conversion rates doubled and his per visit value went from $.28 per visitor up to $1.25 per visitor. That’s a lot of extra revenue thanks to a mobile-optimized site.
Last year, traffic from smartphones accounted for 11.3% of his overall traffic during the holiday season and was responsible for 3.2% of sales. This past year, smartphone traffic accounted for 21.3% of overall traffic and 6.9% of sales, one-fifth of all traffic coming to Bumblebee Linens.
There isn’t a downside to adding a mobile optimized site for your eCommerce business. Regardless of the route you take, you’ll almost certainly see an uptick in site traffic, conversion rates and sales.
Inspiring Mobile Sites
Here’s a trick to know if a site is responsive versus a custom mobile build as you research this on your own. Any site that begins with m. on your phone means it’s a mobile specific site, separate from the desktop version.
Hop on your phone and check out these sites right now to get the creative wheels turning.
Starbucks
Burton
Amazon
Patagonia
BassPro
Zappos
Asos
Nike
Mobile Design Checklist
Now that you know how effective a mobile eCommerce website can be for your business, use this checklist to make sure its optimized correctly. We call it the CLANCY formula.
Does Your Site Do The Following:
Check out made easy
Load time is quick
Analytics are mobile optimized
Navigation is a cinch
Click-to-call is readily available
You’d want to buy from the site, even if it wasn’t yours
Mobile isn’t just a “nice to have” anymore, it’s a “necessary to have” if you want to adapt to the changing landscape of eCommerce.
Good luck to you as you head off into the exciting world of mobile commerce.
Thanks to Andrea Anderheggen of Shopgate.com and Steve Chou of Bumblebeelinens.com. Statistics from Steve Chou came from a video from our private forum.
This post was written by Laura Serino, Community & Content Manager for eCommerceFuel.
Post by Andrew Youderian
