What on Earth is Responsive Web Design? (Jargon Free!)

2012 may have been the year of 'responsive' web design, but unless you’re directly involved in designing and building websites, you’d be forgiven for not knowing exactly what the term means. But with more people accessing websites on a range of devices, it will help you to understand why responsive is so important. Read our quick, no-jargon guide to this most modern of web design principles. 

Getting to grips with the basics

In its most basic form, responsive web design – or RWD, though you’ll rarely heard it referred to by its acronym – is an approach to building websites that takes into account different screen sizes. Coding has been developed to detect browsers and respond by altering the layout and styling of websites automatically, depending on whether you’re viewing them on a full-sized laptop or desktop, a tablet or a five-inch smartphone display. 

Images are automatically resized, as are fonts, but responsive websites also tend to change their layout completely to make better use of the display.

What’s the big idea? 

The leading principle behind responsive web design is to avoid creating different websites for different devices, hosted on multiple domains, and rather to have a single website that can adapt accordingly.

For example, the traditional solution was to have a standard website hosted on your main address (or domain), and another mobile-friendly one hosted on a ‘m’ address e.g. www.yourdomain.com and m.yourdomain.com. You can still see many examples of this today, and in most cases the transition between the two is automatic. 

However, for many companies this presents an obvious problem – two or more websites to update, maintain and spend money redesigning every few years.

Why is responsive so important?

The latest KPCB Internet Trends report tells us that of the 2.4 billion internet users worldwide today, 15% of all traffic comes from mobile devices. That’s up from just 0.8% in 2008, with exponential growth set to continue.

According to KPCB, by 2015 – just two years from now – ‘mobile’ will account for one third of all global internet traffic.

It’s not hard to see why. Smartphones are almost ubiquitous these days, whether iOS and Android-based, and tablets, such as the hugely popular Apple iPad and Samsung Galaxy Tab ranges, count toward the proliferation of mobile internet usage. Add to this the success of sharing apps from Facebook, Instagram, Vine, not to mention all the emailing we do on the go, and a future where mobile dominates the internet is easy to imagine.

In fact, it’s not just a projection. In China and South Korea, mobile internet has surpassed desktop usage, and not even that recently – Q2 and Q4 last year, respectively, according to KPCB.

OK, but why should my business go responsive, marketing-wise?

Websites designed only for desktop browsers rarely look great on mobile devices, or at least they could look a lot better. The portrait orientation of most sites doesn’t translate well to small smartphone displays. Mobile-friendly websites, as well as responsive ones, tend to be landscape and easily scrollable, hence the importance of an adaptive layout.

From a internet marketing point of view, many people access social media and emails on smartphones as they check in on their friends, colleagues and read updates. This directly impacts two, if not more, of an internet marketer’s most important tools – social syndication and email marketing. 

Imagine reading opening a newsletter on your smartphone, clicking through on a news story and being taken to a mobile-unfriendly or non-responsive website; if the user experience isn’t ruined completely, it certainly isn’t helped. The same goes for updates sent via your companies Facebook or Twitter pages – many people will open these links on their mobile devices.

How can we go responsive?

It would be quite an undertaking to have a developer change your website coding to make it responsive. Rather, think about factoring it in as part of your next website redesign. Mobile isn’t dominant just yet, but it will be soon if the trends are correct.

All good web developers will offer responsive web design either as standard or as an added feature that isn’t going to break the bank. Also, many modern website templates, and even newsletter templates, are responsive, especially those from Wordpress and MailChimp respectively.

Next week we’ll talk more about responsive web design in the context of mobile, dispelling five myths and telling you how to prepare your online channels for the mobile revolution. All this is in anticipation of a big announcement in the world of not online web design, but of Inbound Marketing and Versio2.