WML

Wireless Markup Language(WML)

Sujata Mishra Regd. No – 04/004Electronics & Tele- Comm. Engg.

Sujata Mishra 2

Outlines Introduction WML vs. HTML Basic Features of WML WML Deck and Card An Example of WML Document Structure of a WML Document WML : Tables WML : Image Linking Cards Navigation WML Generic Metadata :<meta> Advantages of WML Limitations of WML Conclusion References

Sujata Mishra 3

IntroductionWhat is WML ?

WML is a markup language based on XML for wireless devices.

Specifying content and user interface for narrowband devices, such as mobile phone, PDAs.

A part of the Wireless Application Protocol (WAP).

formerly called HDML (Handheld Devices Markup Language) .

Interpreted and rendered by Micro-browsers.

Sujata Mishra 4

WML vs. HTML WML is the wireless equivalent of HTML for the Web. But

there are many differences between WML and HTML.

WML requires very little bandwidth resources compared to HTML.

WML uses lesser power to process compared to HTML. WML has a different mechanism for linking between its pages

called “cards” as compared to linking between HTML pages. WML browsers are stricter than HTML browsers by not being

tolerant of errors. In HTML both tag set and tag semantics are predefined and fixed.

But WML provides facility to define its own tags.

Sujata Mishra 5

Basic Features of WML WML includes four major functional areas:

Text presentation and layout -includes text and image

support, including a variety of formatting and layout.

Deck/card organizational metaphor- all information in WML is organized into a collection of cards and decks.

Inter-card navigation and linking -WML includes support for explicitly managing the navigation between cards and decks. Also supports anchored links similar to HTML.

String parameterization and state management- all WML decks can be parameterized using a state model.Variables can be used in the place of strings and are substituted at run-time. This parameterization allows for more efficient use of network resources.

Sujata Mishra 6

WML Deck and Card A major difference between HTML and WML is that the

basic unit of navigation in HTML is a page, while that in WML is a card.

A WML file can contain multiple cards and they are grouped to form a deck.

When a user goes to a WAP site, the mobile browser loads a WML file that contains a deck of cards from the server.

Only one card will be shown on the screen of the wireless device each time.

Links, text, images, input fields, option boxes and many other elements can be put in a card.

Sujata Mishra 7

An Example of WML Document

<?xml version="1.0"?><!DOCTYPE wml PUBLIC "-//WAPFORUM

//DTD WML 1.3//EN" "http://www.wapforum.org /DTD/wml13.dtd">

<wml> <card id="card1" title="WML Tutorial"> Hello World </card>

<card id="card2" title="WML Tutorial"> Welcome to the world of WML</card></wml>

Nokia Mobile Browser 4.0

Sony Ericsson T610 Sony Ericsson T68i

Sujata Mishra 8

Structure of a WML Document

An WML document consists of: Prolog Elements Attributes Entity references Comments

Sujata Mishra 9

WML : Prolog

Prolog is the first structural element that is present in the WML document. Every WML document starts with the prolog. Usually divided into a XML declaration and a DOCTYPE declaration. The prolog components are not WML elements and they should not be closed with />. Example: <?xml version="1.0"?>

<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.3//EN " "http://www.wapforum.org/DTD/wml13.dtd">

Sujata Mishra 10

XML Declaration

All WML documents are XML documents. So, there is an XML declaration at the start. The XML declaration specifies the XML version of the document. The character encoding of the document can also be specified Like,

<?xml version="1.0" encoding="UTF-8"?>

There should have no whitespace before the XML declaration.

Sujata Mishra 11

DOCTYPE Declaration All WML documents must have the DOCTYPE declaration. Placed between the XML declaration and the <wml> element.

<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.3//EN" "http://www.wapforum.org/DTD/wml13.dtd">

The DOCTYPE declaration specifies the name of the DTD and the URL to the DTD. DTD contains information about the syntax of the markup language. It defines what elements and attributes can be used in the markup and the rules that they should be used.

Sujata Mishra 12

WML : Elements Elements are most common form of markup. WML elements must contain a start tag and a matching end tag prefixed by a slash. <city> Kharagpur </city> Empty elements can be written as <city/> instead of both

tags without contents. WML is case-sensitive. Elements are all in lowercase. Element naming convention: Must begin with an underscore or letter. Can contain letters, digits, underscore, hyphen, and periods.

Sujata Mishra 13

Sujata Mishra 14

WML : Elements & Attributes

<wml> Element

<wml> is the root element of WML. All other elements should be enclosed within the

<wml></wml> tags.

<card > Element The <card> element specifies the content of a card. In order to store content within a document, the WML

<card> container tag is provided.

Sujata Mishra 15

Attributes Description

id Name of the card. Acts as an anchor for navigating to the card. <card id="start" title="Juicy Studio">  </card>

