The amount and variety of devices we access websites on is increasing all the time and varies hugely; the combinations of Phones, Tablets, Desktop PC’s, Laptops and the Operating System and Browser Software running on them are practically infinite... Responsive Design is the answer to this.

Responsive website design is a method of building websites that changes the formatting of a site in order to suit the screen size of the device it is viewed upon. It uses various techniques to reformat the content so that you can best present a page to the user in whatever way it looks best for their particular setup. The goal of a responsive web site is to have the best experience viewing a page if you are accessing it through a traditional desktop screen, tablet, mobile device or larger monitor.

Going Responsive

Here at mtc we have made major changes to our backend and front end code and systems to allow us to put together amazing examples of responsive sites. More and more of our clients are now specifically requesting this as a must have feature. Here are some examples of sites we have put together at mtc -

• Umbro
• Brightsolid
• Paterson Arran
• Kiddiegoods

The traditional website is set to a static width that suits a desktop that smaller devices will attempt to make useable by allowing to zoom in and out of to see. This is still the way we build most sites because one of the drawbacks of responsive design is a longer development time which usually means a slightly larger budget for your project. Here at mtc we still produce these with Begg Shoes being a recent example. If you load up the website on your smart phone you will see that you get the exact same representation of the site that you get on the desktop version of the site, the site is still functional but if you are visiting the sites listed above you can see how the information is presented in a much clearer and more readable way.

A mobile redirect site is the other alternative here, this gives you the main selling point of Responsive which is a mobile version of your website. The device is detected before the page is served to your browser and a completely different page is sent. This requires maintaining two different versions of each page on your site and for us it means creating at least two versions of the page completely (more if you want to cater for different categories of device). This can lead to problems when adding new features later we have to create a version that works on the desktop version of the site and a version that works on the mobile. We do use this method on older sites that need to add a mobile version but do not want a full redesign of the whole website. Responsive is the preferred option always but it is sometimes difficult to add to a website that was built and put together without any consideration that it would be turned responsive later... so this is an option we can offer for complicated sites that would need significant redevelopment to be able to offer a good responsive solution.

Another alternative would be an app which is useful for certain cases, even within an app there is a certain amount of responsiveness that can be built in that is helpful... the slight differences in width for the iPhone can be compensated for on the app store by structuring your project like a responsive site which can mean that the project does not have to be split into several different versions of the site depending on version platform.

1. You will rank higher in search engines

It may come as no surprise that Google are the kings of search with roughly 70% of all search traffic coming through the search giants. Based on this a lot of our SEO marketing efforts are geared towards getting our sites high in the rankings in that particular search engine, doing well in Google usually ticks all the boxes for what puts you on top for the other search engines as they take their lead from Google about what constitutes a good resource on the web that they like to link to. Google have made it clear that the preferred method for building websites is responsive design.

Through Responsive Design you are only ever serving up one version of the page which avoids a big SEO problem of creating duplicate content. Duplicate content on a website will result in a drop in your placement in the rankings and is often created accidentally. A responsive project gets around the problem of having a complicated set up of redirects which can be difficult to manage and may create several versions of the same page… with Responsive Design there is only one page for the search engines to index and any SEO work done on that page will apply to all devices.

2. You can share your pages

If you are sharing your page on various social networking sites you are only sharing one page which suits all devices, not a tailored page for your device. This means the ranking power that offsite linking gives a page is focused on one page and not different versions of that page which will help get you higher in the rankings.

3. It will make better use of your budget

If you created a different version of the site for each device tailored specifically to its features and screen size it quickly becomes impossible. The mtc website stats track 30 different operating systems running 300 different browsers, with those 3 combinations alone teamed with the devices they would run on Responsive is the only way to try and come up with a solution that will work across all of them. The previously discussed mobile redirect solution effectively leaves you with two websites to maintain and not one, a fresh project can be turned responsive quicker than a mobile redirect site can be put together and you end up with a better solution using this method.

4. Tracking your site becomes easier

When setting up tracking beyond the stats we offer as standard in the form of traffic funnels, bounce rates, referral stats you can more easily track one page and consolidate the data produced. Mobile redirect sites are difficult to track as they often involve different pages completely. The data we can give you on a responsive site is more focused and easily understood which should allow you to make better decisions on improving your sites performance.

5. You will be ahead of your competition

Responsive web design is the way sites will be built from now on, we anticipate a point where we will switch from offering this as an extra service to offering it as a part of our service. By going Responsive early you are separating your web site from other web sites who have not made the leap yet into using Responsive. Browsing your immediate competition on your smart phone or tablet should give you immediate feedback on how set up they are for these growing device markets. Most sites either have not made the leap yet or are still using mobile redirect versions of the site to cater for mobile devices.

6. You will make more money

Ultimately the goal of the website is to support the business goals of the client. As responsive design will make your web site project more available and readable to many different devices and easier to traverse your conversions (whatever that conversion might be) will go up. So the website will perform the function it was intended to do, increase your visibility in search engines while making the finished web site product a better solution for your needs.

Conclusion

All websites can be turned into responsive websites... but if you should go for it with your project depends on the time needed to do this well versus the benefit it will bring. We are often asked for our advice and we encourage this as it is sometimes a complicated decision especially for sites with an existing presence on the web what the best course of action will be... we evaluate what the project is and does currently and often present several different options about how best to use the budget to improve your project. Hopefully this article has provided some guidance on what Responsive website design is and the benefits it can bring but feel free to get in touch with us to discuss your options further should you need to.