Executing eCommerce Responsive Design


Making your online store responsive is no longer a “nice to have” option

The landscape of eCommerce is changing quickly. With the proliferation of mobile at a pace that is outpacing even the most aggressive estimates, the need to construct eCommerce experiences that are agnostic towards device and platform is paramount to maximizing conversion rates.

Many eCommerce retailers have taken the approach of constructing numerous interface designs for varied platforms. A standard eCommerce website is created for desktop browser sessions. A mobile sub-domain is leveraged for sessions that initiate within the Iphone or Android operating systems. And lastly, a separate eCommerce design and navigation is deployed for the Ipad and other tablets. If you have a eCommerce company you can get sales order processing software to help you run your business more smoothly.

This disparate type approach can help your business in maintaining overall conversion rates, while potentially increasing the effectiveness of your site within these segments. Problems arise however as multiple layers of templates exist, leading to added churn with site optimization activities such as site refreshes and category level promotions. Forward thinking retailers are leveraging responsive site design to simplify the delivery of their eCommerce websites across multiple platforms and devices. If you haven’t yet considered responsive design within your store, now is the time.

What is responsive design?

Responsive design is defined as a web site that is crafted to use CSS3 media queries, in conjunction with proportion-based grids, which use percentages instead of pixels, to adapt the layout to the viewing environment of the user. (Source: Wikipedia) As a result, eCommerce shoppers across a wide spectrum of devices and browsers will have access to a single source of content, laid out so as to be easy to read and navigate for each device. In a nutshell, the eCommerce design responds to the user, instead of the other way around. This eliminates some frustration that ipad, iphone, and android users currently experience when interacting with a static standard website. Leveraging responsive design practices will help your eCommerce business in numerous ways, but here are three main components that drive ROI:

Higher conversion rates

If your mobile and tablet conversion rates trail your primary conversion rate metrics by 50% or greater, you have a problem. Likely users are coming to your site within these device channels and experiencing frustration across page layout, navigation, filtering, and site performance. Look at your site analytics and utilize video analytics to record these sessions in order to get clarity into mobile issues. By constructing your ecommerce template to leverage CSS 3 and the usability benefits that it provides, your site will become smarter and make it easier for web users to conduct the tasks they want to achieve on your domain.

Improved SEO

Search engines have provided details into their preferences for consolidation across domains. Forward thinking enterprises and brands such as Nike and Starbucks have leveraged these approaches of a consolidated web address for all devices and are reaping the benefits. Having multiple domains within the fragmented approach, which in some cases can reach up to three sub-domains or more, will dilute overall page rank and presents challenges into proper site classification and link architecture (both internal and external). Simplifying your site to be one domain that maps to all devices via responsive design allows for a core URL to gain authority status, making SEO a much easier proposition across numerous devices.

Operational Efficiency

If you are an eCommerce retailer, you know the costs that coincide with programming and design resources. These costs can cripple start up eCommerce businesses as they grow, eliminating the need to be able to provide a fresh face for users through extensive refreshes and promotional activities. With retailers who do not user responsive design, this chain of development adds numerous layers if you want to message these devices properly. Not only does the technical resource have to redesign the website, but now must also construct alternative templates that meet the needs of other platforms. Leveraging responsive design at the onset may take more effort and strategy than standard design practices, but the benefits from an internal efficiency and external user perspective will make these initiatives quite worth it as the company continues to publish new content and pages.

Where to begin with responsive design


Getting your site to leverage responsive design is not a small fix or quick project but it is not as daunting as one may think.

The initial course of action should be to interface with any design and technology resource that works on your eCommerce site and ask the following questions:

  • How can our site be more dynamic to alternative screen resolutions?
  • What processes can we institute to resize images proportionately to device types?
  • What is our ability to leverage custom layout structures?
  • What is our ability to show or hide content based upon device?

By asking these questions, your technical team will hopefully get the creative juices flowing and start understanding the business benefits of leveraging responsive design within an eCommerce environment.

After your implementation is completed, your eCommerce business will likely see an incremental conversion benefit and enhanced growth as your store will be more optimally positioned to leverage user trends within the Internet towards smartphones, tablets, and overall mobile commerce.

Interested in our services?

Contact Us

FREE Strategy Guide

Sign up for our email series for the latest site design & development news and industry insights.

Recent Posts

FREE WEBINAR TRAINING

Secrets for Optimizing Conversion

(And Our Ten Best Performing Experiments)

by Craig Smith // CEO & Founder

FREE WEBINAR TRAINING

Secrets for Optimizing Conversion

(And Our Ten Best Performing Experiments)

by Craig Smith // CEO & Founder

We hope you found this article helpful!

Would you like more insights?

Get our latest strategies and insights delivered straight to your inbox.