RWD vs Dedicated Mobile Site

The Great Debate: Responsive Design VS Dedicated Mobile Commerce

The Great Debate: Responsive Web Design (RWD) vs Dedicated Mobile Commerce.

Responsive Web Design (RWD) is a hot topic. On one hand, the appeal of “one site fits all” is understandable. But retailers should take a careful, deeper look before jumping on this bandwagon.

We speak with retailers every day and the two most common claims we hear in favor of responsive are:

1) Google recommends it, and

2) One, single site displayed on all devices will be easier to manage.

In this post, we’ll address these two points head-on.

1) The Google SEO Recommendation Fallacy

Advocates and solution providers that sell RWD happily spread the claim that Google recommends it. It’s true that Google once stated that it recommends responsive, but they’ve never connected this to a negative implication regarding SEO rankings and they certainly have never called out the profound differences between content sites and commerce sites. Google makes its billions off advertising and it’s easy to see how responsive makes THEIR job easier. But, obviously, the real question is what is right for you, as a merchant.

Plus, Google almost immediately backtracked from this recommendation. Maile Ohye, SEO lead at Google, clarified that Google is neutral among the 3 different approaches: responsive, dynamic content, or a dedicated mobile site. What he said, regarding best practices from the perspective of Google crawlers & algorithms, was, “All three options work well for users and for Google, so use the best implementation based on your infrastructure, content, and audience”.

Again, retail sites and content sites are NOT the same. You can read more about this in The Definitive Guide To Technical Mobile SEO from SearchEngineLand, a major authority in this space. The key to understanding here is the use of alternate/canonical tags on the desktop & mobile sites respectively, as recommended by Google.

Of course, Unbound follows this best practice, while delivering a custom mobile experience built from “whole cloth” specifically structured for maximum mobile conversion rates, delivered to a (growing) mobile audience.

In fact, there are times when RWD actually hurts SEO rankings, as noted in this article, titled “When Responsive Web Design Is Bad For SEO”.

“The one URL argument for dynamic serving and responsive design’s superiority is moot with the introduction of switchboard tags, as Google can now understand which site should appear when regardless of URL structure.”

2) The One-Site-Fits-All Fallacy

The promise of RWD is that a single set of HTML codes can serve all device sizes. This is possible because the site is able to adjust itself for that screen size.

While it’s a neat trick and an easy, quick sell, we assert that this approach is actually a significant disadvantage, especially for retailers. And top e-commerce retailers seem to agree. Amazon, Walmart, Staples, Zappos, (and Google). All of them could employ any approach they want and have decided that responsive is not for them. Why not? Here are some key reasons:

  • RWD sites are slow.

    All the code (for mobile & desktop) is delivered to the browser. The browser has the responsibility to sort it all out based on what kind of device is using it. This takes time and every second a page loads kills conversion rates.

  • Mobile is so much more than just a difference in screen size.

    Mobile is personal, and it is always on. Mobile commerce is conducted in different ways for different reasons, at different times. Mobile consumers behave differently, so why offer them the same experience as desktops, shrunken down? Mobile is FAR too important to be thought of this way. And will only become more so.

  • Is RWD really simpler?

    Rather than being simpler, responsive is actually more complex in many ways. If you want to make a change to the desktop experience, you need to test it on ALL leading mobile devices too. This is because mobile & desktop are inextricably entangled.

  • RWD costs more.

    Retailers that investigate quickly find out that the site build costs for responsive far exceed the cost of a typical dedicated mobile site. And for the reasons stated above, the long-term implications add even more. Content and visual assets are often built twice. This adds unexpected time, effort, and… cost.

  • Mobile is trapped.

    The requirement for using the same code base for mobile and desktop is really a limitation, not an advantage. Mobile is “trapped” and sentenced to always be a “necessary derivative” of e-commerce.

Simply put, if you want to create a distinctly mobile experience for your growing mobile customer base, designed for maximum conversions and fast page load times? RWD is NOT the right choice.

Summary

RWD has no SEO advantage. It’s clearly more expensive up front, and we don’t think there’s any ongoing cost of ownership advantages. And in our view, it’s not really mobile optimization. Because it’s dependent on the desktop site code, it’s more of a mobile compromise, rather than any advantage.

At Unbound, we employ RWD in select circumstances (usually in the checkout flow, when required). But we don’t think that merely resizing a website based on screen size is a sufficient methodology for mobile optimization. Very different settings use mobile. This leads to different use cases and priorities. Maintaining the ability to cater specifically to this rapidly growing audience is KEY.

The mobile experience needs to be much more than the shrunken version of your desktop retail offering. We think the best way to achieve that is by using distinct, mobile-optimized templates and built-in mobile features. We can design & develop them for the mobile user, to achieve maximum page load times and conversion rates.

Plus RWD is typically more expensive to implement and negatively impacts site performance.

As mobile grows, so do the negative implications of locking yourself into a single code base that is trying to be all things to all people.

Is Responsive Overhyped?

Is Responsive Overhyped?

Responsive Web Design is all the rage.  All of a sudden, we hear advocates asserting that “responsive is the way to develop sites.”  Or “Google recommends responsive for SEO.”

Observers might think that this approach has become the de facto standard among e-commerce leaders.  But a close look at the top companies in the Internet Retailer rankings, reveals a surprising reality:

Responsive Adoption among Top Retailers March'15

Among these top 16 retailers, only 2 have gone with responsive, despite obviously having the resources to do so if they wished.

So, what’s the disconnect here?  Why hasn’t this hot-trending technique taken hold among the industry leaders?  Are we confusing mobile-friendly as mobile-optimized?

