Milan Kryl

WML Wireless Markup Language

Pro použití ve WAPu bylo potřeba vytvořit nějaký programovací jazyk, který by umožňoval vytváření stránek pro mobilní zařízení. Jelikož se zdálo zbytečné vymýšlet něco již vymyšleného, tak se jako základ vzal jazyk XML. Až na několik odlišností se podobá jazyku HTML.

Obsahem stránky je text formátovaný značkami (tagy). Tyto značky mohou být dvou typů. Párové <tag> nějaký obsah </tag> a nepárové <tag/>. Zde se setkáváme s první odlišností od jazyka HTML, kde jsou nepárové tagy použity bez lomítka na konci. Obsah, který je mezi dvěma značkami nese tu vlastnost, kterou mu tagy přisoudily. např. <p> Vitame vas ve svete WAPu </p> označuje jeden odstavec textu. Každý tag může ještě obsahovat upřesňující další atributy. Ty jsou uváděny v první části, hned za jménem. <tag atribut="hodnota"> obsah </tag>

Jazyk WML je case-sensitive to znamená, že jsou rozlišována malá a velká písmena. Všechny značky jsou psány malými písmeny.

A nyní si již můžeme ukázat jednoduchý příklad souboru napsaném ve WML: 

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
              "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
  
  <card>
    <p>Prvni WML stranka.</p>
  </card>
</wml>
Prvni stranka

První tři řádky jsou důležité, neboť je zde označena použitá verze WML a její norma. Tag <wml> určuje, že zde začíná dokument napsaný ve WML. Tag <card> označuje vždy jednu kartu (v anglické terminologii deck). Stránky se dělí na karty, které jsou v prohlížeči zobrazovány najednou. Pokud tedy otevřeme soubor obsahující více karet, zobrazí se pouze jedna a na ostatní se nedostaneme, pokud na ně nejsou vytvořeny nějaké odkazy. Důležitým elementem je také komentář, který je identický s komentářem v HTML. (<!-- -->)

Pro vytváření dokumentů ve formátu WML nám postačí jakýkoliv textový editor neukládající formátovací značky. (např. Poznámkový blok) Pro profesionální tvorbu dokumentů je však lepší nainstalovat specializovaný software. K dispozici jich je hned několik. Nokia Wap Toolkit 2.1 je ke stažení zdarma na stránkách http://forum.nokia.com/ kromě editoru zahrnuje simulátor prohlížeče telefonu Nokia 7110, editor WML skriptů a obrázků ve formátu WBMP. A dispozici jsou i funkce usnadňující ladění aplikací ve WML skriptu.

Firma Phone.com dodává sice jen prohlížeč na WAP stránky, ale jistě bý ho měl profesionální vývojář vlastnit, neboť Phone.com dodává WAPové prohlížeče do všech telefonů, kromě značek Ericsson a Nokia, např. Motorola, Siemens,... Software je k dispozici také zdarma po vaší registraci.

Samozřejmě ani firma Ericcson nemůže zůstat pozadu a nabízí na svých stránkách také ke stažení vlastní vývojové prostředí a simulátor telefonu Ericsson R380. AppDesigner obsahuje integrované vývojové prostředí včetně simulátoru telefonu.

Formátování textu

Nejednodušším prvkem ve WML je asi změna písma v odstavci. Přesto že možnosti mobilních telefonů v zobrazování písma jsou značně omezené, můžeme alespoň naznačit jak bychom si přáli, aby bylo písmo interpretováno.

Pro zvýrazění textu můžeme použít elementy <em> a <strong>, které se obvykle zobrazují kurzívou (<i>) a tučným písmem (<b>). A potom elementy umožňující změnit velikost písma (pokud je podporováno prohlížečem) <small> a <big>. 

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
              "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
  <card>
    <p><i>Kurziva</i>
       <b>Tucne</b></p>
  </card>
</wml>

