Why is responsive mobile design important for my website?

Its primarily about the usability of your site for your visitors, and it makes sure that the content is scaled and displayed in a friendly manner.  Websites which aren’t mobile responsive can be difficult to navigate around, particularly if the website wasn’t laid out well to start with.

However there is an extra reason to make sure your website has a fully responsive mobile design, and that is because Google will start using this as a ranking factor.  Your current website may be penalised in the search results because of it, and those with it will gain an advantage.  Google has for some time now valued websites which are regularly updated as this shows that you care about your web presence, and therefor should be ranked higher against static websites which are not regularly maintained.

To see how a responsive mobile design works I’ve created some examples below.  You can also see this for yourself by opening my website on a tablet or mobile device.

Example 1 – non responsive mobile design.

This is what my site would look like on a mobile phone if it didn’t have a responsive mobile design.  You can see that the website overlaps the screen and you have to scroll around the screen to see the content. Of course you could ‘pinch’ the screen to display more, but that could make the text more difficult to read.  As soon as you go to another page, the size will reset and you need to pinch in again.

Example 2 – Fully mobile responsive design on a tablet device (Apple or Android)

You can see that the website is now laid out in the mobile responsive design, and that the width of the site is matched to the screen width.  The elements are now laid out in a vertical manner, and stacked on top of each other.  The slider and other elements also scale correctly to the width.

Example 3 – Fully responsive mobile design on a mobile phone (iPhone, Android or Windows)