Mobile optimisation is the big topic about making your website accessible on smaller devices. Smartphones have become the go-to gadget for internet access around the world so it should go without saying that your website needs to perform on mobile devices.
Not all mobile optimisation is the same though and today we’re going to look at ‘mobile first’ design to see what all the fuss is about. You may well have heard this term thrown about over the last few years, but it’s worth knowing what makes the mobile first approach so strong – as well as its limitations – and why we still haven’t found the perfect way to optimise for devices.
What exactly is mobile first design?
Mobile first is an approach to responsive web design that caters for mobile devices first – and then adapts as screen sizes get bigger. Basically, it’s the original concept of responsive design in reverse. So instead of taking a website created for desktop and adapting it for smaller screens, the entire design project starts with mobile devices in mind.
This is important because mobile is no longer the minority, not something you can worry about later when everything else is finished. Smartphones are the world’s most connected device and you can’t afford neglect them -but mobile first isn’t about prioritising smartphones over other devices; in fact, it’s about optimising for all devices in the best possible way.
Graceful degradation vs progressive enhancement
Wow, those may sound like some technical terms, but they’re actually very simple. Responsive design that starts with a ‘desktop’ website scales down the layout and content of a page, as screens get smaller. This is called graceful degradation; while mobile first does precisely the opposite, which we call progressive enhancement.
Mobile first and progressive enhancement win this battle for a number of reasons. First of all, it’s a much cleaner design process when you start small and build as devices get bigger. Smartphones come with all the limitations: smaller screens, weaker specs, slower connections and inconsistent browser support. Design for these first and you won’t have many problems adding to your site for devices with larger displays, bigger processors and fibre-optic internet connections.
A good mobile first also performs much better than the old approach to responsive, thanks to cleaner code. With responsive design mobile devices still need to handle the code for an entire website, which can be a massive drain on their limited resources. While mobile first only gives phones the code they need and saves the rest for devices with more power – which adds up to better performance across all devices.
Moving beyond mobile first
This article certainly sings the praises of mobile first design, but this doesn’t mean we’re talking about the perfect solution. In fact, the phrase ‘mobile first’ is already in need of an update, as a plethora of wearable technology hits the shelves. The point is your target audience is connected to more devices than ever – from games consoles with 50-inch TVs to smartphones, smartwatches and whatever else consumer tech can throw at us in the future.
Which means designing with specific devices in mind is already becoming a dated approach. Instead, we’re at a point where we need to design for all devices – or, more accurately, no specific device at all.
If you need more info on mobile first design and how to get the most from your website, get in touch with our team today.