Responsive Mobile design

Mobile websites: An introduction to Adaptive & Responsive design

Posted by:

|

On:

|

It seems like everyone’s talking about responsive design at the moment. A step beyond adaptive design, responsive design allows your existing site to dynamically modify itself to the size of the screen it’s being viewed with. So if you’re browsing from a phone you see a site optimised for a phone, and the same site enlarges when viewed from a bigger screen. Adaptive design works on the premise that a separate site, built with your mobile device in mind is presented instead of your desktop site.

You can add an (adaptive) mobile version of your WordPress site very easily, just install any one of the many plugins, or use the native JetPack features. Equivalently there are responsive themes you can download for free.

If you’ve already got a web site (and who doesn’t?), you might find yourself asking a couple of questions:

  1. Is it really going to help?This one’s easy, yes. People are increasingly browsing sites from their mobiles, tablets and a variety of other devices. It makes sense to accommodate this – after all the purpose of your website is to connect with your audience, so why not make it easier for them? There’s more conclusive (numeric) data on the benefits of having a mobile site here.
  2. How much is it going to cost to implement a responsive or adaptive design?An adaptive design can be bolted onto an existing website using (free) plugins. It won’t look as awesome as a custom built adaptive design but it’ll work ok. Whilst responsive themes exist, it’s not straight forward to customise a theme. You’ll likely end up spending some money to get this done. Services like psd2html can build you a responsive theme reasonably cost effectively – but you’ll have to invest some cash.
  3. How much effort is going to take to setup & maintain?Assuming you use plugins for an adaptive design, instead of building a second site from scratch, it’ll be very easy to implement and a no brainer to maintain. A responsive design will require some heartache to build. Even if you use a stock theme, you’ll have to put plenty of effort in (or hire someone) to get things the way you want. Once it’s your theme is configured and doing what you expect, maintenance is negligible.

So should you go mobile? And which option should you use?

You should probably already be mobile. Both questions can only really be answered by looking at your client/audience (or checking your google analytics for the volume of mobile browsers). If they’re going mobile, and are expecting you to be available via mobile platforms, then it’s time to gear up. Depending on what they’re using your site for (thank god for analytics) you can figure out how much effort you need to be putting into your mobile design. An adaptive mobile plugin might suit you if it’s specific content or a specific set of pages you need to serve up. A responsive design will likely be better suited to you if your clients are working their way across your entire site – or if the design elements of your site are more essential.

Whilst you’re mulling over your decision checkout the responsinator, it’s a great tool for seeing what your site will look like from a variety of mobile devices.
Are you planning on making your site mobile? What do you think the best way forward is?