1-800-Contacts Inc. redesigned its mobile commerce web site in August 2012, aiming to boost its mobile conversion rate. Conversion on the mobile site, built with an m-commerce technology vendor the e-retailer declines to name, increased by more than 30% with the redesign.
While work on the m-commerce site redesign was being completed in summer 2012, responsive web design first popped up on the radar of e-commerce and m-commerce staffers at the web-only contact lens retailer. Responsive design is a technique that enables retailers to build a single site off of a single code base and single set of web content that detects the width of the screen of a device requesting a page and delivers a page designed to fit that screen. Most retailers with responsive sites cite avoiding the need to build separate sites for smartphones and tablets as one reason they went with responsive.
1-800-Contacts was impressed with responsive design, and based on its research decided responsive had a good chance of besting an m-commerce site in smartphone conversion. And responsive came with the added benefit of providing a tablet-optimized design, which 1-800-Contacts had yet to tackle. So the e-retailer began work on a responsive site shortly after redesigning the mobile site, and in February launched the responsive site with the help of a mobile developer it declines to name.
1-800-Contacts worked with a mobile developer and integrated the developer’s proprietary system with the 1-800-Contacts e-commerce site. In-house and developer staffers transformed desktop site content into responsive site content. The responsive site detects the type of device accessing the site and delivers content in the appropriate layout to fit the screen of the device.
The responsive site has been live for the last four weeks. 1-800-Contacts has been sending 30% of mobile traffic to the responsive design site and 70% to the m-commerce site. It’s too early to tell if the responsive site will beat the m-commerce site, the e-retailer says. But today the e-retailer is boosting the percentage of mobile traffic to the responsive site to 50%. If the data look good, the e-retailer says it may send all mobile traffic to the responsive site within the next three weeks and then drop the m-commerce site.
1-800-Contacts adds that it has netted a 10% increase in the tablet conversion rate with the responsive site, compared with delivering the standard desktop site to tablets, as it did before.
“There is no redirect with the responsive site as there is with the smartphone m-commerce site, and as a result we have reduced page load time by about a second,” says Joshua Stanley, associate director, product management, at 1-800-Contacts. “We have made brand tiles more of a big deal on the responsive site, and having more of the full site content on the mobile version of the responsive site helps.”
The “brand tiles” are boxes with contact lens brand logos and names within.
Stanley says creating a separate site for smartphones has its drawbacks.
“Trying to maintain two sites, you are always putting emphasis on one or the other, and our emphasis has been on the full site,” he says. “Now with the responsive site we have one code base to work off so all the back-end work doesn’t have to be redone for two sites. Now it’s just tweaking the front-end user interface layer, making sure it adjusts to changes we make. We’re thinking mobile-first design now, first wondering how a change will look on a smartphone, and then how it will look on a tablet, and then all the way up to the full site.”
But Stanley is quick to add that responsive design has its challenges, particularly surrounding staff.
“One of the biggest challenges no one talks about is organizational structure,” he says. “How responsive will impact your team. Everyone wants to talk about design and mobile-first; we educated ourselves on that. No one wants to talk about now that you have this single code base, how will you structure your development team.”
Stanley says 1-800-Contacts had to figure out organizational issues surrounding responsive design on its own.
“You just have to stumble and figure this out,” he says. “For a new thing we want to do on the site, the core site team does the initial work and then the mobile team focuses on the user interface of responsive, tweaking it after the core team. Then the challenge is quality assurance. If you make a change in responsive it will affect all code. So we have combined into one team for quality assurance—the site as a whole means desktop, tablet and smartphone, so we qualify it as one build because it is one site. Technical challenges are easy. Technology guys love finding solutions. However, no one wants to deal with organizational challenges.”
Stanley declines to reveal what it cost to build the responsive design site.
1-800-Contacts also offers customers an iPhone app, which it says boasts a conversion rate higher than the m-commerce site’s conversion rate, and has just launched an Android app.
Favorite