“Mobile First” Considered Confusing

Dear Web Developer,

We need to discuss “Mobile First”.

The term is one of our better, more descriptive, responsive web design concepts. The idea is simple: we start with a basic version of our website — normally a single-column layout. It will work almost everywhere regardless of the device, browser, capabilities, age or screen resolution. It doesn’t matter whether a visitor accesses from Chrome 35 on a MacBook, IE6 on a Windows 98 PC or Opera Mobile on an aging Nokia — they’ll see content.

Once our basic site is complete, we use CSS media queries and perhaps a little JavaScript object detection to improve the user experience on devices that support modern features and larger screens. For example, we may add drop-down menus, multiple columns, higher-resolution images and more sophisticated layouts.

The benefits?…

1. A user with an old browser that doesn’t support media queries will still see the basic site. That wouldn’t be the case if we started with our ‘desktop’ layout and tried to retro-fit a small-screen design.
2. It’s a logical way to work. We’re progressively enhancing a layout when possible rather than hoping it will degrade gracefully on lesser devices or attempting to remove features that won’t function correctly.
3. It keeps us focused on what’s important — the content. A linearized view must prioritize text and features. There can be no multi-column, floating element, or modal dialog compromises; important content must appear first.

We fully understand the context and meaning of “Mobile First”. Unfortunately, it seems our clients and colleagues do not. Even those with considerable IT knowledge appear to have presumptions such as:

• a separate mobile site will be developed before the desktop version
• the mobile design will take a higher precedence, or
• we’re prioritizing devices with a relatively small market compared to traditional desktop PCs.

None of this is true, but they are logical conclusions when you don’t appreciate what “Mobile First” really means. Perhaps more appropriate terms are:

• mobile-compatible
• mobile aware
• progressive layout
• device agnostic design, or
• “works anywhere”.

I’ve heard some developers refer to “content first”, although I’m not convinced it accurately describes a technical layout approach.

No matter — it’s probably too late to change the term now. You need to communicate with your fellow developers and “Mobile First” is fine if everyone is clear about the meaning.

That said, I recommend you avoid using the term during client discussions unless you’re absolutely certain they understand the context. Few will. Clients are happy when you deliver a great project on time and on budget; they’re less concerned about clever buzzwords and development methodologies. Perhaps then we can avoid frequent, lengthy explanations and actually implement what we’ve promised!

All the best,
Craig

PS. Have you experienced “Mobile First” confusion? Comments welcome!