TempleDene Consultants

 Websites Brewed in Yorkshire

What is Responsive Design

responsive design image, 4 devices, same website on eachIt's a term we've all heard, these days website have to have "Responsive Design" but what is it exactly?

A responsive website, simply put, responds to the size of the screen or window they are displayed in, in particular for smartphones or tablets.

In more technical terms, the website actually has a number of sets of instructions, or responses, which the browser (Chrome, Firefox, Internet Explorer etc.) can choose to use depending on what size the viewable window is. It's really the browser responding to the instructions from the website in a different way, depending on what the browser knows about how much space it has to display the website.

This is done by using a stylesheet, which has separate sets of instructions for different widths of display area, usually just two but sometimes more.

The stylesheet is able to for example, move parts of the website about, or even remove parts that are not required on a mobile device. It can replace one part of a website suited for a larger screen with another part that is better viewed on a smaller screen. For example you might want to have a smaller version of your company logo so on a mobile device it loads faster and still looks good.

Why is this important?


More and more these days people are accessing websites via either a smartphone or tablet. In fact it's now more likely someone will view your website on such a device than a "proper" computer or laptop. Your traditional website, designed to be displayed on a nice big screen, will look very bad on these devices.

By using a responsive design that offers alternative layouts and font sizes you can ensure that your site is readable and pleasant to use no matter what people are looking at it on.

Why responsive design?


There are other ways to achieve this, a technique called "browser sniffing" can try to work out if you are using a mobile device, and what sort of screen size to display for, this however requires keeping a reasonably up to date list of devices, something that is prone to errors and mistakes.

Another way is to design your website for mobile devices first, then just hope people don't mind it looking a bit "large" on their computers. I wouldn't recommend this however.

Responsive design easily beats both these techniques by offering the browser a choice of layouts that the browser can the select from, it keeps you very much in control of the user experience of your website for what is really very little extra work on the part of your web designer.


Posted by Peter on Thu 6th Jul 2017 08:06:20
Read 149 Times
Last Modified on Thu 6th Jul 2017 08:17:27

Share This Page