A Sober Look at Why Responsive Rebuilds Fail for E-Commerce Websites

The excitement around responsive web design is at its peak. In the last couple of years, many enterprise e-commerce retailers have chosen to rebuild their website using this technique, making their online stores look great on all screens and devices. Many more are looking do the same.

But for some retailers, the results of going responsive have been underwhelming, to say the least. Their conversion rates dropped, together with average order values and, ultimately, revenue.

The big question is “Why?”

Some mobile web optimization vendors are calling quits on the whole responsive methodology in an attempt to retain their market position without evolving their product.

We are not going to do that.

Instead, let’s take a sober look at the underlying reasons for a responsive rebuild to fail for e-commerce websites, and how your organization can achieve different, better results.

3 Reasons Why Responsive Rebuilds Can Reduce E-Commerce Revenue

From our experience working with enterprise e-commerce companies in a wide range of product categories, it all comes down to one (or a combination) of the following three reasons:

  1. A retailer treats Responsive Design as a conversion-centered solution, which it inherently isn’t.
  2. A team makes improvements to the under-performing mobile layouts but ends up affecting desktop layouts as well, negatively impacting conversion rates.
  3. Lack of internal expertise with this relatively new design methodology leads to site speed issues that go undetected during the rebuild project but then shatter conversion rates and organic search traffic after the new site is released.

Now let’s look at each one of these in more detail!

1. Device-centered design vs. conversion-centered design

Here’s how Oli Gardner, co-founder of Unbounce, defines Conversion-Centered Design:

“[It] is a discipline targeted specifically at designing experiences that achieve a single business goal. It seeks to guide the visitor towards completing that one specific action, using persuasive design and psychological triggers as devices to increase conversions.”

An assumption a lot of retailers make is that responsive design is inherently conversion-centered, which it isn’t.

Responsive design’s goal is to make your website look good on a wide range of mobile and desktop devices, while simplifying code maintenance and achieving greater operational efficiency.

Unfortunately, looking good or being operationally efficient does not necessarily mean selling well.

A car without an engine looks good, but how far will it drive?

For a responsive rebuild to be successful, your team needs to balance the business and technical needs of the project, focusing on conversion optimization just as much — if not more — on the user interface and code simplicity.

2. If it isn’t broken, don’t fix it.

The second way in which responsive rebuilds fail is when a team tasked with improving the site’s layout on mobile also makes significant changes to the well-performing desktop site.

Most of the time, this happens out of good intentions. The advocates of the “mobile-first” approach say that it’s easier to increase layout complexity (going from mobile to tablet, to desktop) than to reduce it (going the other way around).

So the team throws out the existing desktop layout and re-creates it from scratch. The only problem is that the new design ends up being noticeably different from the old one because of this new process. And in this case, different means not as optimized for conversion.

To make sure your company doesn’t face this challenge, you need to define clearly how you feel about the desktop layout during the planning stage of the project. There are generally two options here:

Option 1. If you’re happy with how your desktop site performs, direct your team to keep the layout the same, and only adjust the code to enable multi-screen support.

Option 2. If you’re unhappy with your site on desktop, or if your brand could use a refresh, choose the mobile-first approach, but also the conversion-centered approach described in the previous section of this article.

By planning the project well at the outset, you can guarantee your websites success after the relaunch.

3. Site speed: The hidden land mine of RWD

One last responsive rebuild challenge I want to cover today, is website speed performance and why speed matters in the first place.

Page speed matters for two reasons: search rankings and conversions rates.

Search rankings are affected because Google and other engines use page speed as ranking factor. If your site is slow, your rankings will be low. Period.

Conversion rates are influenced because your customers hate waiting, especially in the “on-the-go” mobile context. In fact, making them wait an extra second could easily lead to 7% of them choosing to shop elsewhere.

Now, here’s what’s happening with page speed and responsive design: On one hand, responsive comes with a number of benefits for search rankings and page speed, mainly due to the fact that you end up with a single website rather than three separate ones – like with m-dot (m.example.com) or responsive delivery methods.

But on the other hand, you end up with three websites combined into one, meaning that on any particular device there’s lots of extra code, images and other assets that are being loaded but aren’t being used.

This can significantly slow down your website, especially for mobile users on slow connections. And this issue is extremely easy to miss during the development cycle, which usually happens under perfect network conditions.

The difference in page weight that is negligible on a laptop in an office setting can be a conversion-killer on an iPhone in transit.

That’s why you need to make sure your web development team has website performance on its radar and is implementing in-house or third-party solutions to keep your site fast. Your customers will be grateful, and your revenue will reflect that.

Conclusion

At the end of the day, responsive design is still a strong, future-proof web strategy for online retailers. The operational efficiencies and strong branding it delivers are exactly what retailers need to meet the mobile-first reality of today’s web.

However, for sites that sell, the risks of responsive design are high. You need to take steps that other, non conversion-driven sites don’t have to worry about.

If you’re looking for an additional, visual exploration into these risks – and how some online retailers are overcoming them, please feel free to check out our 20 minute webinar recording Is Responsive Design the Right Choice for Online Retailers.