This series of articles describes how to provide Web
content to mobile devices through WML (Wireless Markup Language). This article
covers techniques to use when delivering standard HTML to WML-compatible
devices.
Note: These articles cover WML and WMLScript version 1.1,
which are supported by the majority of mobile devices in use today. The
articles assume a working knowledge of HTML and general Web technologies, and
further assume that you have read the previous article(s) in this series.
Delivering Converted HTML
There may be several reasons why you may need to deliver
standard HTML markup text to a WML-compatible device. You may have data stored
in a database that is typically displayed in a standard browser; legacy data or
pages that resist conversion; or cross-platform text that needs to be primarily
available for a standard HTML browser, but would be useful if delivered to WML
clients.
For example, I'm the administrator for a movie news Web
site. The articles for the site are marked up using standard HTML, stored in a
SQL database, and delivered to the clients using PHP pages. The bite-sized
articles also make for great wireless contentsomething that can be browsed
while in an airport or during other downtimeso I decided to make this content
available in WML. Unfortunately, I quickly found out how incompatible even
minor HTML tags are with WML, creating the need for some simple conversion
procedures. Although not perfect, those procedures are used as the basis for
this article.
Tip: The quick-and-dirty methods described in this article
are handy as a temporary or short-term measure. If you intend to support a
particular platform long-term, I recommend creating custom code for that
platform.
Standard HTML vs. WML
Standard HTML documents don't work well on WML-capable
devices. Even if the wireless services offer translation services through their
gateways, standard HTML seldom displays as the developer or user would like.
Limited Tags
WML supports a very limited subset of HTML tags. Among those
supported are the following tags:
- Character
formatting
- <B>
- Bold
- <I>
- Italic
- <U>
- Underline
- <BIG>
- Big text
- <SMALL>
- Small text
- <STRONG>
- Strong (visually emphasized) text
- <P>
- Paragraph
- Table
tags
- <TABLE>
- <TR>
- Table row
- <TD>
- Table column/cell
Several tags nearly alike between the two languages, but
their formatting and/or parameters are different enough to cause problems. For
example, the line break tag is simply <br> in HTML, but <br /> in
WML. Also, tags such as the table tags support many more options and parameters
in HTML than in WML, and rarely allow HTML tables to display properly in WML.
Device Display Limitations
Standard HTML documents are generally designed for large
displays, such as 800 x 600 resolution CRTs connected to a PC, not a 240 x 320
LCD on a PDA (or smaller, if a cell phone). Even devices that run
HTML-compliant browsers (such as IE in Windows CE devices) have problems with
the majority of today's Web sites.
The almost unrecognizable internet.com home page, displayed
in IE on a Pocket PC (Windows CE).
Tip: To gauge roughly how a page will look on a smaller
device, shrink your standard PC browser window down to that size.
Most mobile devices don't support the vast array of text
formatting available toPC browsers. For example, earlier versions of certain
mobile browsers don't support underlining; others don't support italic or bold
text. Tables are especially problematic due to their width.
Device memory is also a problem. Most mobile browsers only
support pages (decks) a few kilobytes in size, requiring the content to be
broken down into bite-sized chunks and displayed across several cards, if not
several decks.
Finally, most modern PC-based browsers (IE, Mozilla,
Netscape, and so on) have built-in logic to handle incomplete or misused tags.
For example, most PC browsers are forgiving of HTML documents that fail to
close a major element such as a table or the body of the document. Most mobile
browsers are far less forgiving, requiring very strict use of tags.
Device Input Limitations
Interactive Web pages present even more challenges to the
mobile user. Anyone who has needed to tap/write out even a short note on a PDA
can appreciate the need to keep interfaces simple. Those who have tried to
compose more than just a few characters on a standard cell phone keypad can
appreciate this even more strongly.
The simplest Web interface is the form, whose structure is
considerably different in WML. Simply converting the structure and tags isn't
sufficient; you also have to consider how it will affect the end user on his or
her individual platform. For example, choosing the correct state code from a
drop-down list is easy on a standard browser. However, drop-down lists
translate to select lists in WML, necessitating a list of 50 entries that the
user must scrolled through (usually 9 items per page) to select the proper
code.
IE 7
Firefox 2.0
