Mobile First Responsive Web Design is a combination of philosophies and strategies that focus first on mobile devices, as well as user accessibility when creating a design. Websites and digital applications are getting more and more complex, and with that change, designers need to create experiences that work across the entire array of digital devices out there in the wild. That includes the new device that doesn't even exist yet (but we will tweet and rant about until it’s in our hands).
Art by Brad Frost
Starting with mobile and designing with progressive enhancement in mind ensures that the user experience, for lack of a better term, is usable. With this approach, any device will be able to access the website and have, at bare minimum, a functional experience. Then that experience can be enhanced and optimized using media queries, feature detection, conditional loading, and plenty of other fancy tricks that us designers hold dear to our hearts. This is the fun stuff for us!
Mobile-first responsive web design isn’t a walk in the park. It often, if not always, requires overhauling a site’s foundation and more importantly requires a serious look at the site’s content, goals, and strategy. This isn’t something as easy as dropping in a fancy framework you keep hearing about in blogs, writing some new CSS and cropping images. This approach requires careful planning, time and resources, as well as some pretty good foresight. It’s not easy, in fact it can be downright hard to wrap your head around- especially since it’s not what most clients and designers are used to.
Ultimately mobile first responsive design is costly from a resource perspective. Clients have to be keyed into what their content is, have an idea of what it will be, all while knowing clearly what their business goals are and who their audience are. Not only do they need to have their heads in their content strategy and demographic, they also have to work with all the upfront work that this approach requires, which is always a bigger bid than what they may be more accustomed to. In some cases, responsive design works well for a client’s site, but isn't necessarily worth the effort or the cost. This can be due to a small number of users accessing the site, low percentage of content being accessed by mobile, or lack of understanding of the potential growth or change of their content. It's a difficult balance, and with it being so trendy, it’s hard to get a client to slow down and know what it means both from a technology standpoint and a work/resource/budget position.
In the end, knowing that the future is here, and more and more devices and technology possibilities are being conceived, Mobile First Responsive Design is a pretty good approach for making your site work for all these new gadgets. It’s hot, it’s new. We love it. We want to do it. We want our clients to have it; but only if they need it. Only if it’s right for the project. It’s hard, and can be painful to rework a site’s foundation and plans, but the payback is knowing that there is way less work to do tomorrow, and there won’t need to be a new site built every time a new, slightly better version of a device get released!