Responsive Design seems to be something everyone wants to get their hands on lately. It’s a term big-wig sales managers in corporate firms will throw around, referencing sales figures and charts that show that a “responsive” website “sells” more within “my 12-14.5 year old control group from Canada”. Its expected to draw attention to the design aspect of a site somehow and generate interest.
But…err…what is it exactly?
Plainly put, responsive websites are designed to respond to the environment they are currently sitting in. Ergo:
The reason the term is being tossed around is two-pronged: responsive websites are currently cheaper than their custom designed brothers, and they’re popular. Before I get into the guts of the issue, however, I’ll quickly go over the types of responsive design.
Told you I would.
Adaptive is the closest form of design to the old ways of mobile and design. Traditionally, desktop and mobile sites were separate, and often had to be updated separately. Adaptive has taken that idea and simply cut out the part where they were separate. Confused yet?
Essentially, Adaptive allows certain fixed page widths (desktop, tablet landscape and portrait, smartphone landscape and portrait, etc…) and adjusts the page styling to fit those widths without changing the core content. Hooray! No longer do changes need to be made to each design, rather change one and they affect all.
This can often be an expensive option as each width has to be prototyped and designed to have optimal results for each size, but it still results in less work, and as such, less cost than the previous iteration of how mobile designs were achieved, and it is certainly cheaper than building a native app!
Responsive is a technological leap further; it allows a fluid grid of objects to resize without constraint. Think of it as if the browser window is full of water*. While it may compromise in design quality a bit, it can be used to future proof sites against any other devices that may come out (for example, the recently popularised 8-inch tablet market).
There are some who consider Responsive design the way of the future, simply because it is adaptive and allows the creation of content on a near infinite spread of electronic medium. THe technology to create it, however, is still young and the procedures and standards associated with it result in that small detriment to design that I mentioned in the latter paragraph.
*Editors note: Please do not pour water all over your computer monitor
A combination of both philosophies is also a viable choice. What is customarily used is a fixed set of widths for the medium to large sizes (ie: desktop computers) as well as a fluid set of widths for the smaller devices (ie: phones & tablets). This allows more specific control over each design as with Adaptive Design, however it also stops the problems associated with trying to match the vast range of device sizes for smartphones and tablets on the market.
As I’ve mentioned a couple of times, the range of screen sizes in the last five or six years has diversified. Once upon a time it was simply laptops and desktops (and there was nearly no effect to website design), but no more. To combat incompatibility, designers and developers have had to rethink how to keep their designs and websites intact over every device rather than use the tried and tested method of creating multiple websites for multiple device.
It’s not just a trend, the last few years has seen a rise in the adoption of Responsive by even some of the largest websites on the net, such as The Boston Globe, The Target Corporate Website and Obama’s 2012 campaign website.
Whoah, hold your horses there Heading Text, there are few are few things to consider before jumping on the responsive bandwagon.
Is it just a website to promote your business or is there a specific sort of thing you want your clients to see (ie: galleries, etc…)? Does the website complete a specific function or purpose, or is it an entire online system? Is it simply an advertising space or landing page designed to generate interest?
The purpose of your website’s design does influence heavily what platform it needs to appear on, for example, Facebook is a very functionally heavy website, and so the opted for a design and website separate from the desktop version to sit on the mobile (as well as a native app). Go to m.facebook.com on your desktop browser to see what I mean.
On the other end of the spectrum, if your website is simply to let people know where your business is and what you do, you may not need a mobile version at all. You need to assess your target market and requirements online before deciding on a mobile website, and the great thing is that it’s pretty easy to figure out with a web designer around!
I don’t mean that you need to get to the first page, this has nothing to do with Search Engine Optimisation; what I mean is that recently Google has announced (and more importantly implemented) that their search engine will become a hub of function rather than a gateway to the web.
I’ve found recently, especially on my phone, when type in say, Digital Developments into google search, it comes up with a little box, a map and a button saying “call”. If you are a business looking to directly attract customers through customer enquiry, you may not need a mobile design on this basis.
Again, look at your target market: who do you see? 40 year old contract builders who still use typewriters or are they a bunch of 14 year olds who think popular trends are for life? Are they boys or girls? What do those demographics say about their browsing habits? If your website is only a business listing, but you notice that the people who would normally visit you visit on mobile devices, you may need an adaptive designed website. If there is an equal proportion on desktop and mobile, it may need to be responsive or mixed.
Well that’s up to you, and it depends on budget. Look at the Victorian Teacher’s Credit Union vs. the Commonwealth Bank. Both desktop websites provide an online banking service, so the functionality is there. In the case of the Credit Union, they have a mobile version of their site to allow this service to continue online.
The Commonwealth Bank however have opted for the native app approach. They have developed multiple apps to fulfil a more rich experience in managing funds, even on a business level. While this is better in terms of quality and accessibility, native mobile applications can cost some major money. This is proportionate to the reward, of course, but if money is a concern and the need is not there, Responsive may be the way to go.
So look past the pluff and buzzwords and endless promotions of what is essentially an evolution in the way websites are designed and understand for yourself the need and function of a Responsive Website Design.
Day by day, the number of devices, platforms, and browsers that need to work with your site grows. Responsive web designs represents a fundamental shift in how we’ll build websites for the decade to come
-Jeffrey Veen