The latest Internet buzzword is WAP. Simon Bisson shows you how to add pages to your web site that are WAP ready.
With millions of mobile phones already in use, its no wonder that over £22 billion pounds was raised by the recent auction of third generation mobile phone licences. Promising 2Mbps connections, the next generation of mobile phones is going to change the way we see the Internet. However you don’t need to wait that long to see the mobile Internet, as the first few WAP phones have started to appear – phones that will at least allow you to use some web services wherever you are…
So how can you create your own pages for WAP phones? WAP, the Wireless Applications Protocol, is an important step on the route to an always-accessible Internet applications framework, allowing mobile phones to access simple text and form based web applications. Working with WAP pages is very similar to working with traditional web architectures. A WAP Gateway acts as an interface between the TCP/IP world and the mobile phone, translating information and passing it to and from the phone. One thing to remember with WAP is that you don’t use HTML –as it’s designed for use on large screens - instead WAP uses a mark up language of its own: the Wireless Mark-up Language. You’ll find all the details of WAP 1.1, the current version of the WAP standard, on the WAP Forum’s excellent web site: http://www.wapforum.org
If you’re used to working with HTML, you’ll find some aspects of WML familiar, whilst others are very different indeed. WML is defined as an XML DTD, so requires more care in implementation than a piece of HTML code. You will need to be sure that the tags you’re using are correctly terminated; otherwise a WML browser will fail to parse and display your page.
The WML browsers in WAP phones are known as “micro browsers”, and you’ll need to be careful how you design content that will be delivered by WAP. The first generation of WAP phones, like the Nokia 7110 or the Motorola P7389, have displays can only show 3 or 4 lines of text at a time, and this needs to be taken into account when you’re designing WML pages. You’ll find micro-browsers generally very limited – and thanks to their integration with the standard mobile phone handset, also very difficult to design for. What works in a Nokia phone can’t be guaranteed to work in a Motorola or Ericsson.
To make things easier, every WML page is divided into “cards”, each of which is displayed as a separate entity by the WML browser. This deck of cards approach requires you to explicitly add navigation instructions to your cards, so that users will be able to access the information you’re delivering to their phones. You can use <a href> style links, which aren’t understood by every phone, or by using WML’s <do> and <go> tags, which work with a phone’s built-in menu system.
Every card has an ID, and a name. The ID is used to handle navigation between the cards in the deck. The simple deck shown below has a single card, which will display a line of text in a phone’s screen.
<wml><card id="card1" title="PCplus"><p>Hello from the PC Plus Web Workshop.</p></card> </wml>Using the following snippet of code, you can use a phone’s keys to move from one card in a deck to another. A label displayed on the phone menu as “Next” will allow a user to move from one card to another in a deck.
<do type="accept" label="Next"><go href="#card2"/></do>One thing to notice about WML is that the <go> statement in this block has to be explicitly terminated by a trailing slash – otherwise it will cause an error, and won’t be displayed. You also have to make sure that you only use lower case for your WML tags, otherwise they won’t be recognised by XML parsers. It’s good form now to also only use lower-case for your HTML tags, as the next release of HTML will be XHTML 1.0, which applies XML rules to HTML.
Here’s a more complex piece of WML code. This is a four-card deck that takes a user input, and then displays it on the phone’s screen:
<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN""http://www.wapforum.org/DTD/wml_1.1.xml"><wml> <card id="card1" title="PCplus"><do type="accept" label="Next"><go href="#card2"/></do> <p>This is a test WML deck for PC Plus.</p></card><card id="card2" title="Pick List"> <do type="accept" label="Next"><go href="#card3"/></do><p>Please choose a word:<br/> <select name="word" value="Hello" title="Word"><option value="Hello"> Hello </option> <option value="Goodbye"> Goodbye </option>This might seem fairly simple by normal HTML standards, but it gives you a good idea of most of the main WML functions. All the text blocks are surrounded by <p>…</p> tags and the document has an XML document type, so that it can be validated against the official WML specification.
You’ll need to include this block at the start of every WML document you create for it to be handled by most WAP gateways:
<?xml version="1.0"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN""http://www.wapforum.org/DTD/wml_1.1.xml">The DOCTYPE section includes the URL of the official WML XML definition document.
Our example uses two cards to take inputs. These use the two most common WML input statements, the <select> block and an <input> statement. The <select> block is just the same as a standard HTML form select statement, and behaves very much the same way. You’ll need to give it a title, as it’s usually displayed in its own screen by most WAP browsers.
<select name="word" value="Hello" title="Word"><option value="Hello"> Hello </option> <option value="Goodbye"> Goodbye </option></select>One difference is that you can access the resulting value and display it in the rest of the cards of a deck, before submitting back to a web server for processing just like a standard form. The “name” of a select block is used to hold the resulting value, and it can be displayed by prefixing it with a $. In our example, card 4 displays both the values of the select block and the input statement.
Select blocks are the best way of creating interactive WML applications. You can use them to provide a WAP site’s users with pre-configured choices, rather than expecting them to use the phone to type in values. One of the difficulties with a phone’s simple keyboard is that is can take up to 4 key presses just to enter a letter. If a free form input is needed, you can use the input tag to control a user’s inputs using an input mask. This can limit the types of characters they are allowed to input, or can force a specific length. You’ll find this also useful if you’re using the input tag to input a password – which if you choose the passport type, will be concealed rather than displayed. It’s also possible to group the various types of input element, allowing you to create complex applications that behave more like HTML forms.
If you want to know more about WML, download the Nokia WAP Toolkit from www.nokia.com. Not only does it come with plenty of documentation on WML in PDF format, it also includes a set of simulators that allow you to test your pages. These include the popular 7110, as well as two of their latest phones: the 6110 and 6150. Nokia aren’t the only company with WAP phones and simulators. Motorola has one, as does Ericsson. Most of these companies will ask you to sign up to their free developers programmes, which are well worth using, as they provide support and plenty of information you won’t find elsewhere – there were only two books on WAP available at Amazon when this article was written…
Of course, if you want to have something more generic, you can use the tools provided by the originators of the WAP standard: Phone.com. You’ll also find that soon most of the commonly available web design tools will support WML. Already HomeSite will handle WML documents, and Macromedia are working with Nokia to add support to Dreamweaver.
Once you’ve created (and tested) your first WML pages, upload them to your web space – making sure you use the WML extension for all your pages. You’ll also need to check that your ISP has configured its web servers to use the correct MIME-type for WML decks (text/vnd.wap.wml), so they’re handled correctly by the WAP gateways. Then all you need is a WAP phone to see if you can access your web pages on the move…
In the next workshop we’ll be looking at how to create more complex WML decks, using WAP’s built in scripting language WMLScript. Similar to JavaScript, WMLScript allows you to produce WML decks that run small applications in a mobile phone. We’ll also take a quick look at WTAI, the Wireless Telephony Applications Interface, which lets you create WML applications that can work with a phone’s built-in functions.
iMode – Japan shows the way to the future
In Japan the mobile Internet is using HTML and colour displays…
Whilst the western world has standardised on WAP and WML as the key technologies for mobile Internet services, they are limited by the low speeds of the current GSM data network. In these days of ADSL and cable modems 9600 bps is somewhat on the slow side…
Over the next few months the main GSM network operators in the UK will be rolling out GPRS services. The General Packet Radio Service is a very different way of delivering mobile data, as it’s equivalent to an always-on ISDN connection. The next generation of the WAP standard, WAP 1.2, is likely to add new services designed to support these higher bandwidth connections. But what type of applications will we see?
One pointer could be NTT DoCoMo’s wireless Internet service iMode. This is a 22 Kbps packet radio service currently running in Japan’s main cities. Its low prices have attracted a lot of subscribers, and it uses a compact version of HTML to deliver applications to phones. C-HTML is easy to use, and it’s very easy to convert existing web sites to run in iMode phones. With most of the main Japanese consumer electronics companies producing iMode phones, they’re becoming cheaper and more sophisticated – with the latest offering colour displays. Games and chat are the most popular services on iMode, with some phones downloading new tamagotchi or Pokemon-style characters for a small fee. You can also shop online, or access your bank details.
Next year will see the British Isles’ first 3G trials in the Isle of Man. BT Cellnet has partnered with NTT DoCoMo to see how the iMode experience can be brought to the next generation of mobile phones.
You can find out more about iMode at http://www.nttdocomo.com/
