Responsive Web Design

With over 70% of the UK population research a product or service on a mobile device before making contact, it’s fair to say that making your website available for mobile phones is no longer something to be ignored.

So with so much talk around “responsive sites”, “mobile sites” and many more, what does it really mean and what do you need to know?

Mobile Sites
A mobile site is a variation of a website that’s designed solely for a mobile phone.
If you’ve ever looked at Google or Facebook on a mobile device or tablet, you’ll see that the layout is quite different and much more simplistic.
The fact of the matter is, it’s often a completely different website in reality, with different styles, sometimes content and each web page design and layout is completely different.
Mobile sites often work in conjunction with the normal website, and share content and data, but some times they are autonomous and use completely different code.

Mobile Optimised
Quite often a website can be designed so that it uses the same layouts, however resizes for a mobile device. This can mean the website using different style sheets (these define the structure and sizing of the page content) for different screen sizes. Special code can be added so that features such as touch scrolling can be used, and menus will have natural links so that they’re easy to use and access. Flash animation won’t be used as this isn’t supported on some mobile and tablet devices (most notably Apple’s iPod/iPhone/iPad).

Mobile Compatible/Mobile Friendly
Being Mobile Compatible or Mobile Friendly is really all about making sure your website renders well on a mobile device or tablet.
When a website is built, there are always variances over the different web browsers (such as Internet Explorer, Firefox and Google Chrome) and devices (Blackberry, iPhone and Google Android). With this in mind, for a website to be Mobile Friendly, it’s important to test compatibility over all mobile devices and ensure that the website renders consistently over them all.

Responsive Sites
A Responsive site is a website that adapts dependant on the screen size and device looking at it. Responsive sites are very popular the moment and make management of the site simple as there is in effect one site, one set of content and it’s only the layout of each page that changes.

All this said, it can be time consuming to build a Responsive site as in effect 4 different versions of each page need to designed, namely:

Responsive website often change their menus when in a mobile version to ensure space is well utilised.
For and example of Responsive websites visit: http://sewellgardner.com/ (try viewing this site on a mobile)

If you want to know more about responsive sites or would like to found out more about adapting an existing site, drop us a line or call us on 01727 739812.