Last year, mobile phones accounted for 17% of global web usage, and that figure keeps growing as more and more people are adopting smartphones and tablets into their lives.
Our readers are a sophisticated bunch, so this probably isn’t mind-blowing news, but it does beg the question: Should you optimize your website for mobile or desktop? When it’s time for a new website, you should understand not only who your audience is, but also how and where they will consume your content.
Responsive design is the norm today, and only the most strictly controlled corporate sites are offering resistance. For those who aren’t quite familiar with that term yet, responsive websites are developed so that all elements within a web page dynamically adjust in size and position according to the device being used and size in which it’s being rendered. Ten years ago, most agencies and web developers didn’t consider mobile devices when building websites, and if they did, it was typically handled with a separate mobile website, complete with a separate code base. Now, with responsive design, you can create one website and serve that content to just about any device.
So you’re probably guessing that we’ve got the whole mobile thing solved with responsive design, right? It seems that way on the face of it: create one site, make it responsive, and then set it and forget it. But that’s not quite right. You need to go deeper than that.
For example: What do your website analytics say about your prospects? Your analytics should show you visitor demographics, but most relevant to this article, the screen resolutions at which they are viewing your website as well.
If 90% of your traffic views your website on screen resolutions of 1920 x 1200 or larger, then it makes sense to optimize your website for larger screens (although that percentage will undoubtedly lower over time if current trends continue). But what if your analytics show that resolution sizes are all over the place? You should consider then whether or not you want to develop for mobile first.
What is mobile first? Mobile first is the development philosophy that you should optimize and design for mobile devices first and foremost. That impacts everything from UX to information architecture to the types of content that are relevant to users of different devices. It can be quite counter-intuitive for those who aren’t used to that approach, but it’s a good exercise in the sense that it forces you to really think about what’s essential and what isn’t. The approach then continues with what is called progressive enhancement. Progressive enhancement is a systematic way of adding non-essential elements as the screen size increases, so that by the time you reach the desktop range of screen sizes, all essential and non-essential elements can be seen.
Why should you develop for mobile first? Really the main arguments for going mobile first are two-fold:
-
It forces you to strip the website down to essentials to streamline and maximize the experience for mobile users.
-
Because only those elements of the website that are deemed most essential are loaded on mobile devices, there’s a secondary benefit that comes in the form of faster page load times. Most of the time, as we move about our day (whether we’re traveling around town or across the country) we access our mobile devices through phone carrier network connections. As everyone can all attest to, that oftentimes means dealing with an awful signal. Websites created with a mobile-first philosophy tend to load much faster because they don’t need to load all of the extra embellishments that are shown in the desktop version. If a website visitor decides to browse to your website, and it’s loading time exceeds their patience, they will most likely bounce somewhere else.
What are the drawbacks to mobile first? It can be a much more time-consuming process, because not only do you have to let go of visual embellishments at the mobile level, but you also have to think through every “jump” in size in order to finally reach the largest, desktop version of the website. This can be a difficult process for both designers and developers because it warrants a change in paradigm about how websites are created. It also requires a bit of extra work for both the design and production phases of website creation.
The great thing about responsive design and mobile-first development is that it can be done for most any new website. At Newfangled, this can be done on both our WordPress and NewfangledCMS platforms. Leave a comment or feel free to contact me directly if you’d like to discuss this process more.