Find out how to use new Wireless Application Protocol (WAP) and Wireless Markup Language (WML) technologies so that users can access your Web applications using a variety of handheld or mobile devices, including Palm organizers, phones, and others. Carol includes five guidelines for designing for the small screen.
I know what you're thinking: Who would want to surf the Web on a tiny little screen while driving down the highway? Probably no one you'd want to carpool with. But think about it from a different perspective, and it sounds a lot more appealing: Suppose you're walking down the street with a friend who tells you about a great new book that you'd probably like. Wouldn't it be great to buy it on the spot and have it shipped to your home?
Or suppose you arrive at O'Hare airport in Chicago to discover that your connecting flight has been canceled. You could dial up the travel agent and wait on hold doing a slow burn while you wonder which gate or ticket counter to sprint toward. Wouldn't it be better if you could find the alternative flights right on your phone's display and start directly for the gate? Or how about getting notified about the price of a certain stock, without having to look it up?
Well, you can do all that today, and much more. Read on, to find out how to use the Wireless Application Protocol (WAP) and Wireless Markup Language (WML) to make your Web applications accessible across the Internet from a variety of handheld or mobile devices, including Palm organizers, phones, and others.
WML and WAP basics
If you're reading this article, odds are that you're already familiar with HTML, the tag language used to make Web pages. To refresh your memory of HTML basics for the purpose of comparison, after you write an HTML page, you save it with an .HTML file extension, and then you place it in a specific folder of your Web server (called the document root), which makes it visible to the rest of the world. When people want to access your page from a browser, they type http://yourserver/yourpage.htm, where yourserver is the name of your Web server, and yourpage.htm is the name of the file that you placed in your Web server's document root folder. When this happens, the server sends the tags from your HTML file back to the browser, which knows how to render them on the screen. This request and response is called the Hypertext Transfer Protocol (HTTP).
Wireless Markup Language (WML) works along the same lines as HTML, except that the language is specifically designed for small displays and mobile devices. You create a WML page (actually, they're called cards and decks) in a text editor, and save it with a .WML file extension. Listing 1 shows a brief example.
Listing 1. A simple WML sample
Wireless Application Protocol (WAP) is a protocol that allows mobile phones and other wireless devices to connect to the Internet. Conceptually you can think of this as being similar to HTTP.
You might be wondering why WML and WAP are even necessary. Why not just stick with HTML and HTTP, which are already universally available? Some mobile devices do, in fact, use subsets of HTML, and you can also access WML through an ordinary HTTP server. But to really take advantage of what the new wireless network and mobile devices have to offer, WML and WAP are necessary to get by limitations of technologies that were designed for desktop environments. Keep in mind that handheld devices work very differently from desktop computers. They have less powerful CPUs, less memory, smaller displays, and limited input capabilities. Wireless data networks also have less bandwidth, less predictable availability, and less connection stability than the typical home or office network.
Before we get too far with the details of WML and WAP, let me explain how to publish and test the simple example in Listing 1. Once you've got that working, you can try some more complex examples and learn a lot more about developing wireless applications.
Publishing and testing WML
If you have a Web server installed on your own computer, you can test your WML file pretty easily. But first, you have to configure your Web server so that it understands WML decks and their MIME type. I use the IBM HTTP Server, so to make this configuration change, I had to edit the httpd.conf file and add the following line:
AddType text/vnd.wap.wml wml
If you're going to do a lot of work with WML, you might want to go ahead and add a few other MIME types while you're at it:
AddType image/vnd.wap.wbmp wbmp
AddType application/vnd.wap.wmlc wmlc
AddType text/vnd.wap.wmlscript wmls
AddType application/vnd.wap.wmlscriptc wmlsc
If you use the Apache Web server, you follow the same steps. If you use a Netscape or Microsoft server, or some other Web server, consult the server's documentation to find out what changes to make. If you use an ISP, contact the ISP to see if it can handle WML files correctly.
OK, that takes care of the first step. Now you need a browser to view the cards with. If you try your normal desktop Web browser to access the card, you'll find that the browser doesn't display it correctly. At best, it will display just the tags inside the file, instead of showing something like the picture for Listing 1. To display the card properly, you need a WML browser.
You might be surprised to find out that there are quite a few to choose from. You can download WML browsers from Phone.com, Nokia, Ericsson, Slob Trot, and a few other places. (I'll give you the links in the Resources at the end of this article.) Personally, I like the one from WinWAP from Slob Trot Software Oy Ab, and I also use UP.Simulator from Phone.com. The WinWAP browser looks a lot like a desktop browser, but UP.Simulator looks like a mobile phone.
Once you've got a browser installed, you can just enter the URL for your WML deck, just as you would in an ordinary browser, such as http://localhost/Hello.wml. See what the result looks like in the different browsers in Figure 1.
Figure 1. The results of Listing 1, shown in two browsers, WinWAP 2.2 and SP01 from Phone.com
WML tags
The WML language defines tags for user interface components, somewhat similar to HTML tags. But WML -- based on Extensible Markup Language (XML) -- is very different from HTML. Instead of a page, WML displays are called cards, and a WML file can contain multiple cards. The WML file is called a deck.
Cards contain text, images, links, data-input elements, list-selection elements, and fieldsets. Fieldsets serve as containers for additional WML elements. Because WML is based on XML, all tags must have matching beginning and ending tags. The syntax is case sensitive, and it must be lowercase.
Let's go through some of the major tags. Instead of listing the complete syntax for each tag, I'll give you a few examples.
Text, tables, and images
Text is displayed in the paragraph tag:
Links
Links are described by the <a> tag.
Links have a title, which describes the link. Different devices use the title in various ways, such as by displaying a tool tip, playing a voice prompt, or using it for the label on the phone keys. For compatibility with a wide range of devices, limit the link title to five characters. The accesskey attribute places a number to the left of the link text.
Input elements
The input element lets the user enter text.
After the user enters something, the data is stored in the variable called varname. Specifying type="text" causes the text to be visible; type="password" causes the text to be replaced by * characters (asterisks). You can also specify a data format that the user's entry must match, including alphabetic or numeric characters. The emptyok attribute specifies whether the user can leave the field blank.
You can group multiple text or input tags using the fieldset tag.
List selection
The select tag specifies a list of options that the user can choose from.
The choices are in the option tags, and they can be presented as text or images.
Navigation
The other major set of tags are related to navigating through cards. The go tag tells the device to open a particular URL. If the URL specifies a particular card, that card is displayed. If the URL sp
