Your email, Web site or landing page could be beautifully rendered on a 32-inch screen. Or the same content could be unreadable on a smartphone. When designing for smaller mobile screen sizes:
- Create simple, organized page designs that limit horizontal scrolling. Use tabs, pulldowns and multiple pages to keep your page designs clean and simple.
- Provide an easy way for users to return to the home page, access the main menu and navigate back one level.
- Use breadcrumbs to allow users to track themselves within the mobile experience. “Tuck away” the main menu by allowing users to utilize the soft keys to quickly access it.
- Make the screen size seem bigger than it actually is by using techniques like zooming in and out, panning and page leafing to create the illusion of larger screen sizes.
From Strategic Mobile Design: Creating Engaging Experiences, by Joseph Cartman and Richard Ting.
Other resources
http://mobiforge.com/ A site for designers and developers.
http://www.w3.org/TR/mobile-bp/ This document sets out a series of recommendations designed to improve the user experience of the Web on mobile devices.
http://developer.apple.com/safari/ Designing for the iPhone. There’s an app for that.