Responsive Web Design v. Mobile Site

Responsive Web Design v. Mobile Site

View profile for David Gilroy
  • Posted
  • Author

Back in 2008, analysts predicted that by 2015, mobile Internet usage would surpass desktop. Well, as it turns out, they were spot on. In 2015 we saw mobile searches finally overtake desktop searches – not because desktop searches were decreasing, but as a result of the sheer amount of time we spend on our mobiles. With a directory, encyclopedia and newsfeed constantly in our pockets or at our fingertips, this doesn’t come as a surprise.


Mobile Internet Growth graph from Morgan Stanley

It was clear to all that mobile was becoming increasingly important so it was no surprise when in 2015 Google modified it’s algorithm to favour “mobile friendly” sites when search requests are coming from a mobile device.

This was known as Mobilegeddon

Essentially, with Mobilegeddon Google was saying:

“Hey, you know the mobile-friendly drum we’ve been banging for years? Well, we mean it. Seriously, did it take an apocalyptic title for you to listen?!”

Businesses across the globe rushed to optimise their websites in order to provide a user-friendly experience for those viewing on smaller screens in fear of losing out to the competition. Some were stubborn and did nothing, losing some search traffic as a result.  While Google’s Mobile Friendly Update was clear in its message (“your desktop site looks awful on mobile, please do something or we will”), it opened up the floor to a whole new discussion:


When optimising a website for mobile, should we go with a standalone mobile sub-site or responsive design?

The only way to answer this question is with a fight.


In the red corner we have the mobile site aka m.site, a new site designed specifically for mobile devices with a separate URL, usually beginning with ‘m.’ or ending with ‘.mobi’ - it's a stripped down 'lightweight' version of your site, a 'Readers Digest' version if you will.

Example of Responsive Web Design

In the blue corner is Responsive Web Design, aka RWD: a website built to adapt automatically to the size of the viewing device being used. When viewed on a smartphone, these sites will typically wrap all the content into a single column and replace unnecessarily large images with smaller versions in order to minimise download speed.


So, without further ado, let the battle commence!


Round 1 - SEO
RWD gets in there with an early hit, swiping Mobile Site right in the search ranking factors. In their own words: “Google does not favor any particular URL format as long as the page(s) and all page assets are accessible to all Googlebot user-agents.” However, Google has suggested that RWD is the ‘industry best practice’, due to the fact that responsive sites make it easier for Google to crawl, index and organise content, regardless of device. Duplicating your site into two separate URL’s means that the organic search traffic is split into two: your mobile site and your desktop site. That’s 2 URL’s, so 2 separate SEO campaigns, too.

Making it easy for search engines to analyse a website’s content increases the likelihood that it will be ranked higher in search results – thus achieving the objective of SEO. m.site falls down, but gets back up. He’s okay – for now.

Round 2 - User Experience
m.site looks weak, but he’s still in the fight. Designed to be user-friendly when accessed on a smaller screen such as that of a smart phone, the separate mobile site does provide a smooth user experience when viewed on a mobile phone. If your desktop website contains graphics that wouldn’t load properly on mobile, then yes, it makes sense to create an m.site. Furthermore, having an m.site allows you to load ‘mobile-only’ assets onto the site, such as contact features like ‘tap to call’. RWD on the other hand will simply resize/reshape the original site, meaning there are no features on the site unique only to mobile. m.site gets RWD in the clinch, and RWD starts to struggle.

however 

The drawback in having two separate sites (desktop & mobile) with a completely different layout means that when a user accesses your website on their mobile and makes note to return to a certain part of your site later when at their desktop, they will have to find it allover again, causing frustration. Responsive design places strong emphasis on the user, adjusting content to fit any screen, meaning less work for the user and therefore increased satisfaction. Plus, the simplicity of the m.site involves stripping down the content; only presenting the user with a certain amount of pages to make for faster load times. Since we spend increasing amounts of time reading on our mobile devices, this minimalistic approach is no longer ideal. RWD will not stand for this. RWD never hides content. He gets up and delivers a powerful strike to m.site, right where it hurts.

Round 3 – Site Maintenance
Things aren’t looking so good for m.site. “What happened? I used to be so good. I was top of my game,” he thinks, as the cutman tries to treat m.site’s injuries. He’s right, he used to be the best practice.  But times change, and new trends become old news. A site which is built using RWD is far easier to manage, and is less time consuming since there’s much less content to organise. It’s the simple case of one site being easier to manage than two. It’s a critical hit.

m.site can’t take anymore. He’s down. The ref counts to 10, m.site can’t get up.


Conclusion
Well folks, it looks like we have a winner, Responsive Web Design (RWD) is clearly the way that all websites should be built – fortunately for us it’s the way we’ve been building sites since late 2014. So just to summarise – the knockout reasons why your site should be responsive are:

  •  Better ranking in Google (i.e. higher ranking for “mobile friendly” sites)
  • Better user experience (i.e. access to the same information regardless of device being used)
  • Easier to maintain (i.e a single website not two)