What does 'Responsive' mean?! And how do iPages 'do' responsive?

Responsive design seems to be the latest buzzword online. It can be bewildering knowing exactly what this means. However, everyone is sure that ‘responsive’ (whatever ‘responsive’ is) is critical.

But what does responsive really mean? Is it as important as everyone thinks? And should your website be doing anything differently?

Let's start with some background definitions...

Before we even talk responsive, let's talk about how websites are designed. Web pages are structured with HTML code and then styled by 'style sheets' (CSS). 'Style sheets' alter how the web page is displayed. Style sheets can have within them 'media queries' which are used to detect the browser window size, media or device the webpage is being displayed on and so deliver different styling for each different device or browser window size detected.

'Responsive design' refers to how a website appearance responds to the device or browser size it is shown on. The goal of responsive design is to build web pages that detect the viewer's screen size and orientation, and change the layout viewed accordingly in order to deliver the best user experience across all media used to view the website.

How do you make a design 'responsive'?

Most designers make use of the style sheets (CSS) with media queries to deliver different styling to different sized screens and devices. Certain content within a web page which can’t be easily moved with the style sheet alone is simply marked up to hide it. There are often multiple different sizes of images which are delivered but only the size most appropriate to the sized screen is actually shown on the page. There are also many more lines of code as each screen size can have a different media query for each element on the page.

This approach works, but unfortunately it can lead to slow page loading times.

How is iPages response to 'responsive' different?

Here at iPages we decided to take a different approach by detecting the user is on a mobile device and delivering purpose built content for mobiles. This means creating new style sheets purely for mobile devices and we deliver dedicated html code too.

We therefore give all of our websites the option to have a dedicated mobile site view - with hamburger menu etc. - which fulfills Google's 'mobile-friendly' criteria and displays for all viewers coming to your website from a mobile device.

This approach gives you all the benefits of being 'mobile friendly' without having a bloated site leading to a slower page loading time.

To see a website that is already responsive within iPages visit www.morganpochin.com.

Do I need to change my website at all?

In short, no. We are contacting all of our clients on an individual basis to help you benefit from having a dedicated mobile site.

If you would like more information, do not hesitate to get in touch.