You may have heard the word ‘responsive design’, or ‘responsive layouts’, but many people are still left wondering what is responsive web design, and how does a site become responsive? If you’ve been scratching your head and wondering questions like these, read on for an introduction to responsive design!
To understand responsive design, it’s important to first consider how use of the internet is changing. Since the dawn of smartphones, and later tablets, internet users have been gradually trickling off their computers and onto mobile devices. What we used to do on our desktop (perform searches, update our Facebook status, check our email) we’re now doing more and more of on the go. On top of that, tablets are making a major splash. According to SmartInsights, tablets exceeded traditional desktop devices for online purchase conversion rates in Q1 2013. Knowing that phones and tablets are accounting for a major percentage of web traffic, it’s logical to determine that we should be optimising our websites for users on those devices.
The first response to this phenomenon was the introduction of mobile optimized sites. Mobile sites are designed for – you guessed it – the mobile experience. A mobile site is a related, but unique version of your website. The mobile iteration is all about the conversion, with quick clicks to order options (conveniently sized to be easily tapped by finger). The desktop site is, well, the desktop site. It has more information, bigger visuals, and Papa himself. Having two different versions of the site is great – I don’t have to zoom and pinch and squint every time I want to order a pizza online via my iPhone. This is the beauty and simplicity of mobile design. But remember, people are using a lot more than iPhones to access the internet. We’ve also got tablets (of varying screen sizes), tons of desktop screen resolutions, and a multitude of different cell phones being used. Enter the world of responsive design. Rather than creating a new site to suit each mobile device, responsive design optimizes your current site to display appropriately on various screen sizes. It’s the same site, just in different formats.
Before we get ahead of ourselves, consider that not every site should be designed in a responsive format. When your conversion lies at the end of a pretty short consideration funnel (like deciding which pizza to order) and the vast majority of your visitors come to the site 98% sure they’re making a purchase, it’s not a bad idea to optimize the experience for that conversion. This is especially true if your website houses a lot of important information that may not be relevant to mobile conversions, but is important to present online.
So, take a step back and consider your offering and the purpose of your website. Is this meant to be a quick purchase channel, or a big picture branding tool? Understanding what your site does, and why people come to it, plays a huge role in whether responsive design is “right” for you.