Responsive Web Design VS

Adaptive Web Design

Two approaches that both address the same issue: optimise the user experience across different devices


Lately, I’ve come more and more face to face with this question: “which solution do we have to choose between a responsive website and an adaptive website?”. It’s time to clarify that. Before introducing these two solutions, we can already say that they attempt to optimise the user experience across different devices.

Responsive Web Design (a.k.a. RWD)

Responsive design works on the principle of flexibility. A single fluid design based on flexible grids, media queries and responsive images is used to create a website that is compatible with all terminals.

Responsive Web Design (RWD)

Pros

  • The content is the same across all devices, it’s not necessary to review or adapt it. With the help of CSS and HTML 5, it is readable, accessible, consistent across all devices. It also means that you don’t have to duplicate the entry in a CMS.
  • This technique takes less time to perform and is therefore less expensive. It is often seen as a cost effective solution for providing a mobile friendly website.

Cons

  • As the content and features are not challenged, the mobile experience is not fully optimised for users.
  • Responsive design may suffer from image resizing issues or load time. For example, it is possible that loading time is longer on “old” phones because even if all the elements are not displayed, the entire page is loaded.

Adaptive Web Design (a.k.a. AWD)

Adaptive design detects the device and other features and then provides the appropriate experience based on a predefined set of viewport size.

Adaptive Web Design (AWD)

Pros

  • Users will benefit from a specific experience on their tablet or mobile. For example, the content and features will be adapted and therefore more relevant and the loading time will be faster.
  • If the website already exists, it may be more economical to go to an adaptive solution to achieve the mobile and tablet experience.

Cons

  • A fully adaptive website can cost more if it is not well planned.
  • From content’s point of view: there are 3 versions to keep up to date.

Now that we have talked about the technical side, we have to tackle the strategic part and think about the end user because there is no single solution that works for all sites.

Some questions to ask yourself

How users interact with your website?

When seeing the analytics, if data shows that mobile users are looking for specific content, it might be a good thing to go adaptive which can provide a better experience on mobiles or tablets.

What is your users’ equipment?

The latest generation of mobiles or tablets have a higher cellular rate (4G) and are equipped with a more advanced antenna. This can reduce loading speed issue in case of a responsive website. On the other hand, it will be more complicated for older smartphones to load those kind of pages, delivering adapted content and images is probably a better bet.

Are the majority of your users surfing on one or more devices?

If data shows that a large proportion of users visiting your website do it on a device, it may be interesting to offer them a tailored experience.

Is your website’s content designed for sharing?

Blogs, news website and even some e-commerce website have content designed for sharing. This type of content favours responsive design.

To conclude: choose the best experience

We have seen that both solutions have their own merits. To know which one to use, knowing what is the best experience for users while respecting the established business objectives is a need. It is important to analyse the functionality and the content’s website as well. If responsive web design makes it more binding for users on mobile devices: it would be wise to go for an adaptive solution.