Responsive Website Design and Your Business

Responsive Website Design and Your Business

When building a website, it is always challenging to make a site design look great and function well across different devices and screens. In years past it was standard practice to attempt to classify each visitor (likely using a phone or a desktop computer) as using a "mobile" or "desktop" device, and then then re-direct the visitor either to a site designed and limited specifically for mobile devices or to the 'fully-featured' desktop site. This approach was serviceable in order to show the average visitor a version of your website more suited for some phones, but it is also imperfect – for instance, did the website properly detect the phone in the first place and re-direct the user to the "m.yoursite.com" mobile version of your website? Is the visitor able to do something on the specialized mobile site that they would otherwise have been able to do on the desktop site, such as using a sign-up form or having a complex interaction with your organization? Will not this cause confusion and frustration in a potential customer or client? Do you need to maintain two separate copies of your website and update both every time a change occurs? And what about "SEO" (search engine optimization) – will your chances at best positioning your site on Google and best track and analyze visitor usage of your site be harmed by this split in traffic to two different copies of your website?

For all these reasons, the "device detection" approach to handing mobile visitors was already onerous to manage. However, the rapidly-rising sales of tablet devices and e-readers (source) and their hybrid capabilities have further muddied the waters – for example, is an iPad a "mobile" device, or a "desktop"? Why would not an iPad user be able to use any and all features of a website in the same way someone would on their home computer? This new spectrum of devices contains almost as diverse a spectrum of screen resolutions and features, and as such we can no longer pretend there is a single dividing line for the types of devices that access the internet.

Thankfully, the design community has nurtured and collaborated on a new technique which alleviates many of these problems. "Responsively designed" websites take the risk-laden idea of ​​device detection and replace it with "media queries", a new standards-based CSS3 tool to serve different visual styles depending on the resolution of the screen viewing it. In short, the website 'responds' only to the width of the screen viewing it, not knowing or caring which device sets behind the screen, and adjusts itself to fit the screen in whatever pre-planned way the designer intended. This responsive adjustment is done using the same pages, URLs and links as would be used for desktop, tablet and phone users, keeping just one set of pages to maintain and keeping your content in one SEO-friendly place. This also aids in accounting for the sheer volume of mobile devices on the market today, particularly in developing nations – rather than trying to catalog them all and assign each to a mobile or desktop experience, cleanly-designed responsive sites can have three layouts (phone , tablet, desktop) or as many as you want! Responsive sites can even be made to work with older versions of Internet Explorer.

Estimates place 'mobile' devices (tablets and phones) as outpacing desktop internet browsing in 2013 or 2014. Is your website ready to handle a mobile majority who expect to have as 'full' an experience on their phone as they would from home? While still an evolving approach, re-designing your website to be "responsive" may be the best and most practical answer yet to meet this challenge. Talk with your designer, developer, webmaster, or consulting firm – clean designs, straightforward functionality, and support for mobile devices are not just a trend, they're the best and most future-proofed ways to reach today's increasingly diverse audience.