Since Shop.com moved to responsive design over the past year, the retailer’s mobile conversion rate has more than doubled—increasing from less than 2% to reaching at times just over 4%, says Steve Ashley, vice president of mobile and social for Market America, Shop.com’s parent. Its mobile page loads also sped from loading in 11 seconds on average to around three, he says.
Shop.com got there, Ashley says, by shedding a bunch of weight.
Today, Market America, which sells privately branded products ranging from health and nutrition to household consumables via a several websites, operates four mobile-optimized sites but Shop.com is its only responsive site, Ashley says. And Ashley, along with the rest of the C-suite, is on board with the design technique, with plans to transition the rest of its sites to responsive.
“It makes a company smarter about the assets it uses on its site,” Ashley says.
Ashley says speed and simplicity are key to design. With that in mind, the retailer cut much of the clutter from its site in the year-long process it took to transition the Shop.com site to responsive design. Responsive design is a format that adapts the look of a single retail website to the device the consumer is using, eliminating the operational headaches of operating separate web sites for mobile phones, tablets and computers. An often noted downside of the technique is slow load times, because, at least in some deployments, the retailer’s server sends all the content needed to load a desktop site to the consumer’s browser, which then figures out what content is necessary to load based on the size of the shopper’s screen. But Ashley says Shop.com is using a newer variant of responsive design where the server detects the type of device and only sends what that device needs, helping Shop.com avoid the speed trap of earlier versions.
“We want it to be easy for shoppers to quickly get through the checkout process,” Ashley says. “Before everywhere on our site was packed with merchandising and when we started shrinking the size of the screen, it got overwhelming. We had rather heavy images and slow page loads. And a lot of what we thought was important, shoppers weren’t clicking on anyways. We really focused on faster performance.”
Shop.com also used tag management vendor Tealium to consolidate requests to the server that stemmed from analytics, personalization and recommendations programs to improve site performance. And it eliminated two to three clicks in the checkout process on mobile, Ashley says.
Indeed, speed rules when it comes to mobile, research finds. A 2014 survey of nearly 3,500 consumers around the world found 51% were willing to “wait patiently,” or more than two seconds, for a web page to load. That’s compared to 63% who said they were willing to be patient five years earlier. Market research firm TNS ran the 2014 survey commissioned by web performance firm Akamai Technologies Inc.
That growing impatience could spell trouble for e-retailers with slow-responding sites because consumers on mobile devices are more active web shoppers than desktop users, and they spend more, the survey found. 15% of mobile users say they search the web for products daily, versus 5% of desktop users. 35% of mobile users make an online purchase at least once a week, versus 15% of desktop users. In the course of a year, tablet shoppers will spend $2,436 online, smartphone shoppers will spend $2,352 and desktop shoppers will spend $1,584, the survey says.
The benefit of having a single web site with a single code base that dynamically transforms the site to the size of the screen at Shop.com has helped persuade management to support migrating all its URLs to responsive design. Market America says it is moving forward in rebuilding three of its URLs from traditional web sites to responsive web sites. It hopes the change will drive more mobile sales across all its sites. Today, mobile accounts for 10% of online sales at Market America with 65% of mobile sales stemming from tablets and 35% from smartphones. Mobile traffic accounts for 18% to 20% of total traffic, Ashley says.
The responsive overhaul means a lot of work is on the docket for Market America’s web design and technology team of 16. What’s more, Shop.com, like most online retailers is still navigating the delicate and ever-evolving balance of mobile and web design and performance. That’s why Ashley makes a point to hire curious and hungry web designers, coders and developers who like to stay on top of new design principals and trends.
“I hire sponges and I challenge them to learn,” Ashley says. “Sometimes I have to reel them in from wanting to always change things to implement the new shiny penny on the market.”
Ashley says he vets potential mobile and technology hires for example, by asking them about emerging mobile strategies, how they would employ them and, most importantly, if they even know what they are.
“I ask ‘How would you implement beacons at one of our events’ or ‘How would you develop an application for same-day delivery?’” Ashley says. “What you find is when you mention words like beacon, some will look at you with a strange face and then you know who is really keeping up on the market and who isn’t.”
The technology devotees on his staff have convinced Ashley to try out new web development approaches. For example, it is beginning to test using BEM or Block, Element, Modifier—a web design methodology that helps developers better visualize how their code is used in the design of a site that leads to highly scalable and reusable code that is easier to customize.
“Responsive design usually uses easy frameworks which you can plug and play, and BEM allows for more on-the-fly customization,” Ashley says. “There really is no end all, be all for responsive design, a lot of it is trial and error.”
Ashley’s designers and developers also test the company’s site renderings—across no fewer than 50 devices. And such tests have helped it realize when a site change or update won’t work on a certain screen. “We may be coding for a change in checkout and there is a total workflow step that might have been missed,” Ashley says. “We’ve definitely had to make changes on the fly.”
Witnessing mobile growth over the years has helped change the mindset of senior management at Market America to think of mobile as a top factor in business decisions—but it didn’t happen overnight, Ashley says. “The culture of thinking mobile-first has been the biggest challenge we have had,” Ashley says. “But now (senior management) immediately asks about mobile with any new project I immediately hear ‘Where’s the mockups for mobile’ or ‘Where is the integration for mobile?’”
Market America first launched mobile-optimized sites 3 and a half years ago with a vendor. Today, Ashley says doing everything in-house produces better quality and more sales. Now when initially scoping out a new web or mobile web project stakeholders ranging from developers and quality assurance team members to project managers and marketing all get in a room to walk through the changes on a white board. “It takes longer in the design and discovery phase, but the development is actually faster once it gets underway,” Ashley says.
Indeed, Shop.com’s mobile sales rose 561% in the first year after it brought web and mobile web design in-house and launched a new version of its mobile app and site 2 and a half years ago.
“We are building much better and outstanding products in-house,” Ashley says.
Follow mobile business journalist Katie Evans, editor, at Mobile Strategies 360, @Mobile360Katie
Sign up for a free subscription to Mobile Strategies 360, a new weekly newsletter reporting on how businesses in all industries use mobile technologies to communicate with and market and sell to their consumers. Mobile Strategies 360 is published by Vertical Web Media LLC, which also publishes Internet Retailer, a business publication on e-retailing.
Favorite