Pokud na stránce potřebujeme konec řádku, použijeme <br/>. Tento element se používá pro doladění výsledného vzhledu. 

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
              "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
  <card title="Jak si uzit volna">
    <p>
	Zabava<br/>
	- filmy<br/>
	- hudba<br/>
	- chat<br/>
	-hry
	</p>
  </card>
</wml>

Použitím atributu title v elementu <card> jsme docílili toho, že stránka bude mít titulek s tímto textem. Hodnota atributu musí být vždy uzavřena v uvozovkách nebo apostrofech.

Odkazy

WAP jako zjednodušení WWW obsahuje také hypertextové odkazy. Vytvářejí se zde úplně stejně jako v HTML. Text, který bude reprezentovat odkaz, se uzavře do elementu <a> a URL adresa cílové stránky se napíše do atributu href. 

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
              "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
  <card title="Odkazy">
    <p>
	Ztratili jste neco? <br/><a href="http://google.com">Hledejte</a><br/>
	Za <a href="http://www.disney.com/">zabavou</a><br/>
	</p>
  </card>
</wml>

Více karet

Velmi výhodné je používat větší množství karet, protože mobilní zařízení načte celý soubor a při přechodu na další kartu se nemusí opět spojovat se serverem ke stažení dalších dat.

Při zobrazení souboru se na displeji objeví vždy první karta v pořadí. Aby se uživatel mohl dostat na další karty, je třeba na ně vytvořit na první stránce odkazy. Mikroprohlížeč totiž umí zobrazovat pouze jednu kartu najednou.

Abychom se mohli na karty odkazovat, musime je nejprve jednoznačně pojmenovat. Jméno udává hodnota atributu id elementu card. Odkaz na kartu je potom speciálního tvaru #jméno_karty. 

<?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="welcome" title="Vitejte">
  <p>
    na vynikajicim portalu. Pokracujte <a href="#links">zde</a>
  </p>
  </card>
  <card id="links" title="Odkazy">
    <p>
       Ztratili jste neco? <a href="http://google.com">Hledejte</a>
       Za <a href="http://www.disney.com/">zabavou</a>
      <a href="#welcome">zpet na uvod</a>
    </p>
  </card>
</wml>

Po volbě odkazu na první stránce přejde prohlížeč na stránku druhou.

Navigace

Je možné vytvářet nejen odkazy, ale také navigační prvky, které je někdy ještě jednodušší používat. Většinou jsou volány stiskem nějaké klávesy nebo výběrem z menu. (to již záleží na implementaci každého prohlížeče)

Pomocí elementu <do> můžeme definovat několik akcí. Nejčastěji se používa se dvěma atributy label a type. První z nich je popiska akce a druhý určuje typ akce, kterou definujeme. např. Pokud uvedeme hodnotu accept říkáme, že uživatel bude něco potvrzovat (výběr z menu, přechod na další stránku, apod.) Můžeme také použít hodnotu prev, která mikroprohlížeči oznamuje, že akce má jít vyvolat takovým způsobem, jako se na daném zařízení vrací zpět na předchozí stránku. Většina telefonů používá pro tuto akci speciální klávesu, která na této kartě spustí námi nadefinovanou akci. Nebo několik dalších typů: help, reset, options, delete, unknown.

V elementu <do> je uloženo, co se provede, když uživatel tuto volbu vybere. Nejčastěji se používá element <go>, který umožňuje přechod na libovolnou další stránku nebo kartu určenou pomocí URL adresy v atributuju href. 

<?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="welcome" title="Vitejte">
    <do type="accept" label="Dalsi karta">
      <go href="#links"/>
    </do>
   <p>
    na vynikajicim portalu. Pokracujte <a href="#links">zde</a>
   </p>
  </card>
  <card id="links" title="Odkazy">
    <do type="prev" label="zpet">
      <prev/>
    </do>
    <p>
      <a href="http://google.com">Hledejte</a><br/>
      Za <a href="http://www.disney.com/">zabavou</a><br/>
      <a href="#welcome">zpet na uvod</a>
    </p>
  </card>
