What is your mobile strategy?

by Les James on November 9, 2010

in Design,Mobile

Cell phones have changed

I think we can all agree that having a mobile website is no longer a luxury but a necessity.  In the latest Refresh the Triangle meetup Matt Henry of Viget Labs gave a presentation entitled “The Agony and Ecstasy of the Mobile Web“. The polarizing presentation discussed on a high level the state of mobile web design and why you should be addressing it right now. This post is both a recap and smattering of my own opinion. So let’s address the bad news first and cover some of the pain points that make mobile design so frustrating.

Would you say I have a plethora of browsers Jefe?

Now I love to bash on some IE6, but did you know that most Windows phones run the equivalent to IE4? Hold on for a second while I hide in a dark corner and cry myself to sleep. Microsoft just came out with Windows Mobile 7. Think they put the latest Internet Explorer on it? Nope, it runs the equivalent to IE7 which is only slightly less frustrating than it’s older brother. Most Blackberry phones come with Javascript and CSS turned off by default which severely handcuffs a designer. If you don’t have a smartphone, which means you have a dumbphone, we are talking total table based design where even a simple unordered list is enough to crash the browser.

Supporting the huge range of mobile browsers is just one piece of the puzzle. Bandwidth comes into play big time with mobile. Data connections that aren’t 3G are pretty much like dial-up so every single byte makes a difference. People hitting your site on the go means that they are going to have little to no tolerance for a slow loading site. To help ease the bandwidth load, a carrier that shall go unnamed scrubs all the data on its non-iPhone traffic. So even though you tested the hell out of your mobile site design, this scrubbing can accidentally drop a tag which can blow up your layout.

You don’t have the resources of a Google or Yahoo so how can you design, develop and test for every mobile browser out there? Well the sad truth is you can’t. This is a game of divide and conquer and the first step is to know your audience. Understanding who is going to hit your site on the go is important to knowing what to design for. Business users? Maybe you should set aside the ninja Javascript so that those Blackberries can navigate your site. Going after an oversees market? Well you can forget everything you learned about modern web design in the last 10 years because you are going back to table based layouts. Figuring out who is actually hitting your site on the go is going to help focus your design efforts.

What about features? Do you really need to create an exact replica of your desktop site for your user on the go? Most likely not. If someone hits your site on their phone it’s probably because they want to get in, see what they wanted to see and get out. They aren’t there to putz around and kill time, they have social networks and games for that. Trim down your site to the essentials and make sure that the content is presented quickly and clearly. This means that all the flashy features that aren’t essential to presenting users content don’t need to make their way into the mobile edition.

Dear Webkit, I love you! XOXO!

The title of Matt’s presentation mentioned something about ecstasy didn’t it? Okay, it’s time to stop talking about the misery of the mobile world and start talking about what’s great. Sexiness in mobile web design lies in Webkit. If you don’t know what Webkit is it’s the open source rendering engine behind Apple’s Safari and Google’s Chrome browsers. Webkit also powers their mobile counterparts in iPhones and Androids. Webkit was also ported to Symbian, the open source OS that powers newer Nokia smartphones. Webkit has strong support for CSS3, HTML5, geolocation and accessibility. I can tell you right now that it’s a dream to design for and since iPhones and Androids are all the hotness right now the future of mobile browsing looks bright.

Now I love me some jQuery (a Javascript framework) because it allows me to do design things like page manipulation and animation with ease, but Webkit has a built in selector engine and strong support for CSS transitions so it allows me to ditch the Javascript and it’s associated file size (remember that every byte counts). I usually only use 10% of what jQuery can do anyway so why force the mobile user to download all of it?

I had a chance at my last job to design mobile website templates that were targeted specifically for the iPhone. It was rainbows and choir music every day because for the first time I only had one browser and one screen size to design for. I could round corners, apply drop shadows and gradients, even animate with ease because I didn’t have to worry if it worked in another browser like I do in the desktop world. This isn’t a realistic scenario however, and I was reminded of this by a tweet I saw by Rachel Nabors:

Until our coverage goes up and the cost of owning a smartphone goes down, developing for mobile is developing for one strata of society.

This is very important to remember because I get caught up in how awesome the iPhone is and forget that everyone isn’t a fanboy like me. So until the day comes where everyone is walking around with the latest Webkit greatness in their pocket, make sure that you are catering your mobile site to everyone else. Know your audience. Make a plan so that you know exactly what browsers you need to target and which ones you can ignore. Trim your site down so that nothing gets in the way of delivering an awesome user experience. If you do get lucky enough to design for a Webkit equipped phone then enjoy the ride because it’s the most fun you will ever have designing. But above all else, have a mobile strategy. Users with Internet in their pocket have come to expect being able to access content wherever they are, so don’t wall them off because you did nothing. Mobile can no longer be an afterthought.

AdMob Mobile Metrics – May 2010 – Highlights
Rachel’s Tweet
Matt’s Presentation on SlideShare
My obscure reference about a plethora of browsers

{ 2 comments… read them below or add one }

Morgan Siem November 9, 2010 at 1:39 pm

This is an excellent post with excellent insights, Les! I like your point about dividing and conquering – aka, determining what type of mobile browser your core audience members are using. I’d add that an easy way to determine this is to look at the analytics on your website. You’ll be able to tell which mobile devices and which mobile carriers your audience members are visiting from. This varies greatly by site. I just took a look at the visitors for this blog in the past month and, in order of most visits to least, we’ve got: iPhone, Android, iPad, BlackBerry, iPod and Windows. It gets even more interesting when you drill down to see which landing pages are most mobile visitors hitting. That can help you determine which pages and features on your site can be trimmed down for mobile users.

Reply

Phil Buckley November 10, 2010 at 10:00 pm

It’s a different mindset for mobile, people are looking for different information. I almost always want a phone number, your street address and your business hours – usually while I’m stopped at a red light.

If you don’t make it easy for me to find you, and see if your open, your mobile site just failed – simple as that.

Reply

Leave a Comment

Want to add a picture to your comments here on Media Two Point {OH}? Upload your picture at Gravatar to make it happen.

Your comment may be nofollow free.

{ 1 trackback }

Previous post:

Next post: