Website Design Mobile-First or Responsive Design

Posted on Posted in Website Development, Website Usability

Mobile-first versus responsive web design

Let’s face it – when it comes to making your way through web design choices it can appear as though you’re wading knee deep in industry jargon. So I’m going to keep this simple – the debate between mobile-first and responsive websites is one of the most important concepts to get your teeth around if you’re to make the best choice for your online presence. So, let’s dig in.

Let’s start with some definitions

What is responsive design?

In the simplest sense, a responsive website is one that scales with the screen it is displayed on. Elements such as the layout, fonts and images will each be set to display optimally – whether on desktop, laptop, tablet or mobile (if you’re on a desktop right now go ahead and shrink your window down to as narrow as possible – see how everything shifts around?).

The focus of responsive web design is to ensure readability, as well as ease of use (remember just how tough websites used to be to browse and explore on the earliest of smartphones?).  Suffice to say responsive websites are well and truly here and if you ever ask a web designer about it, and they haven’t a clue what you mean, you may want to get off the phone or out of their office, quickly.

What is mobile-first design?

Whilst responsive websites have been pretty mainstream since 2012, mobile-first has been around in concept since 2009 just not used much until now, the real mobile age. It’s important to note that mobile-first is a form of responsive design – although it turns responsive design on its head by focusing on mobile first, and all other designs after (unlike responsive design, which considers all devices equal from the word go, but has an overall focus on desktop).

Answering the question – Which is better?

Mobile First Website Design
The pros and the cons

The Pros

  • Mobile-first web design ensures that content gets the red carpet treatment when it comes to mobile. This is an important consideration when it comes to simplicity and results in a stripped back design free from elements that often get in the way of user experience; think flashy banners, unnecessary animations and sliders (which are often bad for conversion anyway).
  • Mobile-first web design can result in design patterns and layouts that deliver a far more intuitive mobile user experience. It’s not merely a matter of a design that scales down, but a design that begins with the mobile user.
  • The average mobile-first website is super fast to load up.

The Cons

  • The majority of clients want to see plenty of demos, wire frames and other artefacts before signing off on a design – however with mobile first, you must very much entrust your developer to deliver, as these elements won’t arrive until much later on in the development process.

Responsive Design
The pros and the cons

The Pros

  • Beyond the fact that you’ll be able to see demos and wireframes of your website right from the very beginning, mainstream development agencies are typically far more accustomed with the responsive approach. That’s not to say that there aren’t awesome mobile-first focused designers and teams out there, it’s just that they’re slightly harder to come-by.
  • Because of the single focus of the workflow for responsive websites, development times can often (although not always) be far quicker compared to mobile-first, the latter of which effectively demands fresh new designs for tablet and upwards.
  • Responsive websites are also (typically speaking) cheaper than mobile-first websites.

The Cons

  • Without solid planning, you can end up with content heavy websites that chug and churn away on mobile – leaving your users waiting around. This is, of course, overcome by choosing the right web development agency *cough cough.

The Green Arrow mantra is simple – help businesses make the most of technology, exploiting it to best benefit their needs. This incorporates everything from SEO services to web design. If you’re struggling to decide which best foot you should put forward when it comes to mobile or responsive web design, I’m your guy. Shall we talk?