Responsive Web Design – The Changing Shape of The Future

Anyone with kids can tell you that they’re always staring at screens, and it’s rarely the TV. The development of devices and social media over the last ten years has made the online world available to anyone, anywhere, and the demand for it is ever increasing as mobile technology offers better devices and connection speeds every year. People are now accessing websites on phones, tablets, laptops, PCs, workstations and games consoles, and this has produced a major challenge for web designers. What looks great on a desktop screen can look awful, and may not even work, on the 3 inch screen of a mobile phone.

So how is the Web design community responding to this, and is it possible to have a great looking website that works across the whole range of devices and different screen sizes?

The initial response was to start designing separate websites for each device. So if you were logging on with an iPod you were actually viewing a different set of web pages than you would have seen had you been using your laptop. But this was a lot of work, and still limits the number of devices that will provide a really good view of that website. You could end up with the web designer having to produce six or more versions of the same website, and this doesn’t even take in to account what happens when a new device, with a different sized screen, hits the shops.

A new approach is needed, one which provides a general solution both for future devices and the full range of existing devices, and this is what Responsive Web Design achieves.

Traditionally websites have been designed and built a fairly fixed way, and when a device displays that site, the browser shows it as best it can. This means that when a smaller device like a Blackberry tries to show a web page that has large pictures with text wrapped around it moves the elements around and the design is often lost. Responsive web design tackles this by recognising the device that the page is to be viewed on, and then being able to adjust the layout of the elements that make up the page accordingly. To make this work new website design software is being developed, and web designers are just getting to grips with this new approach. Over the next few years, however, this approach will become the standard to which all websites are built.

The development will also lead to new thinking about page designs as it’s no longer a case of just mocking up ideas on a workstation screen and seeing what looks good. The website pages will have to look equally good whether they’re seen large or small, portrait or landscape, and a single design will no longer meet all the requirements. A more modular approach is needed, where each page is made up of a number of elements which will be arranged differently according to the device that is used to view them, and the orientation being used. The design of a website must be flexible in a way that has not been workable until now.

The industry is having to come to grips with “flexible images” and “fluid grids”, “media queries” and “responsive type settings”. This is the new technical jargon of the tools that allow designers to create websites in a responsive way. The software that makes responsive design possible is already available, and improving as the techniques are becoming better understood, but the real change needs to happen with an existing generation of website designers who are looking at a major shift in their skill sets.

The tools are there, customers are demanding websites that need to look good across a whole range of devices, all that is needed now are Responsive Web Designers.

Leave a Reply