Responsive Web Design Guide

Why Responsive?

In 2015, Google updated their algorithm to favour websites that are mobile friendly over those that are not. Basically this means that if there were two competing websites in the same niche of equal standing in search engine terms, one being responsive and one being static, the mobile friendly version would receive a higher place in search engine results. In industries with lots of competition, this could see websites losing many places in search engine rankings.

For this reason it’s important to make sure you have a responsive website that Google sees as being mobile friendly. Google has a tool that tests your site for responsiveness – take the website mobile friendly test.

Also, as increasingly more people use smartphones and tablets to browse the internet, you could be cutting your self off from 80% of the visitors to your website because the site just doesn’t look good or function correctly on these devices. It makes sense to cater for your audience’s tastes by making your site accessible to all users.

What is a responsive website?

 A responsive website is built on a fluid layout that adapts itself to the browser window, giving a view of the site that suits the device and screen size of the visitor.

A website can show different elements to different devices, catering for not just screen size but the fact that mobile visitors may have a slow data connection. For this reason current web design trends favour flat colours, easy to read and simple layouts and are designed to be as lightweight and as fast as possible. The images, text and other elements resize and reposition themselves according to the browser window.

How to make your website responsive

Unfortunately there is no easy fix – a website must be coded to be responsive, and will probably need the layout completely redesigning to allow for the needs of a fluid layout. You cannot take an existing site and just “make it responsive” and many people take the opportunity to redesign their sites completely.