It's happened to all of us. You decide to shop for something and grab your phone to look it up. And then it all goes downhill.
Text is running off the screen, you have to pinch-zoom to click on links, and just getting to the fields to type in your address is an exercise in frustration. Let's be honest; you gave up long before getting to the checkout page. You'll just wait until you are in front of a "real computer." Right?
Now think about this: Did you ever remember to go back and actually buy that item you were so ready to order on your phone? If it was important enough, you probably found a different site that actually loaded properly on your screen to make the purchase. If it wasn't, you probably forgot about it altogether. Either way, the site that wasn't mobile friendly lost the sale.
Mobile commerce is the single fastest growing retail sales channel today. In fact, more than 30 percent of global ecommerce sales are completed on mobile devices, whether using a smartphone on the go or a tablet while watching TV. The rabbit hole also goes deeper than conversion - mobile devices are used at every step of the shopping journey from research to comparison shopping and looking up reviews, sometimes directly from a physical store. Are your offerings competitive in the mobile space?
Creating an entire site dedicated to mobile devices or building an app can be large endeavors and seem daunting to all but the largest retailers. That hurdle has kept much of the mid and small market out of the mobile game, but responsive design has made going mobile easier than ever. Using a few best practices, ecommerce sites that look great on any sized screen can be designed one time, ensuring consistency across channels and eliminating duplicate work or complex app development.
Here are a few things to keep in mind when planning a responsive site:
Make mobile your new foundation
There's no getting around that mobile screens don't offer as much real estate as laptop or desktop computers, so plan everything from homepages to product pages and checkouts to display at their barest levels on mobile devices. Though it might be tempting to design a beautiful and complex website and then strip it down for mobile displays, this is the wrong approach. Instead, start with a simple and clean design that looks great on smaller screens and then build it up from there to provide a great experience when scaled up to larger displays. It is much easier to build up from a solid foundation than to try to squeeze an expansive site onto a mobile screen.
Sizing at scale
Every screen and browser should provide as rich an experience as possible, but not stretch the capabilities of the device to compromise usability. This concept, known as "progressive enhancement," dictates which features are best for various viewing devices and layers them accordingly. Each page contains layout elements that may appear or disappear depending on the size of the screen they are viewed on and the capabilities of the browsers being used. It is vital to understand and plan these behaviors so that content flows smoothly regardless of which features are enabled.
User experience consistency
As the display of a website changes changes across devices, core functionality should remain constant. Navigation through product category selection, product photo viewing, checking out and other key experiential elements should be consistent. Even as elements like copy and photos resize according to user display parameters, key assets like the "Add to cart" button do not have to resize proportionally. In fact, their sizes should be fixed to keep them visible and usable at all times. Identifying page elements that are the most vital to user experience and the sales funnel is key to keeping conversion rates high among devices.
Call in the pros
While easier than developing multiple sites, a solid responsive site requires more expertise than basic HTML. Working with experienced designers well versed in responsive design will ensure that the site is developed properly the first time, preventing frustrating redesigns and overhauls later. This is one of those times where cutting corners almost always proves to be counterproductive.
The importance of tapping into mobile users can not be overstated to retailers, and the time to dive in is now. A quality responsive site will pay dividends for years to come as the devices consumers use to access the Internet continues to evolve.
Murtaza "Zeke" Hamdani, the Director of Web Services for Celerant Technology is an ecommerce expert with over 12 years of experience in the retail industry. With an ultimate goal of delivering cutting edge technology, Hamdani approaches information technology with the abilities of a programmer and the sensibilities of a retailer.