Responsive Web Design Explained

Imagine, if you will, that the whole internet is a gigantic flowing waterfall of information, perpetually cascading into a constantly growing pool of other information. Imagine that each web user is standing at the side of the waterfall on, oh I don’t know, let’s say some sort of observation deck, holding a glass that can be filled with a small amount of this information at any given time. This glass can be emptied, and then replenished again with new information ad infinitum, just by leaning over the barrier and dipping it into the waterfall. Imagine that these glasses all have different shapes and appearances but that despite this, they can all hold the same amount of water; it just looks slightly different depending on what sort of glass you’re holding.


Now imagine how bad it would’ve been if that analogy had ended with some sort of diabolical water-related ‘surfing the internet’ reference.


Don’t worry, I wouldn’t do that to you.


The Point Break

These glasses, if you hadn’t already guessed, are tenuously supposed to represent web browsers, be they home computerstablets or smartphones. And the problem with optimising a website for one of those types of web browser means that you might be sacrificing functionality on the others. You obviously can’t fit the same amount of information on a smartphone screen as you can on a regular monitor whilst still having the text and pictures remain a legible size. Without zooming in of course. And few people will have the patience to read the entire web whilst having to scroll back and forth whenever they get to the end of a line of text.


A Solution

The initial solution to this was to build a different version of a web page for each browser. This can work pretty well, and in many cases actually makes sense up to a point. It’s not too difficult to shuffle the formatting round, make the text bigger, the pictures smaller and so on and have a separate website just for mobiles and smaller tablets. Lots of sites do this, including high profile ones like the BBC and eBay, so it’s not a trend that’s likely to die out any time soon. Some companies prefer to put all of their mobile and tablet functionality into a downloadable mobile app, which is also a good way of doing it. However it seems a bit of a waste to have at least two separate websites ostensibly showing the same content, meaning potentially twice the hosting costs, when up until a few years ago it was fine to have just one website. It also raises the uncomfortable question of just how many different designs a website is actually going to require in the future considering how many different web browsing devices are being released at any given time.


An Alternative Solution

It seems to follow then, that rather than having separate websites for each different device, it’s a lot more efficient to just have one really clever website that can morph itself into whatever shape is necessary and still be totally readable.


The answer is ‘responsive web design’. It effectively means having one website that can automatically and dynamically adapt itself depending on what sort of device you’re using to look at it. But it’s also a lot more than that. After all, if in 10 or 20 years time everything is apparently going to be a touchscreen of some sort, it seems a fair bet that websites are going to have to adapt to be viewed and read by an ever increasing range of smartphones, tablets, computers, televisions – even the fabled ‘Internet of Things’ – all with different visual browsing capacities.


The Future (maybe?)

With this in mind, it seems fair to say that this paradigm shift away from designing websites to be read just by personal computers is going to affect web design in the future in a pretty big way. Fluidic web design that can adapt according to context appears to be how many web designers are expecting every website to look and behave in the future.


Of course, the techniques with which to achieve this are still being experimented with, almost like throwing different types of barrel over that waterfall to see which ones can survive the impact. But who knows; it’s far too early to tell just how much responsive web design is going to catch on, or whether it will even be all that necessary. But perhaps when you’re surfing the internet in 10 or 20 years time, you might find by then that non-responsive web design has largely become thing of the past.