newcontext Determines whether or not a new context is initialised. If a new context is set, all variables are reset and the history stack is cleared. The possible values for this attribute are true or false.

<card id="start" title="Juicy Studio" newcontext="true">  </card>

onenterback

ward Allows to specify a URI to open if the card has been navigated to through a prev task.

<card id="start" title="Juicy Studio"

onenterbackward="#main"> 

</card>

Attributes of <card>

Sujata Mishra 16


onenterfor

ward Allows to specify a URI to open if the card has been navigated to through a go task.

<card id="start" title="Juicy Studio"

onenterforward="#intro">  </card>

ontimer Specifies the URI to open if the timer expires.

<card id="start" title="Juicy Studio" ontimer="#nextcard">



</card> title Title used for the card. Some devices display the title on the

screen if there is enough space.

Sujata Mishra 17

 Element

The element defines a paragraph of text.

The anchor links and images can also be included in the element.

WML : Elements & Attributes

Sujata Mishra 18


align used to change the horizontal alignment of a paragraph.• left• center• right

mode used to set the text-wrapping mode.

wrap - text longer than the screen width will be broken

apart and displayed on multiple lines.

nowrap - the text of the paragraph will be displayed on a

single line and how a long line is displayed

depends on the WAP browser used.

Attributes of 

Sujata Mishra 19

<wml> <card id="card1" title="WML Tutorial"> Hello world. Welcome to our WML tutorial. </card> </wml>

Sony Ericsson T610 Sony Ericsson T68i

Nokia Mobile Browser 4.0

Sujata Mishra 20

<wml> <card id="card1" title="WML Tutorial"> Hello world. Welcome to our WML tutorial. You can learn how to build your own WML site in this tutorial. </card></wml>

Sujata Mishra 21

WML : Entity References They are used to reference data that is not directly in the

structure.

Can be internal or external. Built-in entity references are used to represent &, <,

>, “ and ‘. The String

Tom&Jerry(“Don’t write x<y”) would be written as Tom&Jerry("Don't write x<y")

Sujata Mishra 22

Comments are placed inside  in WML.

Can contain any data except the literal string “--”.

All data between these two tags are ignored by the WAP Browsers.

 

WML : Comments

Sujata Mishra 23

WML : Line Breaking is the line breaking tag in WML.

<?xml version="1.0"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.3//EN" "http://www.wapforum.org/DTD/wml13.dtd">

<wml> <card id="card1" title="Line Break"> Before br After br </card></wml>

Sujata Mishra 24

Font Size and Style WML includes a number of tags that can be used to change the font size and style of the text.

Some older WAP browsers do not support these tags or only support a subset of these tags, even though these tags are defined by the WML specification.

Unsupported WML tags will be ignored by WAP browsers but will not cause any errors.

Bold: Underline: Italic: Big: <big></big> Small: Emphasis: Strong: 

Sujata Mishra 25

<?xml version="1.0"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD ML 1.3//EN" "http://www.wapforum.org/DTD/wml13.dtd">

<wml> <card id="card1" title="Font Style"> Bold Italic Underline Small <big>Big</big> Emphasis Strong </card></wml>

Sujata Mishra 26

WML : Tables

Attribute Description

align Determines how the table is aligned on the device.

•center

•left

•right

<table columns="2" align="center">

columns Specifies how many columns will be displayed. This is a required

field, and cannot be zero. <table columns="2"> title Used to specify a title for the table.

<table columns="2" title="Temperatures">

The <table> element may be used to display tabular data.

Sujata Mishra 27

<?xml version="1.0"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD ML 1.3//EN" "http://www.wapforum.org/DTD/wml13.dtd">

<wml> <card id="page1" title="Table in WML"> <table columns="3" align="LCR"> <tr> <td>Col 1</td> <td>Col 2</td> <td>Col 3</td> </tr> <tr> <td>A</td> <td>B</td> <td>C</td> </tr> <tr> <td>D</td> <td>E</td> <td>F</td> </tr> </table> </card></wml>

Sujata Mishra 28

WML : Image

The <img> element is used to add an image to a WML card.

As the img tag doesn't have a closing tag, a forward slash is required at the end of the element.

Older WAP-enabled wireless devices can only display WBMP images.

Newer ones support image formats commonly used on the web such as GIF, JPG and PNG.

Sujata Mishra 29

Attribute Description

align Determines how the image is aligned with the text.

• top

• middle

• bottom alt Textual description of the image. The text is displayed on the

device while the image is being downloaded. If images are not supported on the device, the alternative text is displayed in its

place.

height Height of the image. If this attribute is provided, the required space is allocated to the rendered page while the image

downloads. may also be used to resize the height of an image. src Used to specify the location of the image source.

