ВСЕ О WAP & WML - 8 Июля 2007 - Инфомация для веб-программистов

Автор: TanaT

Источник: hackzone.stsland.ru

Disclaimer

Не пугайся, если слова WAP и WML тебе еще не знакомы. WAP это протокол для работы с Интернетом с помощью мобильных телефонов, а WML это язык программирования, на котором создаются "сотовые" странички. К концу этой статьи ты будешь знать не только, что это такое и с чем их едят, но сможешь сам кодить свои собственные страницы и посещать их, даже если у тебя нет мобильника!

Мы представляем твоему вниманию достаточно подробный курс молодого бойца, содержащий не только теоретические основы, но и "продвинутые" приемы, позволяющие автоматизировать процесс кодинга и сделать его приятным и удобным.

WAP

WAP (Wireless Application Protocol) буквально означает - протокол беспроводных приложений. С его помощью такие устройства, как мобильные телефоны, пейджеры и двустороннее радио (two-way radios) получают возможность доступа к различным удаленным сервисам.

Честно говоря, чтобы создавать свои собственные информационные странички, вовсе не обязательно разбираться в самом протоколе и даже знать, что это такое. Однако профессиональный кодер не должен жить в скорлупе своего языка программирования и IDE, поэтому мы все же рассмотрим аспекты WAP, связанные с Интернетом.

Протокол WAP развивается в основном благодаря компании WAP Forum (www.wapforum.org). Она занимается разработкой стандартов и спецификаций, то есть создает общие для всех "правила игры". Сам протокол поддерживается такими гигантами, как Nokia, Phone.com, Motorola и Ericsson, которые и создали WAP Forum. На сайте этой компании можно найти достаточно много дополнительной информации, вводящей в курс дела.

Давай вкратце рассмотрим принцип действия WAP. Основная идея заключается в том, что доступ к ресурсам Интернет осуществляется не напрямую, а через WAP-шлюз. Последний занимается преобразованием WML в HTML и обратно. О самом WML мы поговорим чуть позже. А сейчас надо разобраться, почему возникла необходимость в создании WAP-шлюза. Дело в том, что в каждом устройстве, использующемся для доступа по WAP, встроен микробраузер. Он обладает существенными отличиями от обычного PC браузера. Например, в нем используются всего лишь два цвета (черный и белый), что приводит к определенным трудностям в создании и размещении картинок; также окно микробраузера имеет достаточно малые размеры, вследствие чего возникают нюансы при размещении информации на странице.

Поэтому и нельзя использовать обычные, всем привычные TCP/IP и HTML для работы с сетью через мобильные средства связи. В принципе, остальные особенности WAP имеют сугубо технический характер, выходящий за рамки данной статьи. Поэтому мы плавно переходим к WML. А напоследок немного статистики. Достаточно популярный в рунете сайт www.wapgate.ru провел исследование, характеризующее популярность WAP в России. Результаты следующие: 32% исследуемых фирм имеют свой WAP-сайт, 41% - не имеет, а 27% планируют его разработку. Самым популярным средством доступа к WAP-страницам стал WAP-телефон, около 50%.

WML

WML (Wireless Markup Language) это язык, используемый для создания WAP-страниц. Неправда ли, расшифровка его аббревиатуры очень напоминает расшифровки XML (eXtensible Markup Language) и HTML (Hyper Text Markup Language)? И это не случайно. Дело в том, что WML есть некая смесь этих двух языков, спроектированная в жестких рамках требований, предъявляемых микробраузером. Для полноты рассмотрения надо отметить, что вначале для работы с WAP существовал не только WML, но еще и HDML (к сожалению, я не знаю, как расшифровывается данная аббревиатура, а сочинять не имею права). Однако HDML не прижился, и в более поздних реализациях WAP был исключен. WML является общим стандартом почти для всех микробраузеров (что-то типа HTML для PC браузеров или ANSI C++ для Windows&Unix), однако некоторые компании, занимающиеся мобильными технологиями, разработали собственные языки, поддерживаемые, естественно, только их микробраузерами. Например, компания Motorola разработала свой VoxML. Изучить весь WML в рамках одной статьи достаточно непросто, однако в этом нет необходимости, так как в этом языке очень много заимствовано из HTML. Поэтому знание этого языка очень сильно пригодится при создании WAP-страниц. К тому же существуют программы, позволяющие создавать WAP-страницы с помощью визуального интерфейса, при этом редактирование WML-кода почти не требуется, а в некоторых случаях невозможно в принципе.

Полную спецификацию WML можно найти на www.wapforum.org или в SDK от какой-нибудь "мобильной" компании, например, Motorola. Между прочим, в рунете достаточно много переводов Motorola SDK (он самый популярный), рассказывающих в деталях и на вполне доступном языке принципы создания WML-кода. Скачать сам Motorola SDK (что, безусловно, захочется сделать любителям копаться в первоисточнике) можно с сайта компании-составителя SDK: http://developers.motorola.com/developers/wireless/tools. Однако вначале придется зарегистрироваться (это бесплатно). А вот где можно найти переводы:

