The basic functionality of the device is different. That means user expectations for their online experience are different. That means the tactics employed by designers and developers have to be different.
The main thing to consider is the most obvious: The viewport. A common size for most current mobile device screens is between two and four inches (measured diagonally). With so little space, there’s only so much that can be emphasized on screen. In addition, certain elements need more room than they would on other platforms. For example, call-to-action links and buttons need to be large enough for a user to make an accurate and registered tap.
An effective mobile presentation needs to be fluid regardless of the screen size – it shouldn’t present the user with a myriad of options so much as an “A to B” method of browsing. The device itself dictates that – the real estate simply doesn’t exist in the viewport to allow the developer to emphasize content that isn’t vitally important to the user experience.
That means content needs to be streamlined and concise, with more of a linear feel. It also needs to be managed.
Again, the size of mobile device viewports limit options, but there a number of creative ways to organize different type of content. One popular method is the use of jQuery to create expandable/collapsible lists and menus. It’s a simple and effective way to manage multiple elements while keeping the overall feel of the presentation condensed. In addition, making good use of mobile device swipe and tap functionality provides new ways for users to interact with jQuery photo galleries and carousels.
Designing for mobile web can be challenging given how most devices function, but for most developers, that’s part of the fun. It’s a relatively new medium and everyone is still figuring out the best way to utilize it. Sure, we’re still playing the exact same game in trying to develop effective communications, but when it comes to developing them for mobile web, tactics have to change if we still want to play at a high level.
Looking for more tips on mobile design? Check out these posts: