Blog

One web approach for the screens of tomorrow (part ll)

Adaptive web design

Building on the principles of responsive design to deliver user experiences that are targeted at specific devices and contexts, Adaptive design uses JavaScript to enrich websites with advanced functionality and customization.

While delivering Retina-quality images only to Retina displays and lower-quality images for standard-definition displays, Adaptive design covers two approaches, one is a client side where adaptation occurs in the browser and another is a server side where the server does the heavy lifting of detecting various devices and loading the correct template.

The adaptive template approach, which has a higher barrier to entry than responsive and unlike responsive, needs a solid grasp of JavaScript, depends on the site’s existing templates as the foundation becoming a kind of layer on top of your existing code base that you need to maintain as your site as a whole evolves, builds on existing content while still delivering a mobile-responsive layout, reuses one set of HTML and JavaScript across devices simplifying change management and testing, ensures that only the required resources are loaded by the client’s device using most of caching functionality without disrupting the user experience, and enables you to specifically target particular devices or screen resolutions.

While achieving the server-side adaptive approach in a variety of ways through server-side plugins and custom user agent detection, this approach isn’t for the faint of heart. 
The strength of this approach, implemented as numerous server-side plugins available for common CMSs and ecommerce systems, is that it typically offers distinct templates for each device, enabling more customization, and keeps device-detection logic on the server, enabling smaller mobile pages that load faster.

While the apparent setbacks of this approach are that it typically requires significant changes to your back-end systems, which can result in a lengthy and costly implementation, multiple template management, which raises on-going maintenance costs and finally, this approach can encounter performance issues when servers are under heavy load - When mobile user agent detection is performed on the server, a lot of common caching mechanisms deployed by CDNs like Akamai need to be turned off and this can result in a slower user experience for mobile and desktop visitors.

Why don’t you stop wrestling with the basics of responsive, and get ready to confront the more sophisticated flavours of adaptive, kicking the tires on with Dow Group increasing competition and mobile traffic and coming up with de facto e-commerce sites that pick one of these three approaches that works best for you?

http://www.webmonkey.com