- http://kunegin.narod.ru/ref2/wap/wap7.htm - введение в WML;

- http://kunegin.narod.ru/ref2/wap/wap8.htm - описание тегов WML;

- http://www.wapgate.ru/info/wml.php3 - все вместе взятое.

Мы же рассмотрим базовые концепции, лежащие в основе программирования любой WAP-страницы. Прежде всего нужно уяснить, что WML-код построен на контейнерах. Контейнер - это такой элемент (или объект), включающий в себя другие элементы (объекты). Например, весь WML-код должен размещаться между двумя тегами <wml> и </wml> (первый из них открывающий, второй закрывающий). Таким образом, wml это контейнер, который может содержать в себе бог его знает сколько еще элементов и других контейнеров.

Ты, наверное, обратил внимание, что синтаксис тегов сильно похож на синтаксис HTML? Однако WML заимствовал из HTML не только эту особенность синтаксиса. По-прежнему многие элементы могут иметь атрибуты, характеризующие какие-либо их свойства. Подробнее это мы обсудим далее. Раз уж мы заговорили о тегах, то скажу сразу, что теги бывают открывающие, закрывающие и одиночные. Первые два мы уже видели, а примером третьего может служить классический тег принудительного перехода на следующую строчку <br>. Любая WAP-страничка должна иметь расширение .wml, а каждый сервер, размещающий у себя такие страницы, должен быть правильно сконфигурирован, чтобы корректно обрабатывать WAP-запросы. Подробнее о конфигурации сервера можно почитать на сервере www.wapgate.ru в разделе "Как настроить сервер".

Теперь посмотрим, из каких же основных частей состоит любой корректный WML-код. А состоит он из заголовка и карт, объединенных в колоды. С заголовком все достаточно просто: это три стандартные строчки, содержащие информацию о номере версии XML, идентификаторе SGML-описания языка WML и веб-адресе DTD-определения WML-документа. Чаще всего кодеры пользуются WML-редакторами, которые вставляют эти данные в страницу автоматически. Так что запоминать это не обязательно. Для полноты картины надо отметить, что заголовок обычно имеет следующий вид:

<?xml version="1.0"?>

<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"

"http://www.wapforum.org/DTD/wml_1.1.xml">

Кстати, комментарии в WML вводятся точно так же, как и в HTML: между двумя тегами . Также обрати внимание на адрес: http://www.wapforum.org/DTD/wml_1.1.xml. Надеюсь, теперь ты понимаешь всю роль компании WAP Forum в организации связи между Интернетом и мобильными средствами связи :))) ?

После заголовка следуют карты, объединенные в колоды (или деки). Это уже абсолютно новые понятия, появившиеся в WML и отличающие его и от HTML, и от XML. Карта это совокупность страничек, а колода это совокупность карт, загружаемых за один раз. Зачем они нужны? Дело в том, что экран микробраузера достаточно мал, поэтому грузить страницы раздельно друг от друга просто невыгодно, так как на это будет тратиться много времени. А загружать страницы "пачками" намного быстрее. Такими пачками и являются карты. Далее поднимаемся еще на один уровень выше: карты тоже легче грузить не по одной, а колодами. В этих двух понятиях и состоит основное отличие WML-документов. Для каждого микробраузера (мобильного телефона) существует свой собственный максимальный размер колоды. Обычно он не превышает 8 кб (помни, ведь маленькие "мозги" твоего мобильника - это не CPU от Intel с КЭШами трех уровней). Все карты должны отделяться друг от друга заголовками, включающими в себя идентификатор карты и ее имя. Идентификатор служит лишь для вызова этой карты, например, из другой карты. Вот пример такого заголовка:

</card>

Как видишь, карта является контейнером, в котором размещаются элементы. Идентификатор карты и ее имя (в нашем примере это CardID и MyCard соответственно) являются атрибутами контейнера. Тэги форматирования практически совпадают с аналогичными из HTML (и по синтаксису, и по назначению). Например, выравнивание абзацев производится так:

<p align="center"> - по центру

<p align="left"> - по левому краю

<p align="right"> - по правому краю

А картинки вставляются так:

Гиперссылки оформляются так:

Вместо слова "Идентификатор" должен стоять идентификатор той карты, куда указывает гиперссылка.

Теперь можно подробнее рассмотреть графику в WAP-страничках. Графикой это можно назвать с натяжкой - микробраузер понимает лишь черно-белые картинки в формате WBMP (Wireless BMP). Для того чтобы конвертировать любой графический формат (для gif, jpg и bmp точно) в wbmp, надо воспользоваться либо on-line конвертером по адресу www.teraflops.com/wbmp, либо специальным графическим редактором. Достаточно большой список таких редакторов можно найти по адресу: http://www.wapgate.ru/soft/?s=4. От себя могу добавить, что качество полученной WBMP-картинки сильно зависит от ее контрастности: чем контрастнее, тем лучше.