Pros & Cons Summary

The table below summarizes the key advantages and disadvantages of responsive and dedicated approaches to mobile.

Responsive Dedicated
Advantages
  • Satisfies Google’s mobile-friendly requirement
  • Only 1 site to maintain leads to a low cost of ownership
  • The mobile experience is not tethered to the desktop experience
  • More cost-effective if you want to maintain mobile as a distinct experience
Disadvantages
  • Slow performance
  • Higher one-time cost
  • Disruptive to the desktop site
  • Two sites to maintain

What Is Responsive Web Design?

We can answer this from 3 vantage points:

  • Technical: Responsive is the use of a media query in a website’s HTML, giving formatting instructions to the browser, and instructing the browser how to reformat the page to fit the width of the screen.
  • Design:  a design approach that allows different device types to be served by a single set of HTML pages.
  • Strategy:  an approach of “one site fits all” for handling different types of devices.

Responsive Technique

Another way of looking at responsive is how Google positions responsive alongside the 2 other recommended approaches to mobile:

  • Responsive web design: Serves the same HTML code on the same URL regardless of the user’s device (desktop, tablet, mobile, non-visual browser), but can render the display differently (i.e., “respond”) based on the screen size.  Responsive design is Google’s recommended design pattern.[1]
  • Dynamic serving [aka Adaptive]: Uses the same URL regardless of device, but generates a different version of HTML for different device types based on what the server knows about the user’s browser.
  • Separate URLs [aka Dedicated]: Serves different code to each device, and on separate URLs. This configuration tries to detect the users’ device, then redirects to the appropriate page using HTTP redirects] along with the Vary HTTP header.

[1] Google goes on to say that they do not favor any particular URL format as long as the page(s) and all page assets are accessible to all Googlebot user agents.

Responsive Strengths

Responsive is an elegant solution for handling small screen sizes.  By reprogramming the desktop site’s HTML and redesigning the layout, site owners can deliver pages that know how to adjust for screen size via a media query, that lets the html respond to the browser’s screen width.

Responsive meets the standards Google has set for being mobile-friendly.  Due to this, responsive sites, properly done, will be saved from Google’s Mobilegeddon.

And because of the “one-site-fits-all” approach, there are fewer content elements to control and therefore fewer management tasks.  Advocates of responsive say this leads to a lower cost of ownership.

Responsive Weaknesses

Responsive has one glaring problem:  slow page load speeds.  A responsive page works by delivering more content to the smartphone, and then asking the mobile browser to sort things out based on its screen width.  This performance gap was reported by Internet Retailer:

It turns out responsive design sites are slow on smartphones, very slow. That’s the conclusion that emerges from an Internet Retailer-exclusive, monthlong study of 12 e-retail responsive design sites conducted by web and mobile performance testing, monitoring and analytics firm Keynote.

A secondary weakness is that deploying responsive is complex and can be disruptive to the main website.  As a result, responsive deployments tend to be more expensive than dedicated projects.

Dedicated Strengths

Dedicated is the better choice when a retailer actually wants to have the mobile experience different than the desktop experience.  The “one-site-fits-all” advocates might ask why you’d ever want to deliver different experiences. There are several compelling reasons because – as we all know – mobile is so much more than just a small screen:

  • Mobile UI Capabilities – Mobile brings enhanced capabilities for interaction – such as location, touch, voice, camera, fingerprint, and motion. All can add richness to the mobile experience.  Today’s desktop site does not support these capabilities, nor does it need to.
  • Different User Circumstances – Consumers have their phones in many places and settings that the desktop site needn’t worry about:  in stores; on sports fields, in the garage, where the retailer’s product is being used; or in social settings.  Most retailers can find new advantages here.
  • Different Desired Outcomes – Because of its omnipresence, mobile is the ideal omni-channel device.  We know consumers use mobile for product discovery & research, even when they complete the purchase in a different channel – online, in-store, or call center.  Why wouldn’t the mobile UI help facilitate this in a way that’s different than the desktop?  Different calls to action; and different ways to prioritize them.

Dedicated Weaknesses

The conventional wisdom is that a dedicated site is something else to manage and that it represents an additional cost of ownership.  Conversely, the counter view is that dedicated is a more cost-effective way to manage your mobile customers.

In addition, it is often asserted that Google will give an advantage to responsive sites.  But, as discussed in the What Is Responsive section above, Google states that it does not favor responsive over dedicated.

Perspective

  1. Responsive is a good choice for adapting a desktop site for the small screen.
    As a web development technique, it’s an elegant way to deliver a small screen experience.
  2. Dedicated sites are the better choice if the retailer wants the mobile experience to take full advantage of uniquely mobile capabilities.
    For retailers who want to get the most out of mobile, dedicated sites make it easier to build a mobile-specific experience — one that takes advantage of unique mobile capabilities that the desktop site isn’t geared for.  And to deliver different calls-to-action that optimize across all channels.

Responsive is a very useful technique for adjusting web pages to screen size. Due to this, developers love it as a tool.  Unbound uses it as one of several methods for integrating the mobile experience into the retailer’s web infrastructure.

But that doesn’t make it a good mobile strategy.

If mobile-friendly is good enough for your company, then responsive is a fine choice.  Comparatively, a better choice for your company might be to take full advantage of mobile-unique capabilities and deliver a distinct mobile experience.  Unbound loves working with retailers who want to make the most out of mobile.

 

Keith Lietzke is the Co-Founder of Unbound Commerce.  You can reach him at [email protected].