The One Web Approach

It can be said that we are currently living in a post PC society. Reason being is 30-50% of our website traffic comes from mobile devices and very soon desktop users will be a minority group on the web. Society is moving into a responsive and adaptive era by using what the W3C like to call a ‘One Web’ approach. The key recommendation from the W3C is to make the same information and services available to users regardless of the device they are using. This approach ensures that not only does your site work on smartphones and tablets of today but it can also be adaptable to the future screens of tomorrow. The 3 common ways of developing a One Web site is using: responsive design, client-side adaptive design or server-side adaptive designs. We will discuss each below.

 

Responsive web design is the most common form to use. The approach uses CSS media queries to adjust the appearance of a website based on the size of the device. Users are able to use a single template for all devices via CSS, which determines how content is presented on different screens. Often organisations have to undergo a complete site rebuild to go responsive. This approach works best when it is coupled with a mobile first approach where the mobile use case is prioritised during the development phase. Subsequently, progressive enhancement is utilised to address tablet and desktop use cases.

 

Adaptive design builds upon the standard of responsive design to deliver user experiences that are directed at specific devices and contexts. The approach uses JavaScript to enhance websites with superior functions and customisation features. There are two approaches to adaptive design: one is where the adaptations occur on the client side in the user’s browser and another where the web server does the major lifting by detecting various devices and loading the correct template systematically. One of the key potencies of the adaptive approach is the ability to reuse one set of HTML and JavaScript across devices resulting in a simplification of the testing and change management process.

 

In contrast to responsive design, a client side adaptive approach means you don’t have to rebuild your site from the ground up. Users are able to build on existing content while still delivering a mobile-responsive layout. For expert developers, this approach also enables you to specifically target particular devices or screen resolutions.

 

The client-side adaptive approach has a higher barrier to break through in contrast to responsive design. Developers need to have a solid understanding of JavaScript to use this approach. Because the client-side adaptations are a built up layer on top of your existing code base, you need to maintain them as your site evolves.

 

Developers are able to achieve the server-side adaptive approach through server-side plugins and custom user agent detection. Server-side adaptive offers distinct templates for each device, enabling more customisation. It also keeps device-detection logic on the server enabling smaller mobile pages to load quicker.

 

Again this approach is not so simple as it typically requires significant changes to your back-end system resulting in a lengthy and costly implementation process. The requirement to administer multiple templates raises ongoing maintenance costs. Lastly, this approach can encounter performance issues when servers are heavy.

 

Many companies are still wrestling with the basics of responsive and they’re not ready to confront the more sophisticated facilities of adaptive. Increasingly, competition and mobile traffic will drive organisations to pick the one that works best for their users.