Close Form

Have An Upcoming Project? Call 301.656.1144 We would love to discuss how we can help!

Thanks for the business! A representative will contact you within 24 hours.

Mobile First? Do it. Do it now.

January 25, 2017

Mobile First? Do it. Do it now.

What’s all the hubbub about mobile first mobileness?? While it is a hot new term, It’s not just a hot new term. It’s much, much more than that. It’s a whole new way of thinking about users, content, web design, and the lot. Do a Google search for ’mobile first’ and you’ll find somewhere in the neighborhood of 4,520,000,000 results. That’s a lot of results.

An example of a semi-mobile-first approach to the web.

This image shows how used to be designed, responsively. Although it looks different now, the site is still responsive. Lovely image citation

Okay, so, there’s a lot of content about it—so what?

How does this affect everyday website owners? Isn’t this just another aspect of the web that only the early adopters really need to know about? Unfortunately/fortunately no. Mobile is here, and has been here for a while now, so it’s time to start thinking about it, and to start planning for this from the beginning. The mobile first concept is basically a web strategy that puts users on mobile devices as your first priority and then you work your way outward to desktop users. This is not to imply or say that desktop users are any less important than mobile users, certainly not. These users still account for most web traffic. However, up until now, most mobile users have been given a mobile second (or worse mobile shmobile) view, and have had to deal with subpar content delivery on their devices.

Sure it sounds great, but I can’t afford mobile magic

Tut tut tut, yes you can. And yes you really kind of have to. With the vigor and speed of technology moving more and users to mobile (not necessarily away from desktop altogether, but in addition), this is something that in 2012 has to become just part of our thinking and attitude. Kudos to those who’ve already seen the light, and done something about it. There are a few different ways to approach this and to make it work well. One: create a separate iteration of your entire site with mobile needs at the forefront and planning for what is needed and what is not, and Two: create a mobile site that has just what your users need most while on their devices. This isn’t a really one or the other, as with everything on the web, it’s all relative.

Relative to your users, relative to your content, and relative to your budget. Relative to your users in that some companies have users that are early adopters and will push the technology barrier often, whereas others have users who probably don’t use their mobile device for much other than getting contact info. The same goes for the type of content. If you have a website with thousands of pages of good textual content, then you’ll probably want a fuller mobile experience; but if you’re site is more of just a brochure site, then a few mobile optimized pages will most likely do the trick. Obviously, cost plays a factor here as well, so your budget is another thing to consider. Fortunately for us, technology is on our side here.

There are a few different ways to optimize a site for mobile experience: true mobile templates and using responsive web techniques. The first is pretty self-explanatory, where a designer or developer would create templates built for mobile and that only include what is truly needed for the mobile experience. Mobile browsers can render most of the content on a website these days (with the exception of iOS devices and Flash of course), but due to dramatic differences in user expectations and processor speeds on a mobile device, we really don’t want to force users to get the same content as desktop users. So, by removing all extraneous content (part IA, part design, and part development), we can really make a mobile experience simple, easy and at times, fun.

The second technique is based on the same principles as the first, optimizing for mobile views, but it goes about this in a different way. What using responsive web techniques (combining CSS Media Queries and some JavaScript) does is it reformats the layout to fit into most mobile devices. While this seems like a no-brainer, and that everyone should do this, the main problem with this is that the non-mobile content is just hidden from the device, not truly taken out of the equation. So what that means is the page load time is not truly optimized for mobile, and as anyone who’s ever used a mobile device knows, page load time REALLY matters. However, devices are getting faster all the time, as are networks, so eventually this may not truly matter.

Note: there are some very advanced techniques 1 that can be applied to help responsive design out a bit as well, however for this instance I’m just assuming normal CSS/JS methods are being used.

Okay, now I know why, but when to do this?

As the concept implies, mobile first means mobile first. When you and a designer/firm first talk about an upcoming project, talk about it then. Before you start working on the IA, talk about it then. Before the design begins, talk about it then. Before you begin writing the content, talk about it then.

What this really boils down to is that thinking with mobile in mind first helps you to think about what’s absolutely most important to your users. Are they really going to care about that press release? Is that stock photo really going to woo them? What about those ads you on your desktop site, are they really relevant to mobile users? If/when you visit a site on a mobile device, what are you impressed with? Conversely, what annoys you the most? Thinking about things this way, really helps you predict what the best user experience you want to offer to your mobile users is going to be.

No silver bullet

This is not a perfect solution—nothing ever is. If you spend hours and hours crafting the best mobile experience, but neglect the content and/or the design, then it’s kind of all for naught.

People are still going to dislike this or that on your site, that’s just a fact of human nature. But approaching it this way, with their overall best interests in mind is going to do wonders for making their experience more enjoyable, and their perception of your company more favorable. Remember, it’s the little things in life that count.

Some resources:

BrowserMedia, LLC

1424 K Street Northwest
3rd Floor
Washington, DC 20005
K StreetK StreetMcPherson SqMetro Station