Choose a Mobile Web Design Strategy

Part of the Mobile Web Design For Dummies Cheat Sheet

Your approach to designing a mobile Web site depends on your site content, your resources, and your audience. The following tips can help you understand the possible mobile Web design strategies and pick one that works for you:

  • Create one simple version of your site: This strategy ensures that the largest number of visitors to your site can at least get the most important information on your site (such as your phone number when they’re on their way to your office). Make sure the design works on even low-end mobile devices and link to it from your desktop site. The Web site http://mobilynx.net, shown in the figure, is designed to work on a variety of mobile devices and provides an organized collection of links to other sites designed for the mobile Web.

    image0.jpg
  • Design multiple versions: Many designers create different versions of a Web site and then automatically direct visitors to the version that is best optimized for their screen size and the features supported by their phone or devices.

    If you have the time, expertise, or budget, designing different versions of your Web site, each optimized for the different sizes and capabilities of different devices, is the best strategy.

  • Use content adaptation: Basically, you create one Web site design and then adapt it to each device. Thus the basic structure of the site will be the same across all devices, but specific elements, such as image sizes or the appearance of videos will change based on what the device can support.

    When you develop a site using the content adaption approach, it’s good practice to start by creating a wireframe, a kind of blueprint to your site design, as shown in the figure

    image1.jpg
  • Design one high-end version: This works if you know your visitors primarily use a high-end iPhone or Droid, the name used for phones that run on Google’s Android operating system. Jasper Johal’s Photography Web site, shown in the figure, looks good on an iPhone and a desktop computer.

    image2.jpg
blog comments powered by Disqus

SERIES
Mobile Web Design For Dummies Cheat Sheet

Advertisement

Inside Dummies.com