Библиотека веб-дизайна
WAP своими руками
© Виталий Трахтенберг
студия веб-дизайна TVYSoftware.com
Мобильный Интернет все глубже и глубже входит в нашу жизнь. Выходить в Интернет посредством технологии GPRS уже не новость. Но, к сожалению, далеко не все мобильные телефоны оснащены полноценными броузерами, понимающими HTML (xHTML). Да и просматривать страницы, рассчитанные на стандартные компьютерные экраны, с экранцича мобильного телефона или PDA не так уж удобно... и широко, и мышки не хватает. Вот тут на помощь приходит протокол WAP.
WAP (Wireless Application Protocol) – это протокол, позволяющий просматривать специально созданные сайты на экранах мобильных телефонов. Основное отличие WAP сайта от привычного заключается в различие устройств доступа на сайт. В случае WAP сайта это мобильный телефон со встроенной программой просмотра WAP-сайтов.
WAP-сайт - это текстовый сайт, с минимально возможным количеством графических элементов.
Примеры использования WAP:
- Узнать расписание поездов и самолетов
- Информация о пробках на дорогах
- Узнать прогноз погоды
- Получить информацию о курсах валют или котировках на бирже
- Поработать с почтой
- Использовать ICQ
WAP-страницы не очень сильно отличаются от обычных HTML-страниц. В основе лежит язык WML (Wireless Markup Language). В языке WML используются теги, так же как в HTML, только в WML синтаксис строже и должен полностью соответствовать стандарту XML 1.0. HTML - предопределяет те тэги, которые могут быть использованы для описания страницы так, чтобы ее смог правильно понять и обработать броузер. XML, в свою очередь, позволяет создателю документа определять такой набор тэгов, которой он считает необходимым. Этот набор тэгов группируется затем в набор грамматических "правил", называемых по-другому «Определение Типа Документа» или проще DTD.
WML теги
WML, в основном, описывает текст и ссылки. Использование таблиц и графики весьма ограничено. Так как WML соответствует XML стандарту, то имеет значение регистр букв. Это значит, что <wml> и <WML> - разные теги. Другой важный момент - это жесткое требование, что каждый тег должен закрываться (аналогично XML).
WML decks and cards
WML страницы называются папками (Decks). Они состоят из нескольких документов (Cards), связанных между собой ссылками. Когда сотовый телефон загружает WML-страницу, загружаются вся папка с документами. Переход по ссылкам внутри страницы осуществляется быстро, без обращения к серверу.
Пример создания WML-страницы
Итак, начнем создавать наш первый WAP-cайт. Для этого понадобится любой текстовый редактор, в котором нужно создать файл с расширением ".wml".
В телефоне или в любом другом коммуникационном устройстве, заявленном как WAP-совместимое, загружено специальное программное обеспечение (известное как микроброузер), которое полностью понимает, как обрабатывать все вариации WML 1.1 DTD. Самая первая фраза внутри любого XML-документа называется пролог. Поскольку он стандартен, он содержит две строчки кода: определение версии XML и DTD (указатель на файл, содержащий DTD).
Пролог выглядит следующим образом:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
Следом за прологом, в каждом XML-документе содержится элемент, который содержит в себе остальные подэлементы. Этими элементами являются угловые скобки: <> и </>. В документе должен содержаться только один элемент описывающий сам документ.
В WML этим элементом является <WML></WML>. Все остальные элементы содержатся уже внутри него.
Два самых распространенных способа хранения информации внутри XML-документа - это элементы и их атрибуты. Элементы определяют структурную разметку внутри документа открытием и закрытием определенных тэгов. Элементы, в свою очередь, могут содержать подэлементы. Атрибуты в основном используются для описания элементов.
<wml>
<card id="TEST" title="HELLO WORLD">
<p>
Hello world!
</p>
</card>
<card id="TEST2" title="HELLO WORLD2">
<p>
Hello world!
Hello world!
Hello world!
</p>
</card>
</wml>
Содержимое страницы в тегах <wml>...</wml>, содержимое документов в тегах <card>...</card>, каждый имеет свой id и title. Абзацы разделяются тегом <p>...</p> На экран сотового телефона одновременно выводится только один документ.
<br/> - перевод строки
Форматирование шрифта
<em>наклонный</em>
<strong>жирный</strong>
<b>жирный</b>
<i>наклонный</i>
<u>подчеркнутый</u>
<big>увеличенный шрифт</big>
<small>уменьшенный шрифт</small>
Таблицы
<table columns="3">
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
</table>
Ссылки
<a href="test.wml">Дальше</a>:
<anchor>
Перейти на страницу Тест
<go href="test.wml"/>
</anchor>
<anchor>
Предыдущая страница
<prev/>
</anchor>
Изображения
<p>
This is an image
<img src="/images/stickman.wbmp"
alt="stickman" />
in a paragraph
</p>
WAP поддерживает только изображения в специальном формате .wbmp
Формы
Текстовое поле
Имя: <input name="name" size="15"/><br/>
Выбор из одного пункта списка:
<select>
<option value="male">мужской</option>
<option value="female">женский</option>
</select>
Выбор одного или нескольких пунктов из списка:
<select multiple="true">
<option value="v1">Soup</option>
<option value="v2">Meat</option>
<option value="v3">Tea</option>
</select>
Пример использования формы в 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 id="card1" title="Tutorial">
<do type="accept" label="Answer">
<go href="#card2"/>
</do>
<p>
<select name="name">
<option value="HTML">HTML
Tutorial</option>
<option value="XML">XML Tutorial</option>
<option value="WAP">WAP Tutorial</option>
</select>
</p>
</card>
<card id="card2" title="Answer">
<p>
You selected: $(name)
</p>
</card>
</wml>
Как видите, создание WAP-версий сайтов – занятие не такое уж и сложное. По крайней мере, оно вполне под силу тем, кто освоился с языком разметки HTML. Больше об этом вы можете почитать в спецификации технологии WML.
При перепечатке любых материалов этого сайта прямая активная ссылка на TVYSoftware.com обязательна!
