It’s hard at the minute to avoid the very popular topic of responsive web design, particularly as it looks to have become the industry standard technique for presenting mobile content. With mobile browser usage predicted to exceed desktop usage by 2014, designers and SEOs alike have been paying a lot of attention in 2012 to the options and implications of tailoring websites for mobile users.
Forecasts suggest that mobile browser usage will exceed desktop sources by the end of 2014. Source: Morgan Stanley
Unlike dedicated, separate mobile websites, responsive layouts scale and adapt to the browser or ‘viewport’ size of your user’s device. My favourite example is the Smashing magazine website you can see here designed by Elliot Jay Stocks in 2011 that today remains a benchmark example of uncompromising website usability.
So today we’re going to pick up where our colleague’s left off last week by sharing some simple pros and cons about responsive web design – covering SEO, usability and practicality.
The Pros and Cons of Responsive Web Design
Hopefully the advice will highlight the benefits and potential of responsive web design, without painting over the negatives that should also be considered and balanced.
During our own research and development of mobile products at Creare, we’ve stayed impartial to the various options particularly to ensure we don’t inadvertently damage a website’s SEO profile through hiding content in a responsive design or equally – duplicating content on a separate subdomain mobile website.
The Cons
- The additional work and culture change.
But is that really a con? I for one enjoy constantly learning and once you change fixed width habits to percentages, making a site responsive may not be as time consuming as you think. - Hiding content at smaller resolutions penalises mobile users.
A fair point, however you’re faced with this problem for any mobile site solution. Check out last week’s video by Gav and Rob for advice on prioritising your content for responsive layouts. - Isn’t hiding content with CSS bad for SEO?
Let’s turn the table to answer this ‘con’ by talking about the pros.
The Pros
- Google Recommend Responsive
Possibly the biggest pro is that Google have recently declared their stance on mobile design by backing and supporting responsive web design as their recommended solution for SEO best practice. If you checkout the Google Developer’s site, you’ll see the whole new section dedicated to building ‘Mobile Optimised Websites’. - A single website with one base of URLS
Staying with SEO benefits, because responsive websites work off a single website with the same URLS, you can maintain a single analytics profile and keep your social signals shares in one place, which will help your SEO. - Design Flexibility and a single code source
The third pro is really the flexibility you have as a designer. With a single code source, there’s no need to maintain two or even three editions of a website, potentially reducing development time and costs for designer and client.
Don’t be put off either by compatibility with older browsers. Plugins like respond.js have been established to wipe the dribble from IE’s chin so that they can handle media queries, alongside the HTML5Shiv.
We”ll then be following up next week with a simple downloadable responsive page that my brother Rob and I will share and talk through as an introduction to the CSS media queries that make it all happen.
