Over the past several years, mobile web use has nearly tripled, and now delivers more than 30% of web traffic. And though mobile users were assumed to skim headlines instead of actually reading articles, recent studies have shown that more and more users are regularly reading in-depth articles and news on their mobile devices. Further, by 2016, it is expected that 19 percent of all retail purchases will be conducted via mobile devices. Such a clear increase in mobile traffic and engagement indicates the critical role that appropriate website design plays in customer interaction.
The two approaches to mobile web design have been dubbed “adaptive design” and “responsive design”. Each method has its pros and cons, which should be taken into consideration by any business in need of a mobile website.
The Difference Between Adaptive and Responsive
Though each approach can deliver a similar user experience, the key difference between the two lies in the back-end delivery method.
Adaptive design uses JavaScript to detect the user’s device and provides content specifically tailored to the device (including screen size formatting). If a particular class of devices is detected, then the website will deliver only the assets required.
Responsive design, on the other hand, uses a single template and all assets simultaneously and flexibly configures the design to fit the user’s screen size. Responsive designs use fluid grids that change when a breakpoint – a set screen size – is reached.
Pros and Cons of the Adaptive Approach
Adaptive designs optimize performance and provide content tailored to the device. It is argued that smaller asset downloads cut back on bandwidth usage, which increases speed, performance, and, ultimately, the user experience.
Some argue that another benefit to the adaptive approach is that website redesigns are easy because a website can be redesigned from its existing elements, rather than rebuilding the site.
However, the same argument about site rebuilds can be turned against adaptive in that developers must worry about more components and thus risk developing a user experience that is disconnected with different pages for different devices.
Finally, while adaptive websites might deliver an optimal user experience, they require advanced knowledge of JavaScript. This can be a problem depending upon the team doing the work. Building a website from scratch can take longer and be more costly than a responsive approach.
Pros and Cons of the Responsive Approach
A major benefit of responsive design is its low barrier of entry. But another point, that is much more important, is that major search engines such as Google and Bing prefer responsive designs because they use a single URL which, among other things, helps search engine algorithms index more easily.
Another benefit that responsive advocates tout is that new sites are easy to build and maintain, since they only require knowledge of HTML and CSS. Responsive designs do not require in-depth coding knowledge, but can still deliver an effective mobile experience from a single site template.
But with all that said, some argue that if a site is not designed correctly, large web pages delivered via mobile can mean long load times and higher bounce rates. This would be a problem due to the fact that 40% of people will abandon a web page if it takes more than 3 seconds to load. The key, therefore, is to design the site following industry recognized best practices for efficient code management, performance and user experience design.
The Bottom Line
There is no shortage of articles that proclaim that one method is better than the other. Those arguments are for the geeks. What’s important are two things: 1. that a web site performs well and loads quickly; and 2. which method is preferred by the major search engines.
Item 1 can be easily handled and tested. You can easily experience whether your site works well and loads fast. Item 2 can be put to rest this way: Both Google and Bing prefer Responsive so why do otherwise?
Case closed.