Вставляемая картинка может иметь следующие параметры, прописываемые в тэге: localsrc, align, height и width (alt - мы уже рассмотрели). Думаю, с align вопросов не возникнет (это выравнивание), height и width это, соответственно, высота и ширина (в пикселях) картинки. Атрибут localsrc позволяет выводить на экран картинку, специфичную для данного микробраузера. Список таких картинок должен быть подробно изложен в техническом руководстве браузера.

Есть еще некоторые тонкости, о которых не стоит забывать:

- WML различает заглавные и строчные буквы, поэтому будь осторожен.

- не все микробраузеры поддерживают русский язык, поэтому дублируй всю информацию в транслите (пиши английскими буквами русские слова), а в начале страницы предлагай выбор между русским и транслитом;

- обязательно отлаживай свою страницу в эмуляторе микробраузера, чтобы посмотреть, как она будет выглядеть на маленьком экране мобильного телефона. Такие эмуляторы можно найти в WML-редакторах (о них ниже) или на сайтах, к примеру, на www.wapgate.ru

Вот, в принципе, и все, что хотелось тебе рассказать. Теперь ты знаешь, где и как кодить, где размещать страницы и найти дополнительную информацию. Интернет ждет твоей WAP-странички!

После того как ты сделаешь свою страницу или целый узел, тебе, безусловно, захочется разместить его в сети. В таком случае пригодится список ресурсов, предоставляющих WAP-хостинг. Должен признаться, что в Интернете достаточно мало сайтов, предоставляющих такой хостинг бесплатно. Я нашел только три:

- http://wappy.to/

- http://tagtag.com/site/index.php3

- http://www.wapdrive.com/

На каждом из этих сайтов можно найти дополнительную информацию, касающуюся WAP и WAP Tools (эмуляторы и редакторы). А некоторые предоставляют также коллекцию собственных wbmp-картинок.

БЫСТРЫЙ СТАРТ

Для того чтобы начать быстро кодить свои страницы на уровне профи, созданы WML-реадкторы. Если еще год назад их было всего штук пять на весь Интернет (не рунет, а Интернет), то сейчас их не менее двух десятков. Насколько они полезны, мы сейчас разберемся. Честно говоря, обзор WML-редакторов это тема отдельной статьи. Поэтому мы рассмотрим лишь два самых лучших из них.

DotWap (Freeware, download.inetis.com/files/DotWAP2.EXE, 696 кб)

Очень удобная штучка, этот DotWap. Помнишь, в начале статьи я рассказывал о программке, позволяющей клепать WAP-страницы без знания WAP&WML? Так вот, это она и есть. Очень понятный интерфейс (типа проводника в Windows), наличие WAP-эмулятора, автоконвертер любых графических форматов в WBMP и огромная коллекция тегов - все это делает процесс написания (даже не написания, а щелканья на пунктах разных меню) не просто удобным, а приятным. Самое интересное, что в этой программе даже нет окна, позволяющего редактировать WML-код. Зато есть различные пункты меню: добавить страницу, параграф, ссылку, рисунок. В эту программу встроена функция автоматического хостинга с сервером tagtag (второй в нашем списке бесплатных хостеров), что, безусловно, приятно, так как позволяет закачивать свои данные прямо на нужный сервер. В общем, все сделано очень удобно и, главное, понятно.

EasyPad WAPtor (Shareware, http://www.waptop.net/software/waptor3.exe, 1209 кб)

Честно говоря, вначале хотел предложить тебе ссылочку либо на crack, либо на s/n для этой программки. Однако был неприятно удивлен отсутствием ее вообще. Видимо, программка слишком молодая :(.

Что же она предлагает? В возможности этой программы входит: конвертирование графики в WBMP, эмулятор микробраузера и огромное число шаблонов. Если сравнивать ее с предыдущей, то можно придти к следующему выводу: она позволяет настраивать страницы более гибко, однако для этого требуются знания WML. Здесь напрашивается параллель: C++ Builder и MS Visual C++. Первый точно так же, как DotWap, поддерживает технику визуального программирования, а второй, как WAPtor, содержит множество шаблонов. Должен признаться, что WAPtor более мощная программа (на это косвенно указывает ее больший размер и шароварность). Ее интерфейс тоже достаточно понятен и кое-где даже более удобен, чем интерфейс DotWap. Но все же не следует забывать, что знание WML здесь является необходимым.

Резюме: если ты только начинаешь кодить свои первые странички, то без раздумий выбирай DotWap. Его маленький размер и бесплатность лишь небольшие плюсы. Главное, полностью визуальный интерфейс и много дополнительных инструментов (конвертор+эмулятор) помогут тебе втянуться и стать профи. Если ты опытный профи, знающий WML, как свои пять пальцев, то гибкий WAPtor это твоя стихия. Однако, в любом случае, тебе ничто не мешает использовать две эти программы одновременно или поочередно, в зависимости от сложившихся обстоятельств.