Chris’s Octopress Blog

A blogging framework for hackers.

What Is a ‘Responsive’ Website - and Why You Should Have One

We have reached a tipping point. THE tipping point. The one that web evangelists have been predicting for years. As I write this blog, the internet is teetering on a precipice!

OK, maybe it’s not all that dramatic…

The latest news is that the average person using the internet, reading the news, online shopping, dare I say, Facebook’ing’, is now more likely to do it on a mobile device or tablet, than from a desktop PC.

Why is this important to you? Well if you don’t have a website, it’s probably not, but if you do, it’s vital. Do you know how your site looks (or perhaps more importantly, performs) when viewed on an Android device, on a tablet or on an iPhone?

Did you consider mobile devices when your site was designed? Chances are, if your site is more than just a couple of years old, you didn’t. After all, the iPhone was only released as recently as 2007, although it feels like we’ve always had them.

If you’re asking yourself if you really need a site that works on a mobile phone, then that is a perfectly sensible and reasonable question to ask, but it’s not one you have to guess. Using Analytics, as I talked about in a previous blog post, you can see exactly what visitors to your site are using when they visit your site. If only one percent of your visitors are on a mobile device, then perhaps you don’t need to worry about it. But, what if you discover that 60% of your visits come from a smartphone? And that your site really doesn’t work well on a smartphone. Well, then, perhaps a freshening up of the design might be in order.

There are now so many different devices out there, all able to access the internet, so how do you make sure that your site looks good on them all?

You could build several (many!) different version of your site and have scripts running to detect the kind of device a visitor is using and serve them the appropriate version, but frankly there are too many devices to realistically do that. And what about that new device coming out next year, or the one after that?

The solution is to build one responsive website. Now your site will automatically adjust its layout and font sizes to suite the viewing screen and you never need to be concerned about knowing what the device is.

So, how do you make your site responsive? The best scenario here is that you don’t have an existing website at all, and therefore a responsive site can be built from the ground up. If you already have a site, but it is fairly modern, was built using the best practices of webs design and is relatively simple, then it could be possible to retrofit it into being a responsive site. If it is more than a few years old though, very complicated or was not written to modern W3C complient standards, then it might require more work. This will then be a decision as to whether a new site might be the simpler and cheaper option.