How to tell if a website is responsive

Ok I know this sounds like a dumb article to write but it still amazes me how little website owners know and understand. It’s ok for developers and designers to know all this stuff but there are some people out there that just don’t get it and it’s nothing to be ashamed of, it can be an odd thing to grasp or indeed to explain. Even today when I meet potential new prospects and I explain that “a responsive website is a website that respond’s to the device you’re viewing the site on” I go cold and shudder with the thought of trying to explain it further without sounding too technical. Even reading it back after writing it down makes me think that is such a lame arse thing to say! So the main reason for writing this article is to try and help those who still don’t really get it or understand what a responsive website really is.

So when I ask people if they know what a responsive website is they either nod with a glazed look on there face or look at me like they would like to punch me on the nose for being patronising, I know if the latter then they are either designers or developers and I should probably not speak to them again without expecting a serious barrage of abuse if not physical contact in some way! If I get the glazed look then I’m in the right place. At this moment I should probably ask them if they know how to tell if a website is responsive?

What does responsive actually mean?

Firstly lets go back to that explanation that looks so lame! A responsive website is a website that responds to the device you’re viewing the site on, this means that if you look at the site on a tablet in landscape mode it will or should look different on a phone in portrait mode. It’s not a different website it’s the same website, it’s just responding in a different way to the devices width.  Still not clear? Ok so consider having a horizontal menu that fits the width of a tablet when the tablet is horizontal or text content that is in three columns. On a phone in portrait orientation you wouldn’t want the menu to squeeze into the width of that narrow space or try and display two columns of text! Instead you’ll probably want to display an icon that represents the menu that the user touches to expand a neatly hidden menu. This then doesn’t get in the way of the websites text content or shuffle those three columns of text into one column and stack them of top of each other!

Why make a website responsive?

Also known as making a website mobile friendly. Well because of the rising use of mobiles and tablet devices we should be able to view a single website that is easy to use and has the same content but has a slightly better or seamless user experience on different devices. Just having a website that is smaller or “tiny” on mobile does not give the user the best experience. Applying responsive techniques enables the administrator to only have a single site to manage as the administrator doesn’t need to worry about managing a second mobile specific website which would double their work load. There is also the worry of duplicating the content over two technology stacks which in SEO terms is a bad thing!

How to tell if a website is responsive?

Let’s get back to the point of how to tell if a website is responsive. There is a simple technique for checking this apart from the obvious that is, and that being that the website actually looks different on different devices. Perhaps this article should be about how to tell if a website is not responsive but hey I’m nearly done and I’m not going to rewrite the article now! So this is how to tell if the website is responsive or not.

Looking at a website on a mobile device, pinch the screen and expand your fingers. If the website zooms to the point you originally pinched at then the site is not responsive.

If the website doesn’t zoom then it’s most definitely a responsive mobile friendly website and the designer or developer should be given a pat on the back for making the website that way because it will create a better user experience. Search engines like Google have said its better and that means it’s probably going to be better for search too!

So to the non-savvy amongst us I hope I have enlightened your understanding of what a responsive website is, to the designers and developers out there please don’t punch me on the nose the next time you see me!