The Benefits and Drawbacks of Designing Websites ‘Mobile First’
13th March 2015
In the exciting, high octane, and some might say dangerous world of bespoke website development, there are two main methodologies to consider when creating websites (and indeed when assessing a development companies suitability for you), assuming that those sites will (of course) be responsive or adaptive to differing screen resolutions and technological platforms (no really, there is no excuse anymore. Lazy developers, beware, we’re coming to get you).
The first of these two patterns is the conventional PC First (or Graceful Degradation as it’s known in the ghetto world of Web Dev) methodology; the development of a website with the optimum functionality and range of features available for the user on a standard desktop computer, where functionality and features are restricted or removed as the screen size or device power becomes smaller or limited.
The second and relatively newer approach is the Mobile First (or Progressive Enhancement*) way of web design. This is, designing a website specifically around the functionality realistically available on mobile devices as well as creating a visual design which is suited to the usability constraints of small screen sizes, before scaling up the website design for larger and more powerful machines.
Both of these methods have strengths and weaknesses, a small portion of which we will touch on below.
(*note, in no way connected to plastic surgery)
The traditional approach
For years designers and developers have been creating websites with the mind-set of more is more, surely the more functionality and fancy design available to a user the better, right? Whilst this may be one of the main advantages of the old school PC First design methodology (the user gets the maximum from your site on a desktop computer including all the helpful features and the wow-factor graphics they can physically stand), it can also be a drawback, as when it comes to make a website responsive or adaptive for other resolutions and devices, the user can often end up with just a stripped back, smaller version of their website, offering less functionality, and more regularly than not, a website not designed to be specifically used on a mobile or touch screen device. But why does that matter I hear you ask (please ask, it can get lonely in the world of website development)?
Perhaps these statistics might twist your arm slightly:
– There are over 1.2 billion mobile web users worldwide.
– In the U.S., 25% of mobile Web users are mobile-only (they rarely use a desktop to access the web).
– Mobile device sales are increasing across the board with over 85 percent of new handsets able to access the mobile Web.
Can you see a trend emerging? Well if you have, well done, a gold star for you. Whilst we’re talking figures, thanks to a wonderful Smart Insights article which can be found here we now know that:
– In 2013, Mobile and Tablet devices made up over 26% of all website traffic.
– Users spend over 30 hours a month browsing the web and using mobile web applications.
As you can see, the modern day device of choice for browsing the web is fast becoming the mobile phone, thanks to its accessibility and ease of use, so surely it makes sense to design with devices in mind. Whilst the traditional graceful degradation methodology still takes into account mobile devices, it often leads to a watered down mobile platform product, a website that feels more like an afterthought then a genuinely useable and polished end product. With Mobile first design, websites are created specifically with the capabilities and usability requirements of a touch screen or small device in mind.
There are many, many, different ways to design mobile first, but we haven’t the time to go over all of that (too busy crafting high quality websites I’m afraid), but some of the techniques for mobile first design include creating well-spaced large navigation and link buttons which can easily be used on touch screen devices, taking advantage of mobile only features such as GPS location tracking, through to loading only the bare-minimum content onto the website offering up the information the user needs and wants on one fast loading page.
Woo-hoo Mobile First design forever, right?
Errr, well not quite. Mobile First design requires a very fine balancing act between offering the users what they need and want, but not excluding larger and more powerful devices and their users, who could potentially feel disappointed and underwhelmed by the stripped back, bare-bones design approach and potential lack of functionality or wow factor. As with any development project, no two websites are the same, so it requires a careful and considered approach to find a happy medium between designing a mobile friendly website which offers the users what they need and want from your site – in one quick loading and easy to use package, and a content and functionality rich desktop website.
Therefore we must be mindful of what is necessary and desired from users for each and every different website we create, whether they are looking for wood to half start and never finish a DIY project, right through to if they are looking to buy a new car to help ease their midlife crisis.
As you can see, both methodologies have advantages and drawbacks, that’s why at Lightbox website design we use a mixture of both traditional desktop first development and Mobile First design, because we care about creating a quality and bespoke website that caters to users of all devices. Even if it takes a bit longer, it is important that we do things right.