Feature
Optimizing Web Pages For Handheld Devices
Design tips from software maker AvantGo, Inc.
by Marty Kacin,
Director of Professional Services, AvantGo, Inc.
Optimizing Web Pages
For Handheld Devices
Convert Images With Care -- In certain circumstances, you may
be forced to convert a complicated color image, such as a corporate
logo, for use on the handheld. When faced with this situation, you can
try some techniques to obtain a high quality result. Generally, the
process involves converting the image to grayscale, reducing it to a
bitmap and cleaning up any poorly converted areas.
Use Supported HTML Tags -- Using supported and industry standard
HTML tags will enable your Web-based application to transfer more elegantly
onto a handheld device. When using HTML tables be cautious to not create
overly large or complex nested tables. Tables can quickly consume screen
space and cause vertical/horizontal scrolling to become enabled and
unnecessarily effect display performance during table rendering.
Provide An Alt-Tag Option -- After you pepper your pages with
tasteful, high quality images, you must still face the fact that many
users might choose not to load them. Therefore, it is extremely important
to place meaningful alternate text tags in each of your embedded images.
When creating alt tags, keep in mind that you are trying to convey the
message of the picture, not describe it. Therefore, putting "Yellow
button" as an Alt tag for a yellow button is not nearly as effective
as using a "*" instead.
Focus On Content, Not Display -- The most important thing you
should keep in mind when writing HTML for a handheld device is to keep
it simple and elegant. Stick to the original intent of HTML, which is
to focus on content and not display, and you won't go wrong. The main
reason that certain pages on the Web won't display well on handhelds
is that their designers used HTML for results it was never intended
to produce. That said, there are times to bend the rules, especially
if you are not content to wait for the next version of the software
to add support for the tag or attribute you need.
Test Your Application -- Do not assume your applications will
be perfect because they look good on a Web site. Test them with an actual
handheld device. Also, it is always smart to test your applications
on all of the devices you are deploying as today's devices range in
screen size and resolution. For example, you can preview PalmPilot pages
using 3Com's Palm OS Emulator for Windows (www.palm.com/devzone/pose/seed.html).
An example of a page that displays well on both Windows CE (left) and
Palm devices is shown below.

Regardless of whether your organization has PalmPilots, Cassiopeias,
Niņos, PDAs, connected organizers, PC Companions, Palm-sized PCs or
H/PCs, the tips in this article can help you begin the process of developing
Web-based applications optimized for enterprise-wide deployment on mobile
information devices.
To explore advanced techniques such as controlling layout with
GIF spacers, creating image maps and using text in images, visit AvantGo
on the Web at www.avantgo.com.
The site is an excellent resource for those building interactive web
applications for more advanced mobile application developers.
So what are you waiting for? Start optimizing your content today! 