Mobile Web Site Design Overview

Send Feedback

Following are some general guidelines on how to optimize your Web site design for Internet Explorer Mobile:

  • Keep it simple. Complex, dense Web sites can be difficult to read and navigate on a Windows Mobile–based device. Look carefully for redundant text or unnecessary graphics that can be removed without affecting your site's core functionality. Don't try to duplicate all the richness and functionality of a site designed for the desktop computer. Carefully consider the needs and usage scenarios of your mobile users.

  • Screen size is limited. As you design your applications, you should keep the small screen size in mind, and remember that the actual usable space is less than the total screen dimensions of your device. Avoid display elements that require horizontal scrolling whenever possible, especially for textual content. Necessarily large images (such as maps) are among the very few exceptions to this rule.

  • Use simple images. Design your images with clean lines and simple shapes, because more complicated elements tend to appear ragged. It is good practice to avoid large detailed images because the scaling operation can obscure critical information.

  • Use high-contrasting colors. Internet Explorer Mobile displays color images on color Pocket PC devices. On monochrome devices, Internet Explorer Mobile dithers the color images to grayscale representations. The original color scheme plays an important role in how Internet Explorer Mobile renders an image on grayscale and monochrome devices. The process works best on images that have a high contrast ratio between colors and that have crisp edges in the details of the picture.

    Note   Windows Mobile–based Pocket PCs are offered with 4,096-color or 65,535-color displays, as well as 4 or 16 levels of grayscale.

  • Use alternate text tags. Users may choose not to load images, so it is very important to place meaningful alternate text tags in your embedded images. Remember that you are trying to convey the message of the missing picture, not describe it.

  • Using WML. Internet Explorer Mobile supports the Wireless Markup Language.

See Also

<object> Tag Limitations | Best Practices for E-Commerce | Best Practices for Information Sites | Designing Images and Sound for Windows Mobile–based Devices | HTML Reference for Internet Explorer Mobile | Layout Meta Tag | Office 2000 and Office XP HTML Support | Internet Explorer Mobile Overview | Using the WIDTH Attribute on Tables | Using WML

Send Feedback on this topic to the authors

Feedback FAQs

© 2006 Microsoft Corporation. All rights reserved.