Preview Release (see note)
July 13, 1998
Contents
Design Overview
Display Capabilities
Graphics Capabilities
Text Capabilities
Valid HTML Tags and Attributes
This discussion focuses on special design considerations when creating a Mobile Channels site for the Palm-size PC. For instance, Palm-size PC users want information to appear quickly. This results in the implementation of limited, optimized graphics, and navigation schemes that are better suited to the device's compact display.
Once you've generated preliminary Web pages, preview the site on your Palm-size PC and make necessary adjustments to improve readability of key graphics and to ensure the site design's effectiveness for end users.
Note: The design guidelines presented in this document apply to development of Mobile Channels Web sites for the Palm-size PC only. Mobile Channels design guidelines for the Handheld PC (H/PC) will be covered in the future.
The screen size of a Palm-size PC is 240 pixels wide by 320 pixels high, which includes right and left margins of approximately 6 pixels and a scroll bar of approximately 16 pixels.
Tip Create the entire page layout in a 210 pixel-wide table. This allows an accurate rendering of a Palm-size PC display when working or viewing on standard monitor, and avoids scaling problems.
The Palm-size PC displays only the following grayscale colors:
While the Palm-size PC supports only a grayscale display, it is possible for users to view your site on a desktop computer as well. Therefore, you might include some color in your display, restricting images to 16 colors in order to conserve storage space.
When implementing graphics for a mobile channel, consider the following:
Tip When creating advertisement graphics, use mostly light or dark gray. Avoiding high contrast in advertisement images prevents them from distracting from the content of the page.
When adding text to a mobile channel, consider the following:
Tip Text always appears in black and the background is always white, even in tables and table cells. Therefore, include such tag and attribute pairings as <BODY BGCOLOR=WHITE LINK=BLACK> for a more accurate rendering of a Palm-size PC display when working or viewing on standard monitor.
Mobile Channels does not support all Internet Explorer HTML tags and attributes. Such differences in support of common layout attributes include the following:
A Channel Browser attempts to collapse excess vertical white space. This allows pages that are formatted for desktop displays to fit more easily on the screens of smaller Windows CE-based devices. Therefore, techniques such as multiple line break tags do not yield the expected results. Use the non-breaking space " " to prevent the browser from collapsing lines breaks between tags. For example, <BR><BR><BR> results in the same vertical spacing as <BR>. To achieve the desired result, use <BR> <BR> <BR>.
Tip Use table cell width to achieve table spacing.
The scaled-down view on the Windows CE-based device supports a basic URL resolution process. In some cases, this resolution process is not fully compatible with Internet Explorer 4.0 and other browsers. Specifically, Mobile Channels does not always resolve relative URLs. Therefore, you should use only absolute URLs for images and .htm files. For example, <A HREF= "PAGEONE.HTM">Page One</A> and <IMG SRC="BOX.GIF"> are invalid. Use <A HREF="http://www.microsoft.com/test/pageone.htm">Page One</A> and <IMG SRC="http://www.microsoft.com/test/box.gif"> instead.
For more information on supported HTML tags, see Mobile Channels HTML Tag Reference.