Which is faster, responsive or adaptive web design?

Back Posted on 31 Mar 2014

Patrick Sexton, the clever chap behind varvy.com, wrote an article recently about Mobile Page Speed and which method of website design is fastest in a mobile environment.  From a business rather than technical point of view, the article can be summarised as follows.

To make a website usable on mobile ie. small screen devices, typically on mobile data connections, it can be written on the principals of:

1. Responsive Web Design - that is the website adjusts it's layout depending on the screen size being used to view it or
2. Dynamic Content / Mobile URLs (Adaptive Web Design) - that is the web server figures what device is requesting a page and dynamically serves a version optimised for that platform

Patrick concludes:

Responsive is fastest when dealing with the same content.

I agree fully with this statement however Patrick also notes:

Dynamic content can be fastest when dealing with different content.

Again I agree with the example given by Patrick, if a desktop size image is served by a responsive website to a mobile device it is a waste of time, bandwidth and mobile data allowance.

However (and this is in addition to what Patrick is saying in the context of small business websites, not arguing against it), I do not agree with removing choice from the user by deciding what information they should see based on the device they use. Sure, if you are as big as, and have the resources of the BBC you'll find cases where it is best to implement Adaptive Website Design but remember Forbes point out Adaptive Website Design takes more time and money to develop and maintain. If you own a gym, or a hotel, or any other small business you're probably limited to Responsive Website Design.  A dedicated mobile site is a popular opton but please don't presume you know what I want  - give me the full site and let me choose!  If I am served a mobile site the first link I look for is 'Show Desktop Version'.

Business owners should know there is an alternative method that can help address the issue of responsive design serving the same content to all devices, I call it Hybrid Website Design - that is to take the best elements from different design techniques (that can be afforded and managed by small businesses) and put them together. In this case we want a Responsive Website to recognise users with a mobile device and dynamically serve a smaller image (in terms of both dimensions and thus filesize).  This reduces page load time which is better for users (nobody likes to wait) and is a known Search Engine Metric (faster is better).

This can be achieved with Responsive Image techniques. In short the server can detect small screens and dynamically send a mobile optimised image in place of the larger desktop version.  I use a method based on cookies as this does not require aditional third party services or an additional HTTP request.

To summarise:

• Google recommends using Responsive Web Design for websites that will be accessed by mobile devices - it makes sense to follow Google's recommendations if you want to achieve the best SERP possible
  
• Responsive is fastest when dealing with the same content - I strongly advocate giving all users access to the full amount of information
• Every Content Managed and Online Store website I've written in the past two years is Responsive - this isn't a trend, it's best practice

Further Reading

Search Engine Watch published a neat article giving three reasons why Responsive Web Design is best for Mobile SEO.