With a smart phone in almost every pocket, mobile ecommerce is undoubtedly a huge opportunity to

get products in front of your customer. In fact, according to BigCommerce, mobile sales accounted for 31

percent of their customers’ overall ecommerce revenues in 2016, and will continue to grow through 2017.

Mobile commerce should absolutely be a priority for retail marketers when planning your content.

Mobile holds a significant place in the ecommerce buying process; shoppers use their mobile

devices to buy items on-the-go as well as research, and price compare, products they are

considering for purchase while in the store. But if your digital content doesn’t translate to a mobile

screen, conversion rates will inevitably suffer. 27 percent of consumers will reportedly leave a site if it is

not mobile optimized1.

The mobile user behaves and consumes information differently than the desktop user. Desktop

users typically have more time to explore – Search Engine Watch reports that desktop visitors spend

up to 3 times longer and bounce from the site half as often as mobile visitors2. In contrast, mobile

users want content as quickly as possible, with clear and concise product descriptions and simple

navigation. Shoppers’ well-documented attention span of only eight seconds3, combined with much

smaller screen real estate, means that retailers face a significant challenge: how can you deliver a

rich and meaningful customer experience on a mobile device?

In this ebook, we’ll review and compare web layout options – fixed, adaptive, and responsive design

– and recommend five ways that you can create mobile shopping experiences that convert visitors

into customers.

Mobile sales accounted for 31 percent of BigCommerce customers’ overall ecommerce revenues in 2017.

Small Screen, Big Content: Making Mobile Count

Understanding Mobile Web Design

Understanding how a website reformats content for smaller screens is the first

step in evaluating your mobile ecommerce goals. Typically a website falls

into one of three options: Fixed, Adaptive, or Responsive. Each has its unique

advantages and disadvantages.

Fixed design, or “non-responsive,” is typically viewed as the most basic and

foundational form of content design. In this approach, blocks of page content

do not change, scale, or shift position or formatting no matter the device’s

screen size. In other words, the desktop and mobile experiences are the

same, so the content and user experience cannot be optimized for mobile.

Generally, fixed layouts viewed on mobile devices display poorly and result in

a frustrating experience for the user.

Adaptive web design uses breakpoints, or brackets of screen widths

measured by pixels, to target specific screen sizes and serve up specific

content. Retail marketers then choose a different structural layout for each of

their website’s breakpoints, typically when envisioning page templates. When

a user visits a page the website detects the device’s screen size, matches it

with one of the predefined breakpoint groups and content arrangements, and

serves up the appropriate page format for that device’s screen size. Adaptive

web design can work well, but designing multiple layouts can double or triple

a marketer’s workload.

Finally, there is responsive design. Rather than breakpoints, CSS and media

queries drive the website’s page layout. As a result, the layout of page

elements adjusts automatically and fluidly as the width of the device screen,

or browser window, changes. Marketers can more easily hide or change

certain page elements to further improve the mobile user’s journey through

the site. This ultimately means that any user, regardless of their screen size,

experiences a well-optimized, readable, and easy-to-use website.

6 Mobile Content Quick Fixes

1. Make it Personal

2. Make Imagery Clickable + Interactive

3. Make it Easy to Buy

4. Optimize Your Email Lists

5. Offer Another Way to Convert, Outside of Sales

6. Consider a Mobile-First Approach

1. Make it Personal 2. Make Imagery Clickable + Interactive

Personalized content is always impactful; it’s one of the best ways to

establish or strengthen the customer-to-brand relationship, especially when

delivered on a mobile device. Personalization can come in many forms –

from recommendation algorithms that serve up products based on browsing

history to quizzes that suggest items based on a user’s answers. When done

right, personalized content gives shoppers a reason to buy even while they

are on-the-go. Why wouldn’t you make a purchase when your favorite brand is

delivering products and content perfect for you? And because it’s all tailored

to him/her, the customer can feel confident making a split-second purchase

decision on their mobile device.

Customers have come to expect everything digital to be clickable. In

fact, when this expectation isn’t met, users are often disappointed or

frustrated, which reflects poorly on the brand. This sentiment goes double

for mobile; consumers have become conditioned to swipe or tap on visual

content. Adding some element of interactivity to images helps fulfill these

expectations.

When a customer uses a mobile device, they’re navigating a small visual

space, usually with just one hand. Your layout should accommodate this

with large, clickable graphics. Large imagery on a small screen can seem

counterintuitive, but it makes your content easily skimmable for a user on-

the-go. Other features such as gifs, animation, and video make mobile

experiences dynamic, even on a diminished screen – but be mindful of how

larger files affect load speed and performance for on-the-go users. It can be

tricky to engage shoppers on a mobile device, but rich and clickable visuals

can help get you there.

Serve up personalized and relevant content to your customers to give them a reason to buy, even on-the-go.

Mobile users expect all content to be interactive – make sure you meet this expectation with clickable images.

3. Make it Easy to BuyShoppers are buying less from mobile devices – in 2017, BigCommerce found

that their customers’ desktop average order value is 50% higher than mobile – so

once a mobile customer wants to buy, the purchase process needs to be as easy

as possible. Shoppers should be able to add products to their shopping cart in an

