Responsive vs Mobile Websites

As you may have seen mobile web browsing has soared in the past 2 years and Google estimate that 2013 will see mobile web browsing become more common place than traditional desktop web browsing.

Typically mobile web browsers have smaller screens and users usually use their (often clumsy) thumbs to navigate around – this makes navigating some websites a real pain and research shows users will often give up if it is too difficult to use.
So basically you need to make sure your website works easily for mobile users to ensure you convert mobile users into customers.  A recent case study of ours has shown a massive improvement in mobile conversion rates after the launch of a dedicated mobile website.
So what are the options?

  • Re-design your website as a fully responsive (this is the buzz word at the moment) website– This is a website which automatically adjusts it’s visual look and feel in accordance to the browser window size.For example a desktop user may see a nice wide design to suit their screen size but should they resize their browser window, the content will adjust itself to match the screen size, ensuring it is still simple to use.This includes mobile screen sizes (e.g. iPhone), which typically have the smallest pixel widths but also will adjust itself for slightly larger pixel widths such as the iPad.Often a fully responsive website will change its entire navigation system to suit your screen size and some graphics may swap to suit smaller or larger screens.
    This is usually the most expensive option as usually your website will need to be completely rebuilt, however it is certainly considered the most technically elegant solution as each and every different screen size is catered for.
    Example: see – try it out by resizing your browser window!
  • Build a specific mobile version of your website–  this is a commonly used method which swaps the entire visual style of the website based on whether the user is using a mobile or desktop device.Usually a script is used to detect a mobile browser and then serve the mobile user a different website design to make it easier for the user to navigate.
    Typically the same content to the desktop website is used but the content is completely re-organised to suit specific smaller screens such as iPhones.Should a desktop user resize their browser window the website stays at the same pixel width and usually we choose to serve the desktop website to tablet users (such as the iPad)
    We currently utilise this method.
    This is usually a cheaper option as the existing desktop website will not necessarily need to be altered but is a less elegant technical solution.
    Example: see – this is made for an iPhone so obviously is best viewed on a mobile device.

So what should you do?
We are advising customers on a case-by-case basis, but should a customer be building a brand new website it is definitely worth considering a fully responsive website.  For existing websites it may be easier, cheaper and simpler to create a mobile version of their website (see some examples here >>)
A fully responsive website is a great demonstration of technical ability and many agencies (like us) are redesigning their websites to demonstrate their ability but it does come at a cost, and not just a monetary cost.
A fully responsive website does create some design limitations and when any edits are made you need to consider every different screen size before you carry them out.  It also may be more time consuming in the future to create different graphics for each screen size and some design elements may not be possible at all.
Admittedly if done well, responsive websites are great, but we cannot expect our average customer to be too impressed – after all they just want it to work and they may even notice a lesser visual experience due to the new limitations in design.
Some of the big boys have opted for mobile versions (maybe just for now) such as eBay and Amazon as making their websites fully responsive is a massive task (maybe even not possible)
Either way we need to consider mobile users and also a range of different devices to ensure their experience of your website is a good one.
Find out more about our mobile website design services here >>
Further reading: Smashing Magazine 

Written by Oli Yeates


Follow Oli on Twitter