</wml>

Pro volání předchozí stránky nemusíme psát tag <go>, ale lze využít také element <prev/>, který má totožnou funkci.

Neboť se často stane, že člověk při procházení WAPových stránek zvolí špatný odkaz a objeví se tam, kam původně nechtěl. Je velmi dobré umožnit přechod na předchozí stránku na všech kartách. Ale přidávat ručně tuto funkci na každou z karet by bylo přinejmenším pracné a také zbytečné. Jazyk WML nám totiž umožňuje umístit na začátku stránky element template, který se poté používá na všech kartách v souboru. Při větším množství karet je patrná i celková úspora kódu, který by se jinak musel vytvářet a přenášet. 

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
              "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
  <template>
    <do type="prev" label="Zpet">
       <prev/>
    </do>
  </template>
  <card id="welcome" title="Vitejte">
    <do type="accept" label="Dalsi karta">
       <go href="#links"/>
    </do>
    <p>
       na vynikajicim portalu. Pokracujte <a href="#links">zde</a>
    </p>
  </card>
  <card id="links" title="Odkazy">
    <p>
       Ztratili jste neco? <a href="http://google.com">Hledejte</a>
       Za <a href="http://www.disney.com/">zabavou</a>
       <a href="#welcome">zpet na uvod</a>
    </p>
  </card>
</wml>

Tabulky

K přehlednému uspořadání toho mála informací, které lze zobrazit na displeji, můžeme vhodným způsobem využít právě tabulek.

Tabulka se vkládá elementem <table> Atributem columns musíme určit počet sloupců, aby mikroprohlížeč mohl data rychleji zpracovat. Jednotlivé řádky tabulky jsou v elementech <tr> a každá buňka ještě v elementu <td> 

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
              "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
  <card title="Sklad shop.cz">
    <p>
	<table columns="2">
	<tr>
	  <td>Zbozi</td>
	  <td>kusu</td>
	</tr>
	<tr>
	  <td>CD</td>
	  <td>3724</td>
	</tr>
	<tr>
	  <td>Knihy</td>
	  <td>12 448</td>
	</tr>
	<tr>
	  <td>Cokolada</td>
	  <td>1000</td>
	</tr>
	</table>
	</p>
  </card>
</wml>

I když tabulky vypadají skvěle, je jejich reprezentace v mobilních zařízeních hodně rozdílná. Například telefon Nokia 7110 zobrazuje buňky tabulky na samostatné řádky a tudíž o nějakém formátování nemůže být řeč. Některé mikroprohlížeče, když se jim nevejde řádek na displej, tak jej zalomí a jiné umožňují posouvání do strany, jako známe u internetových prohlížečů.

Obrázky

Umístění obrázků na stránky je opět velmi jednoduché. Postačí nám k tomu element <img> a jeho atributy src a alt. První z nich je určen pro definování cesty k obrázku a druhý je alternativní komentář pro prohlížeče obrázky nezobrazující nebo pokud obrázek nepůjde zobrazit. Pro rychlejší interpretaci prohlížečem je dobré ještě udávat výšku a šířku obrázku v elementech width a height. 

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
              "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
  <card title="Galerie">
    <p>
	  <img src="mojefoto.wbmp" alt="Portret autora stranek"
	       height="50" width="37"/>
    </p>
  </card>
</wml>

Neboť v dnešní době není již statický obsah stránek moc aktuální, nestačí se naučit pouze jazyk WML a začít vytvářet profesionální stránky. Dnes je většina WAPových aplikací spojena s použitím nástrojů pro dynamickou tvorbu stránek - PHP nebo ASP a databázemi.

Prameny:

WAP Forum - Specifikace a standarty [http://www.wapforum.cz]
Rostislav Grygar - Revoluce v sítích GSM na obzoru [http://www.ict.cz]
Jiří Kosek - WAP seriál do časopisu mobil [http://www.kosek.cz]