Responsive design: building a stretchy internet

We regularly get asked by clients to ensure that their new web site will be responsive but many don't actually have a clear idea what this latest item on their checklist actually is. Here's the lowdown.


Responsive Web Design (or RWD) is a special approach to web design aimed at creating and crafting sites to provide an optimal and consistent viewing and interaction experience for the viewer. Specifically, this includes things like easy reading and navigation with resizing and panning being kept to a minimum, and applies across a wide range of devices (for example smart phones as well as desktops).

The main characteristics of a site that has RWD is the concept of the "fluid layout" that the viewing environment has, and this is achieved by using proportion shaped grids, flexible images, and CS3 media queries. "Big deal!" You say - isn't that what tables did back at the dawn of the internet? Well, yes but while tables were stretchy containers that could expand in width to fill the available area, they did so unintelligently, the couldn't change the order and stacking of blocks of content and replace content completely with alternative content more suited to a particular viewer's environment. RWD offers exactly this.

RWD has been a long time in the making, first appearing at the start of the millennium, but has since grown in popularity exponentially through the 2000's and 2010's to be recognised as one of the top web design trends, many citing its usefulness as a cost effective alternative to mobile apps, due to its compatibility across a wide range of devices.

So if RWD has been around for so long, why is it still so important and relevant? It's not a perfect system, as one ongoing problem that designers and publishers using RWD have is that some banner advertisements and videos are not fluid, thus disrupting the entire flow of the page and ultimately the formatting. However, thanks to mobile emulators and validators, and the resizing tools offered by Chrome and Firefox, this is a manageable issue. What keeps propelling RWD forward, and what will keep it current for many years to come, is the fact that half of all internet traffic now comes from smartphones. Google, all knowing as ever, has adapted to this trend and has begun to boost the rating of sites that are mobile friendly, if the search was done from a mobile. This sounds like common sense, but is has the end result of effectively penalising sites that are not mobile friendly, or in other words, those without RWD. In essence, those looking to stay one step ahead of the curve, and benefit from the rapidly expanding mobile traffic, would do well to investigate the benefits of Responsive Web Design for their website. It's innovative and sleek style can accommodate any type of website regardless of whether it's e-commerce, informative or personal.