instant – without leaving the experience. On a desktop, it’s frustrating and disruptive

to be sent to another page; on mobile, where navigation is cramped and the browser

“back” button is often hidden, this would cause many shoppers to abandon their

purchase altogether. The solution lies in quickviews.

Quickviews allow shoppers to buy directly from your content without having to

visit a product detail page. Users simply click on a visual call-to-action to open a

lightbox, select their size, color, and quantity, and then add the product to their cart.

Considering a user’s expectation that imagery is clickable, quickviews are a potent

way to encourage conversion. After adding to cart, shoppers can easily pick up

where they left off, on the same page, to continue exploring products.

Quickviews streamline and facilitate the path to purchase, without ever taking customers from your content.

4. Optimize Your Email Lists 5. Offer Another Way to Convert, Outside of SalesIt’s easier than ever to serve up relevant content for your customers by

analyzing and segmenting your customer list. MovableInk reports that 73

percent of people check email on a mobile device4, so your email landing

page content must be mobile optimized to drive engagement and sales.

Shoppers’ inboxes are flooded with dozens of emails from brands, so when

they single yours out and click on a link, you better make it count. Instead of

sending shoppers to a stale product grid that can be difficult to navigate on a

mobile device, serve up an interactive buying guide that they’ll easily relate

to (ideally this could be tailored to their interests based on their previous

shopping history). If a customer takes the next step in the purchase process

by clicking an email link, they should be rewarded with content that is highly

relevant to them, and streamlines their product discovery process.

Mobile users often access your content without any intent to buy – they could

be casually scrolling through on their morning commute or waiting in line for

coffee. Give these casual browsers a chance to “convert” in a different way if

they’re not ready to buy; perhaps by subscribing to your email list. Then, your

brand can easily engage with them in the future and get them to a purchase

point when they’re ready. When designing your mobile pages, keep in mind

they should be able to subscribe quickly in as few clicks as possible. If they

don’t have the time to make a purchase decision, they won’t have time to

spend more than a few seconds subscribing. So make the subscription center

easy to find and complete for long-term engagement and loyalty.

Segment and analyze your email lists to deliver subscribers to engaging, mobile optimized content.

The email subscription process should be quick and easy – just one or two clicks.

6. Consider A Mobile-First ApproachWhen planning content for mobile devices or mapping out your mobile

users’ site journey, responsive design is sometimes not enough. Start with

mobile as you plan your next digital content campaign. With such high traffic

volumes occurring from small screens – in 2016, Google announced tablet

and mobile browsing accounted for 51.3 percent of overall searches5 – it’s a

good investment to prioritize mobile design over desktop. Many brands have

already seen a “tipping point” where their mobile traffic now exceeds desktop,

so you’ll be well positioned for the near future if this isn’t already the case

for your business. Considering your campaigns from the perspective of all

potential users uncovers new opportunities for innovation and greater sales.

Conclusion

It’s undeniable that retailers need to consider mobile a priority. If mobile

content optimization has traditionally been seen as secondary in your

organization, it’s time to reconsider. While there’s a lot to decide – and the

constant challenges of lack of time, manpower, or budget – with the right

tools, an omnichannel approach is no longer a lofty goal.

BigCommerce measured year-over-year mobile sales growth for

customers around the world, and from June 2016 to 2017, US mobile sales

grew a whopping 24 percent. In the age of instant gratification and on-the-

go purchases, customers need to feel comfortable discovering products

and making purchases across all devices. They should be empowered to

buy, not frustrated by a clunky path to purchase. A rich customer journey

on mobile, desktop, and tablet is the key to a successful digital campaign,

and a successful customer-to-brand relationship.

1 ExactTarget, Mobile Behavior Report2 Search Engine Watch – Why Mobile Web Still Matters in 2015 3 Microsoft, Attention Spans – Consumer Insights Report4 MovableInk, US Consumer Device Preference Report5 The Guardian, Mobile Web Browsing Overtakes Desktop For The First Time,

Samuel Gibbs, November 2, 2016

Zmags helps ecommerce marketers create and publish rich digital

experiences through a user-friendly interface that requires no IT

involvement. Using Creator by Zmags, brands can create fresh,

shoppable content that drives product discovery and inspires

consumers to purchase. Creator integrates with all leading ecommerce

and content management platforms enabling marketers to optimize

their website content. Leading brands like Ethan Allen, Harvey Nichols,

New York & Company, Vivienne Westwood, All Things BBQ, and Godiva

use Creator by Zmags to deliver interactive and entertaining shopping

experiences with rich content like buying guides, quizzes, lookbooks,

video, and more. To learn more, visit www.zmags.com.

BigCommerce is a robust, flexible ecommerce platform that provides

established and emerging brands with everything they need to launch,

promote, manage and scale a successful online store. BigCommerce

merchants earn more than retailers on competitive ecommerce solutions

thanks to advanced features, better site performance and streamlined

business processes. Founded in 2009, the company has received more

than $100 million in funding from SoftBank Capital, American Express,

Telstra Ventures, General Catalyst, Revolution Growth and FLOODGATE.

Bigcommerce supports thousands of retailers around the world from its

offices in San Francisco, Austin and Sydney. For more information, visit

BigCommerce.com.