Multi-device design

Why mobile always matters

Published 5 years ago · 4 mins read

4 mins read

There’s a lot of buzz around regarding Responsive web design and mobile web sites. All kind of statistics from the last 2 years shows tremendous increase in mobile usage rates and in the amount of content users consume on-the-go. Plus, we are already seeing mobile-only users. No surprise thus that “mobile design” is an hot topic and going responsive is almost a no-brainer right now. But what about small web projects without a budget for complex beautifully responsive sites, like the one recently launched by – yeah that’s true – Microsoft? Well, in any case there’s still room for mobile design (and it has to be, as we will see).

Multi-device design

In this article we’ll see three reasons why tackling even a small website project from the Mobile first perspectivewill benefit everybody, not only mobile users.

1. Mobile means focus on what’s important

If you ever designed for mobile, you already know how much this statement is true. Screen real estate is obviously limited and the information architecture needs to be simplified. Thus, from the 1000 features you thought for your site/app, you will be forced to sort out what really matters. How you can do that? By keeping an eye on what the user is trying to accomplish (main user goals). And that’ great.Otherwise, you could get something like this:

An example of overcrowded screen: a banking App screen with 12 icons on the dashboard

The app provided by my French bank: too many features?

It’s easy to see how overcrowded is the dashboard of this banking app: 12 icons to choose from, with the most important ones lost in a sea of other pretty irrelevant functionalities. Moreover, there’s a sub-level of 15 functionalities if you tap on “Autres” (More). What the typical user commonly does with a mobile bank app? He checks the account balance, maybe the stocks, maayyybe his credit card movements and ATM locations. Meaning that 75% of features you see here won’t be probably opened by 90% of users. It was really needed to include them? And – if it was the case – these features should carry the same visual importanceas the most important functionalities? Don’t think so. To sum up:

Tackling design from mobile lets you sort out what are the core features of your service.

Then – once your screen real estate grows – before including something new try to find a good justification for that, otherwise drop the feature. The result will be a cleaner design with few prominent task-oriented functionalities.

2. Mobile means focus on what’s important / reprise

“Wait… You didn’t already talk about this?” Well, yes but now I want to talk from the content perspective. Let’s keep in mind that:

There is no such thing as writing for mobile. There is just good writing

From “Uncle Sam Wants You (To Optimize Your Content for Mobile)“, Breaking development, Dallas.

However, if you author content with the mobile user in mind, you will streamline your work down to what is essential. This is forced by limited screen estate – for sure – but also by the peculiar contexts in which these devices are used. Users won’t probably have their full attention dedicated to your content (hey! are you watching TV while reading this?) and in some cases they won’t even be able to look at the screen. Thus, focus and clarity in content really helps make it more easy to understand in these situations of use. At the end, the result of this process – clear, concise and relevant content – will be good also for any other type of consumption device.

3. Mobile love performance, so do we!

The last decade has seen a tremendous increase of the average web page size, that is now about 1.1 MB, according to HTTP Archive. Flat connections, multiple CSSs, heavy Javascript libraries, social plugins and plenty of images made our sites explode. Nobody cared much about how slow the web was becoming. How many time did you include the whole jQuery library just to achieve a fancy hide/show animation? I did it. More than once. Mobile browsers are great, much better than the corresponding desktop ecosystem, but mobile connections aren’t: they’re relatively slow (until 4G becomes widespread) and unreliable. Moreover, some smartphones CPU are simply not powerful enough to run complex scripts on the page (hey, Flash can you hear me?). So, by working on mobile we’re forced to care about performances: optimize CSS and javascript use, compressing and combining images, use CSS3 whenever is possible to avoid images, limit content length and media size, etc. No need to say that when we move up to bigger screens, these performance gains will be really appreciated too.

Wrap up

The ones we just saw are 3 reasons why mobile-first should be an approach to follow even for the simplest website. Many other reasons exist, like accessibility, global reach, ubiquity, etc. However, keep in mind that:

If you think that working on mobile is only about constraints you’re completely wrong

Mobile devices open up countless possibilities that are not even imaginable for old-style devices: geolocation, ubiquity, personalization, augmented reality, device sensors, physical interaction, etc. That’s why you should take advantage of these features and sometimes provide something more/different to your mobile experiencewith respect to the standard one. But that’s another story. Stay tuned…

Resources:

  • Mobile First, in this book, Luke Wroblewski explains a new approach in designing for mobile, by exploring reasons and common patterns. The book makes a good point in telling why all users will benefit if you start thinking from the smaller screens.
  • Mobile content strategy: in her presentation, Karen McGrane tells us why and how we should plan for great content for mobile users
  • Think with Google: a collection of research, marketing insights and studies regarding the IT industry