width Width of the image. If this attribute is provided, the required space is allocated to the rendered page while the image

downloads. may also be used to resize the width of an image.

Sujata Mishra 30


<wml> <card id="card1" title="Image in WML"> <img src="smile.gif" alt="Smile" height="62" width="60" /> Welcome to our WML tutorial. </card></wml>

Sujata Mishra 31

If the image file does not exist, the result will become:

Sujata Mishra 32

Linking CardsA Element The id attribute is used to identify the name of the card to

link to. There are three ways of specifying a link to another card.

Absolute Link

– contains the full path to the page

– typically used to link to other WAP sites.

– example :

<a href="http://www.juicystudio.com/index.wml">

Visit Juicy Studio</a>

Sujata Mishra 33

Relative Link– contains the name of the WML file, either in the

same directory, or with the relative path from the current directory.

– example : <a href="recent.wml">Recent Posts</a>

Relative Link to a particular card : <a href="recent.wml#today">Recent Posts</a> In-Document Link

– used for WML documents that contain more than one card.

– uses the card id to locate the card.– example :

<a href="#announce">Announcements</a>

Sujata Mishra 34

<?xml version="1.0" encoding="iso-8859-1" ?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"><wml><card id="index" title="Index Page"> <a href="#first">First Link</a> <a href="#second">Second Link</a> <a href="#third">Third Link</a> </card><card id="first" title="First Card"> This is the first card. <a href="#index">Back to Index</a> </card><card id="second" title="Second Card"> This is the second card. <a href="#index">Back to Index</a> </card><card id="third" title="Third Card"> This is the third card. <a href="#index">Back to Index</a> </card></wml>

Sujata Mishra 35

Anchor Element The anchor element specifies the head of a link. The tail of a link is specified as part of other elements. e.g. a card name attribute.

Anchored links can not be nested. The <anchor> element extends the <a> element to perform a go, prev, or refresh task go element- used to specify the URI.

prev element- used to return to the previous page.

refresh element- used to refresh the card's variables.

Navigation

Sujata Mishra 36

<?xml version="1.0" encoding="iso-8859-1" ?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"

"http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="index" title="Index Page"> 

<anchor>First Link<go href="#first"/></anchor> <anchor>Second Link<go href="#second"/></anchor> <anchor>Third Link<go href="#third"/></anchor>

 </card><card id="first" title="First Card">

 This is the first card. <anchor>Back to Index<prev/></anchor>

 </card><card id="second" title="Second Card">

 This is the second card. <anchor>Back to Index<prev/></anchor>

 </card><card id="third" title="Third Card">

 This is the third card. <anchor>Back to Index<prev/></anchor> </card></wml>

Sujata Mishra 37

WML Generic Metadata :<meta>

The meta element contains generic meta-information

relating to the WML deck. Meta-information is specified with property names and

values. Metadata is placed at the document head. A WAP browser will ignore the metadata if it does not

understand the metadata's meaning. metadata of any sort can be specified in a WML file

without affecting the cards' look.

Sujata Mishra 38


<wml> <head> <meta name="author" content="Andrew"/> </head>

<card id="card1" title="WML Tutorial"> Hello World </card></wml>

Sujata Mishra 39

Advantages of WML WML is part of the WAP standard and its use is required.

Transmission of WML (WMLC) documents requires less bandwidth

compared to HTML documents because WML documents are simpler and WML is compressed before it is sent to the WAP device.

Compared to HTML documents, displaying WML documents requires less processing power and memory. Consequently, a WAP device can work with a less powerful (cheaper) CPU and the use of less power means that the battery can operate longer without recharging.

WML provides support for limited graphics with a limited gray scale.

Sujata Mishra 40

Limitations of WML Like HTML, WML does specify how the content is to be displayed.

Thus microbrowsers on different WAP devices are likely to display the WML content differently.

WAP devices such as WAP phones will not accept large decks (1.4K for some WAP phones).

There are many variations between WAP phones (Screen sizes, keypads, and soft keys). This variation is similar to the variation found with Web browsers and their platforms. The problem is harder in case of WML because there are many more WAP devices than Web browsers and their platforms. so it is harder to figure out the set of features that will work reasonably well on all or most WAP devices.

Sujata Mishra 41

Conclusion

WML offers software developers an entirely new, exciting platform on which to deploy their applications.

With this new platform, however, comes a host of

tradeoffs and challenges. While it may take several iterations for developers and vendors to get their product offerings right.

There is no doubt that WAP opens the door to a new era in application development and deployment.

Sujata Mishra 42

References

www.seminartopics4u.org http://en.wikipedia.org/wiki/Wireless_Markup_

Language http://www.wapforum.org/ http://www.allnetdevices.com/faq

Sujata Mishra 43

Sujata Mishra 44

Documents

WML