Chapter 1:
Introduction
Introducing the Mobile eCommerce Checklist
eCommerce stores that lack a mobile-optimized website are at a notable disadvantage compared to those that are mobile-optimized. According to a Google survey, 59% of shoppers say that being able to shop on mobile is important when deciding which brand or retailer to buy from, and 39% of smartphone users are more likely to browse or shop on a mobile app because it’s easier for them to make a purchase.
In this guide, we’re breaking down best practices, design tips, checkout optimization strategies and SMS insights to optimize your site for mobile and improve the mobile eCommerce customer experience.
Chapter 2:
Mobile eCommerce Best Practices
Staying Ahead of Mobile eCommerce Trends
- Improve site speed & page load times
- Sign in and pay with a fingerprint
- Put the navigation menu at the top
- Keep the search bar above the fold
- Allow users to save their shopping carts
Improve Site Speed & Page Load Times
Today’s society of fast-paced tech-savvy individuals expect websites to load quickly with zero connection issues. HubSpot reports that a 1 second delay results in 7% less conversions, and a 1 second delay in page load time results in an 11% loss of page views.
Improve a customer’s mobile eCommerce experience and increase conversion rate with fast page load times and a quick site speed. To do this, save images in JPG rather than in PNG. Though the latter file format is great for saving images with transparent backgrounds, they’re incredibly large. JPG files, on the other hand, require much less space, therefore resulting in a quicker site speed.
Sign In and Pay With A Fingerprint
The speed at which shoppers are able to find and access products online is critical to the success of any mobile eCommerce website. Create a seamless user experience, decrease shopping cart abandonment and shave time off of the buying process by accelerating shoppers through the buyer’s journey.
Offer customers the option to sign in and pay with their fingerprints, so they don’t have to spend time creating a username and password or finding their wallet before entering their credit card information. This makes it easier for returning customers to sign into their accounts and complete their purchases if their payment method is saved on file.
Put The Navigation Menu At The Top
Help customers easily find what they’re looking for by putting the navigation menu at the top of the page. Ensure all category options are available in the navigation bar to create a frictionless user experience.
Use only one or two words for each category option so that users clearly understand what you’re offering and immediately recognize how to navigate to the specific product or service they’re looking for. Simplicity is key in the navigation.
Keep The Search Bar Above The Fold
According to HubSpot, 48% of customers started searching for the product they bought on mobile first. And, our benchmarking shows that those who use on-site search are 3 to 5 times more likely to convert.
We recommend keeping the site search box above the fold to convert high-intent visitors. They already have a strong idea of what they want to purchase and how much they’re willing to pay, so providing a seamless search process is key to winning these customers once they’re on your site.
Allow Users To Save Their Shopping Carts
People get easily distracted, especially when shopping on mobile devices. Convert more shoppers into customers and decrease shopping cart abandonment by allowing both registered users and guests to save their shopping carts for later. For guests, use cookies to track their browsing histories so that they can easily access the items they were interested in.
Rather than having to search for the products all over again and add them to the shopping cart for a second time, a saved shopping cart lets users leave the cart and return to it later to complete the checkout process.
Chapter 3:
Mobile eCommerce Design Tips
Designing a Beautiful Mobile eCommerce Site
- Use smart search
- Limit text on product pages
- Consider the thumb zone
- Make mobile navigation simple
- Use sticky CTAs
Use Smart Search
In addition to keeping your site search box above the fold, use smart search to enhance the mobile eCommerce experience. Use auto-fill to predict searches and suggest products and categories that are relevant to a user’s search entry. Not only does this help them find what they’re looking for quicker, but it’s also great for cross-selling similar products.
Rather than pinching and zooming on a mobile device to conduct a search, ensure maximum efficiency by making the site search box at least 43 pixels high.
Limit Text On Product Pages
It’s important to remember that there’s a lot less screen real estate on mobile devices than there is on a desktop, so we encourage eCommerce stores to include only the necessary information throughout all pages of the site. This means limiting text on product pages to avoid cluttered pages and ensure a great user experience.
So, how do you determine what “necessary information” to put on your product pages? We often tell our clients to include the information that’s most beneficial to the user; this varies for retailers and service-based businesses. Regardless, be sure to include:
- The product name
- Variant options
- Price
- A call-to-action button
These four elements help the shopper better understand what exactly they’re about to purchase. If you have additional information that you think is helpful for shoppers to see prior to purchase, then hide that detailed information in a collapsible view so that your product page is not saturated with too much text.
Consider The Thumb Zone
There are a variety of mobile devices out there 一 small smartphones, different sized iPads and large tablets 一 which gives online stores more of a reason to optimize their sites for mobile. Though the sizes of these mobile devices vary, people typically use these devices in the same way.
Think about how you physically hold your phone. No matter if you’re left or right-handed, you probably use your thumbs for the majority of typing and scrolling that you do. It’s a mobile eCommerce best practice to consider the thumb zone, or the area of a device where it’s easiest for users to navigate through and click with their thumbs.
Easily direct users where you want them to go by optimizing your site design to put key elements, like a call-to-action button (CTA), in the thumb zone. Putting important elements at the bottom of the screen for mobile helps to accelerate users through the buyer’s journey and eliminate any frustration.
Make Mobile Navigation Simple
Since there’s a lot less screen real estate on mobile, users have to do a lot more scrolling to find what they’re looking for. We encourage eCommerce brands to make the main navigation simple, so people can easily and quickly click through the menu to shop 一 no matter which page they’re on.
Create a simple navigation and improve the user experience by making the main navigation sticky. Rather than requiring users to scroll all the way back to the top to see the main menu, a sticky navigation lets users access the menu whether they’re at the beginning, middle or bottom of a page.
Use Sticky CTAs
Increase conversions by creating a seamless customer experience and differentiating your content from your CTAs. We recommend using sticky CTAs on important pages, such as product detail pages, to make it easier for users to add items to their shopping carts.
Instead of scrolling all the way to the bottom of a page to click “add to cart,” use a sticky CTA that lets users add the item to their cart no matter where they are on the page. Sticky CTAs give way for much less scrolling and help to guide users through the purchase process.
Chapter 5:
Optimize Checkout For Mobile
Creating A Conversion-Focused Mobile eCommerce Website
- Provide a one-page checkout
- Show all product details
- Cross-sell related products
- Display security badges & trust seals
- Validate form field entries and display error notifications
Provide A One-Page Checkout
We’re huge advocates for providing a one-page checkout when optimizing websites for mobile. Not only does a one-page checkout minimize friction when completing a purchase, but it also drives more conversions by helping customers convert seamlessly.
Consider the process a soon-to-be customer goes through before arriving at the checkout. If they’re a first-time customer, chances are they’ve likely browsed your entire site before deciding to purchase a product. Returning customers go through the same stages of the buyer’s journey when shopping online. Though they already established a sense of trust within your brand, it’s still possible to lose customers at the checkout.
After a customer realizes they have a problem or opportunity, they consider all possible solutions and evaluate all alternatives to come up with a final purchasing decision. Avoid frustrating customers during the checkout process by creating a frictionless experience. A one-page checkout is a best practice that will make the mobile eCommerce shopping experience easier for your customers.
Show All Product Details
Providing customers with all of the relevant product details is one of the most significant factors when optimizing for mobile, especially when preparing for the holidays. Many people add similar items from various online stores to their shopping carts, then compare them all before making a decision.
To avoid losing customers here, provide all of the necessary product information in the checkout, such as the name of the item, its price, the quantity and whether it is discounted (and ensure the price reflects the discount).
Cross-Sell Related Products
Cross-selling is when brands offer related products that complement the original item that a customer showed interest in. Businesses that cross-sell successfully make it a breeze for customers to add additional items to their shopping carts without diverting them from purchasing the original product that they intended.
Let’s pretend your business sells electronics, and a customer added a laptop to their cart. Effectively cross-sell by presenting users with a charger, mouse or laptop case in the checkout. It’s important to note that cross-sells are not up-sells; cross-selling involves offering items that are less expensive than the original item.
Display these related products in the checkout in a simple way, so users can add the additional products to their carts with one click of a button. Leveraging cross-selling for your mobile store helps customers see items they might have overlooked. Plus, it’s a great strategy for increasing average order value 一 which means more dollars for your business.
Display Security Badges & Trust Seals
As we see many brick-and-mortar stores turning to eCommerce in 2020, it’s paramount that we all take the necessary precautions to avoid cyber security threats. More importantly, gain customer trust and convert more visitors into customers by displaying security badges and trust seals in the checkout.
Consumers love feeling reassured that their payment information is secured online. Actively address their concerns by displaying visuals or logos from established companies, like Norton or the Better Business Bureau, to assure customers that their credit card information is safe and secure on your website.
Though this is not required for mobile, we encourage eCommerce brands to implement this to increase trust. If you’re not sure whether it’s contributing to increased conversions, try testing different wording and design to reassure customers and drive more results.
Validate Form Field Entries and Notify of Errors
Collect accurate information and ensure users are entering correct data by using form field validation and displaying error notifications. Sometimes, people want to download things without giving away their information, but form field validation ensures most of their information is correct.
See below how Groove Commerce uses form field validation and notifies users of errors prior to submitting a form. If a user forgets to fill out their email, they’re prompted in real time with a reminder to enter their email address (this goes for all required form fields). In this example, the user entered an incorrect phone number, so the form field notified the user with an error message stating the phone number they entered was not long enough.
Chapter 5:
SMS For Mobile
Leveraging Text Messages for Mobile eCommerce
HubSpot reports that consumers are 35x more likely to open mobile messages than emails. That being said, it’s critical to implement SMS texts into your mobile eCommerce strategy. Our team here at Groove Commerce often recommends Klaviyo for SMS (and email marketing as well).
Klaviyo’s SMS functionality allows eCommerce businesses to seamlessly message subscribers that provide SMS consent. Just like email campaigns, brands can create SMS campaigns and combine email and SMS in a single flow (one of the reasons why many businesses choose Klaviyo for SMS).
Let’s pretend you want to create a welcome series. Most companies typically ask for an email address and phone number. With Klaviyo, businesses can send the first message as a text message (if they have consent) and then send the rest of the welcome series messages as emails. The order of the texts and emails change depending on what works best for a company.
Regardless of the order, everything can be seen in one single view 一 so there’s no need to have various systems. Before Klaviyo offered SMS, companies would need to have their email flow in Klaviyo (or the email marketing software they use) and a separate SMS workflow (on another platform).
In an interview with Navin Jain, Strategic Account Executive at Klaviyo, he explains that there are a few profitable use cases for SMS. They are as follows:
- Welcome series
- Abandoned cart
- Campaigns
- Promotions
- Tips
“We absolutely encourage all of our customers to add SMS to welcome series,” Navin explains. It’s the most profitable use case for SMS and allows businesses to welcome customers and connect with them on a personal level.
Abandoned carts, campaigns and promotions are the next most profitable use cases for SMS, respectively. Campaigns are one time messages that are not triggered based on someone’s actions. Sending campaign and promotional SMS texts to VIP subscribers is key to driving brand loyalty and creating a sense of urgency.
“It’s really valuable to have SMS for promotions. For example, you can send your VIP customers an SMS message 2 or 3 hours in advance so that they’re the first to see the new products you launched. Or you can send back-in-stock messages to let your customers know that an item they were interested in has been replenished,” Navin explains.
He goes on to say that tips have been really valuable for Klaviyo customers. “If the product that you’re selling needs assistance or is a lifestyle item, you want to make sure you’re showing your customers tips for using it,” he says. Be sure to include tips in your SMS messages to help customers use the product or to show how other people are using your product.
All of these use cases are vetted based on what Klaviyo customers are doing. Brands are now realizing that SMS is a very personalized form of communication. It tends to perform greater than email for some businesses, which makes sense considering the number of people that have their phones by their side each day.
Lastly, Klaviyo’s personalization and segmentation capabilities are the reason why so many people choose Klaviyo over other platforms. Navin shares a few examples of how to personalize and segment SMS messages to subscribers, including “individuals who viewed a specific product; individuals who are active on your site x times in the past x days; individuals who purchased x amount of times over all time; individuals who clicked or opened an email in the last x days; etc.”
Klaviyo helps eCommerce brands effortlessly leverage customer data to be used in SMS messages. If you’re interested in leveraging Klaviyo, we broke down Klaviyo pricing here to help you determine how much it’ll cost.
Chapter 6:
Mobile Pop-Ups
Capturing Visitor Attention
Leverage one of the most effective mobile eCommerce strategies out there: pop-ups. Our team encourages clients to implement Justuno, an AI visitor conversion platform with the most advanced onsite promotion suite on the market. At its core, Justuno’s visitor intelligence technology analyzes billions of data points each second to create intelligent visitor profiles that identify, track and analyze every person who lands on your website.
Create mobile-specific promotions, target users based on their geographic location, integrate Justuno with your eCommerce platform and leverage the platform’s design canvas to create highly targeted and engaging pop-ups. Capture more leads by building a fully-customizable email capture pop-up, using Facebook Messenger for one-on-one welcome messages, engaging users with spin-to-win gamification or connecting personally with customers through SMS marketing.
Send personalized messages to different customer segments with Justuno’s banners, pop-ups and push notifications. Improve your on-site conversion rate and average order value (AOV) by cross-selling complementary products and up-selling more expensive products automatically within your pop-ups. Capture more abandoned carts by displaying an offer to users who are about to leave your site.
Justuno is one of the leading platforms on the market to capture more leads and increase on-site conversion rates. On average, Justuno clients have seen a 135% increase in revenue in the first year alone and see an $8 increase in AOV . One company even grew their email list by 500% with Justuno. Interested? You can have a new pop-up live on your site in under 15 minutes.
Conclusion
Take advantage of these mobile eCommerce best practices, design tips, checkout optimization strategies and SMS marketing to improve the mobile shopping experience, increase customer trust and drive conversions.
If you need help optimizing your eCommerce store for mobile or are looking for website or marketing services to drive more revenue, our team is happy to help. Just contact us here with any questions or concerns, and we’ll be in touch soon!
About Groove Commerce
Groove Commerce is a full-service eCommerce agency with 13 years of experience helping mid-market retailers design, build and grow their eCommerce websites. As an Elite BigCommerce Partner Agency and Diamond HubSpot Partner Agency, Groove Commerce follows an inbound methodology and delivers bespoke, white-glove service to convert visitors into repeat customers.
About Klaviyo
Klaviyo is the world’s leading owned marketing platform, known for accelerating revenue or online businesses using the channels they own like email, web and mobile. Enabling companies to leverage these owned marketing channels, Klaviyo makes it easy to store, access, analyze and use transactional and behavioral data to power highly-targeted customer and prospect communications.
And unlike other marketing platforms, Klaviyo doesn’t force companies to compromise between advanced functionality and ease of use 一 companies of all sizes are able to maximize their sales quickly. That’s why more than 40,000 innovative companies like Unilever, Custom Ink and Eventbrite sell more with Klaviyo.
About Justuno
Justuno is a conversion platform that helps eCommerce brands build high-converting website experiences with the most advanced on site promotion suite on the market. On average, Justuno clients see over 135% lift in online revenue in the first year, making Justuno one of the best tools to increase sales and conversions, personalize messaging and capture leads.
