eCommerce Responsive Design vs Mobile Theme

responsive-mobile-ecommerce

One of the most common questions I got while consulting online store owners in 2012 was responsive theme vs mobile theme – which is the best – which are pros and cons. I’ll cover it from several points of view in this article.

Does your online store need a solution for mobile visitors?

While working with online stores from all around the world, one trend I noticed is universal – growth can vary based on the country and items that online store is selling but in most cases we’re looking at ~100% growth of mobile visitors (tablets included) compared to desktop visitors year over year (2012 traffic compared to 2011).

This trend is especially true in western cultures such as USA, countries of European Union and even more apparent in the middle east where in most cases there’s already more mobile internet shoppers than desktop ones.

It’s almost impossible to neglect mobile visitor’s user experience in 2013, no matter what your online store is selling – thus you need a solution for these visitors. Will you choose to go with responsive design or a separate mobile theme or even a native app? Continue reading and find out!

If you still think there’s too few of mobile visitors of your online store to make such an investment, look at your Google Analytics data and run a year over year comparison, see the trend and see where you’ll be in one year if the trend continues. Do you still think you can neglect them?

Responsive Design vs Mobile Theme – General Pros and Cons

Let’s look at some authoritative sources, first of all, what does Google say on that topic?

Google made the graph above to show you how they see advantages and disadvantages of responsive design and mobile themes. You can read more about it in their blog post.

Google’s graph if generally for all types of websites, while in this article I’ll concentrate on eCommerce.

Responsive eCommerce design vs Mobile theme from developer’s point of view

If you’re working with large eCommerce systems such as Magento, you probably already know that it’s not very simple to make changes, it takes lots of time to custom code anything in such a strict environments, while using extensions to achieve some functionality often ends as store owner’s worst nightmare once the store crashes or breaks.

It takes much more time to design and implement a responsive theme into a system such as Magento compared to simply installing a mobile theme. However, if you’re building on a preexisting online store and not building it from scratch, it’s very likely you won’t be able to just install a mobile theme. The reason is, you might have some extensions that influence the front-end of your Magento store. In most cases these extensions will not work with your custom mobile theme, and you’ll need to build their functionality into the mobile theme.

Depending on the amount of such front-end influencing extensions and custom modifications, it might even be easier and less time consuming to build a responsive theme from scratch for you.

Let’s say you one day wish to add something to the theme or change anything in the appearance of your online store on the front-end – in case you went with a mobile theme approach, you’ll need to do everything twice! Once for your desktop theme and once for your mobile theme, since we’re looking at two different themes independent of each other.

In case you went with a responsive eCommerce design approach, there would only be one theme to take care of and all of the changes are applied to this one theme. No need for double work.

Conclusion:

From development perspective, in most cases it would be more expensive to build a responsive theme, but it will save you money in the long run.

Responsive eCommerce design vs Mobile theme from SEO point of view

Depending on the eCommerce solution you’re using and developers you have, with mobile theme approach you’ll probably end up with one of these cases:

  • You’ll have a separate subdomain for your mobile theme where all of the mobile visitors will be redirected (m.example.com)
  • You’ll have a separate folder for your mobile theme where all of the mobile visitors will be redirected (example.com/m/)
  • You’ll show the same URLs to mobile and desktop visitors but different CSS and / or layout files (example.com)

In the third case, from SEO point of view, there won’t be much difference between mobile theme and responsive design approach – however, not all eCommerce systems will enable you to achive that. In the first two cases which are far more common, you’ll need to deal with lots of duplicate content issues. Rel canonical implementation will be able to help you with this but your developers will need to custom code it for you and make sure that all of the duplicate URLs are pointing to the right originals.

From marketer’s point of view, we have the same problem with mobile themes like developers do. Whenever we need to place some sort of tracking code or implement some split testing for conversion rate optimization, it needs to be done on both themes thus doubling the amount of work in the long run.

Conclusions

If your budget allows it, go for the responsive design. It will save you time and money in the long run. In the meantime, you can check a responsive eCommerce website we recently developed. If you’d like to see some more examples of responsive website designs you can have a look at the gallery at ZURB. If you’re interested strictly in eCommerce responsive design examples, you have the site I linked we did and also econsultancy recently published a list of 10 responsive eCommerce designs.

Where can I learn more about mobile internet standards?

In my opinion the best place to inform yourself about latest mobile web design trends and data is Google’s “How to go mo” project.

That project also has a really nice tool that will help you figure out how optimized your current mobile solution is for mobile browsing.

At the end of the blog post, I’d like to leave you with a nice little infographic by Uberflip – 2013 – The Year of Responsive Design:

Infographic Responsive Design 2013


About Toni Anicic

eCommerce Consultant

SEO. Professional gaming. Home-brewed beer. Magento Certified Solution Specialist.

Read more posts by Toni / Visit Toni's profile

1 comment

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <blockquote cite=""> <code> <del datetime=""> <em> <s> <strike> <strong>. You may use following syntax for source code: <pre><code>$current = "Inchoo";</code></pre>.