A Bit of history

Those of us working in design, advertising, and graphics for many years were designing page layouts to a fixed size i.e an A6 leaflet. So along comes the web, and curses, a whole variety of screen sizes and pixel variables…no problem “we will keep doing it the same way and keep everything fixed to a size that is safe on all computers”.

What this meant is that designers took the most commonly used screen size and built to that, so that meant most websites were built to around 1000px wide. If you had a bigger/wider screen then it would just have bigger strips either side of the main content.

Everyone was happy for a few years.

There were then two major contributing factors to this changing.

Mobile devices – more and more people started using their mobile devices to browse the internet, in fact Google did a survey that showed in Feb 2012, 84% of UK smartphone owners used their phone to search for local information.

A new breed of designers – the industry was seeing designers that had been trained to think totally from a web point of view with exciting new functions, in an ever evolving world of code. No longer was the industry born from people trained in print layout software and transposing those skills onto web…no…a website is both dynamic in design and content, it adapts to its environment, it needs to engage and interact with the devise its being viewed on.

So we all started building sites for mobiles

So what we were able to do was create a bit of code that asked the device you were viewing the site from (ie a phone or laptop or tablet etc) what “it” was and depending on the screen size we were able to show you a version of the website built specifically for that size. Problem was that it involved making multiple layouts and in some cases several versions of the same page. Not only was this time consuming but depending on how it was done, your website could get penalized by the search engines for having multiple content (so same content on several pages). This was fine for as short period but there had to be a better way….

Responsive Website Design and Build was born

Essentially a responsive site changes it layout, content and functionality as the page size changes. A very easy way to show this in action is simply click here and it will open our website in a new tab/window. Now simply make the window smaller and larger by clicking on the right side of the window and pulling it open and closed…..can you see it? The content is changing, the site style changes depending on its size.

Clever isn't it? What we do is use black magic and…..OK maybe not, it's done with clever design, fluid grids, style sheet elements and much more clever stuff.

Well you can now talk with confidence on what and why responsive design is here and you need to make sure if your audience is right, you are on the responsive bandwagon!