On Monday I went to the iPhone Tech Talk here in Seattle, and in general, the iPhone Tech Talk contained a lot of good information and best practices on how to develop web applications for the iPhone. They were very tight lipped about the upcoming SDK, but what the conference did have was some solid advice about mobile design that got me thinking again about best practices when designing for mobile. When we were designing Leaflets we took all of these into account, but it’s always good to be reminded of the basics when it comes to designing for mobile.
Context, context, context
There was a lot of talk about the three levels of a website in the mobile space, and they outlined them as compatible websites, optimized websites, and then specific mobile web applications. To me this seemed fairly straight forward, but the point the representatives from Apple kept dancing around that needed to be emphasized more is that context, specifically the mobile context, is really what drives you farther up this “ladder”. If you’re wanting to provide a better user experience you need to take into account the context of how your users are using a particular device. Mobile users reach into their pocket, grab their phone, go to a site to get a specific piece of information and then put it right back into their pocket. You need to take into account that user interaction as well as them simply being mobile when you’re designing for mobile. Don’t forget it’s a phone first, mobile device second. Context is crucial and the more you take this context into account the more your website becomes less “compatible” and more “optimized” or eventually something you can offer to your users that was specifically designed for the mobile experience.
It’s not an all or nothing proposition when dealing with mobile and you need to look at your business and user needs before deciding on what strategy would work best. Simply providing a mobile compatible site is a good first step but starting to optimize your content for the mobile user experience is what can really set you apart.
They emphasized taking a subset of what your site does and thinking about what a user would want to do in the mobile context, and I agree this is the right approach. If you’re a brick and mortar retailer providing a user quick access to your store hours, address, a phone number and maybe a few hot deals is an ideal first step. You should still offer a fully compatible and capable version of your site that users can still access but creating a version optimized for mobile is key to providing the best user experience.
Take into account the device’s limitations
It’s not the desktop web. The screen is small, there’s no mouse, and text entry is incredibly difficult, and that’s just some of the limitations. When designing your site or application you have to keep these at the forefront of your mind. Sure people can get to all of the content on your site using the iPhone, but it’s difficult to do the panning and zooming and they experience that the site was designed for was based on the desktop browser and doesn’t take into account these limitations. Other browsers not as advanced as Mobile Safari are a whole other ball game entirely.
Always communicate to the user what’s going on
This is a no brainer in my mind but is always good to be reminded of, especially with a mobile as devices are often throwing new interactions at users just on the device device level. If something has changed on your site let the user know. More causal status changes should be communicated casually, like if a new email arrives in your inbox you don’t need to always alert the user a simple red icon on mail is sufficient. If a user clicks (or taps) on a link and something is loading in the background let them know, a simple loading animation works great here. And as always be wary of the modal dialog box, especially with mobile. Think about how you would be interacting with the phone. You tap on something to load some more messages but you know you’re on edge so you’re going to have to wait and you’ll want to do something else while you wait. If you’re forcing the users to sit and wait, it’s a bad user experience.
It was good to see we’d done almost all of these things with Leaflets, and it’s nice that Apple is really emphasizing some good best practices for dealing with the mobile web. Overall it was a good talk and if you’re looking to develop for the mobile web I’d recommend it.
The toughest part is finding the right balance. Just as we can’t always assume a user is browsing from the comfort of their home with their fast computer and high resolution, we can’t assume that all users of mobile devices are looking to do the same thing.
While I agree that it is a different context, some people simply have different goals - not everyone picks it out of their pocket, checks something, and puts it back in.
I agree and understand what you are saying, but recently I watched my wife using her iPhone. She went to facebook and was greeted with the mobile version of facebook. She was instantly upset. She wasn’t in a rush, she knew the interface of the ‘web’ facebook - and now she was just frustrated. Me, I prefer the mobile version. This just showed me that not everyone has the same priorities (and my wife is not a sole reason to build otherwise) - we just need to find the right balance.
Maybe doing more analytical studies to get a broad view of what people are doing with your content on mobile versions is one way to start - I don’t know - I am still diving into this myself.