<img src="logo.wbmp" alt="[logo]" />
This code displays an image called logo.wbmp. If the phone cannot display that logo or the device has its graphics abilities turned off, the text "[logo]" appears instead. It's always good to specify some kind of descriptive "alt" text for your images. Keep in mind, however, that you want to keep the alternate descriptions short because they add page weight.
About the WBMP Format
|
|
Each of the graphics I show has been converted into a format specifically designed for wireless devices.
Read on...
|
|
Examples of Graphics on WAP Sites
Graphics play an important part of user interface design. They should add to, rather than detract from, the experience of your users. In the following three screen shots, I show some WAP sites that do an exceptional job at enhancing their overall site with WBMP images (see the sidebar, "About the WBMP Format"). These three sites exemplify the use of graphics to serve a specific purpose.
After taking a look at how three real companies have used graphics to improve their sites, I will show you how to transform a fictional wireless site using the same principles.
eBay's WAP site (http://catalyst.2roam.com/www.ebay.com/) is easily identifiable because it bears the same logo as its Web site:
The graphic draws a parallel between what the user expects from the eBay site on the Web and from the WAP site on their wireless device.
OpenWave's Cool Sites Directory (http://www.openwave.com/wml/opwv/sites/index.wml), which is included with the UP.SDK Software Developer's Kit, uses graphics as icons:
On many phones the actual width of the display is so narrow that you sometimes have to scroll over a link and wait a few seconds for the rest of the link to scroll by horizontally, such as the long links used by news sites when they display the entire headline as the link (and the line doesn't wrap). This horizontal scrolling occurs on my Sprint PCS phone whenever I check news on Yahoo's mobile site.
Icons eliminate that problem effectively, particularly in this case. Of course, you have to be sure that the icons you use are easily identifiable and globally associated with the appropriate option that they're next to.
CartoonScape (http://wap.cartoonscape.com/) uses graphics purely for entertainment. It is a normal Web site that parallels its comics content in WBMP format. Toonula is a character used throughout the site (see left image), much like a mascot or avatar. She's also on the main Web site (see right image):
