IZONE - http://www.izcity.com/ - бесплатный софт, вэб-сервисы, ресурсы для раскрутки, свежие номера журнала "Internet Zone".

 IZONE 


Создание WAP страницы

Галичев Антон
galanttt@mail.ru 

WAP, или Wireless Application Protocol, это протокол, который позволяет вам пользоваться интернетом с помощью мобильного телефона, несмотря на его ограниченные возможности. Нет, а вы представьте, что бы было, если бы вам пришлось на крохотном экранчике целый здоровый HTML-документище со всей его графикой загружать? Пусть даже и в минимальном разрешении и черно-белом исполнении - но позвонить вы бы точно с телефона уже не смогли. Разве что приползли бы в сервисный центр и умоляли, чтобы вам это безобразие немедля вытащили, а взамен дали что-нибудь маленькое и приятное. Вот для того, собственно, чтобы владельцам мобильных телефонов не было слишком скучно в отрыве от производства и любимой Сети, WAP и предназначен.

Язык WAP-страниц

То, что вы хотели бы выставить на всеобщее интернет-обозрение, как известно, принято сначала форматировать. Ну, про цвет, размер и порядок разбрасывания всяческих объектов по всей плоскости экрана мы говорить не будем - в конце концов, все мы в чем-то веб-дизайнеры, и прекрасно справляемся с этим нехитрым занятием без чужих, а потому неприятных советов. Перейдем прямиком к главному - то есть к языку веб-программирования, которым мы потом свою дизайнерскую задумку излагаем в понятном для броузера виде. Что такое HTML и зачем им пользуются, сейчас, наверное, знает подавляющее большинство людей - конечно же, это язык для создания веб-страничек. А вот код веб-страниц, создаваемых для просмотра в "интернет-мобильниках", пишется на языке WML, который только частично напоминает HTML, и отчасти - XML.

Язык WML имеет два базовых понятия, которые отличают его от всех остальных языков. Это карты (card) и колоды (deck). Откуда взялись эти отличия? Как известно, экран нашего телефона - не бездонная бочка, и много символов он все равно вместить не сможет. Чтобы не ждать, пока первая страница прогрузится, а затем будет запрошена вторая, которая снова прогрузится, и так далее, разработчики привыкли объединять несколько страничек в одну "карту", и загружать ее сразу целиком. Иными словами, каждая из таких "подстраничек" называется картой, а совокупность карт, загружаемых за один раз - колодой. В принципе, это и все, что касается базовых знаний разработчика WAP-страниц, поэтому перейдем к более подробному описанию самого языка WML.

Все WML-документы, естественно, имеют расширение .wml и начинаются с трех стандартных строк: номер версии XML, идентификатор SGML-описания языка WML и веб-адрес DTD-определения WML-документа. Эти три строки -необходимый минимум, с написания которого должна начинаться каждая WML-страница.

Весь код странички должен располагаться между тегами <wml> и </wml>. Теги в WML, также как и в HTML, делятся на открывающие, закрывающие и одиночные. Действие открывающего тега распространяется на весь документ до тех пор, пока не встретится закрывающий. А одиночные теги - они гуляют сами по себе и действуют непосредственно на текст, расположенный сразу после них.

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

Перед тем, как начать творить, запомните, что WML чувствителен к регистру букв, поэтому при написании тегов желательно использовать нижний регистр. Еще одной особенностью WML является то, что последовательности символов пробела, табуляции и перевода строки в нем всегда преобразуются в один пробел. Впрочем, это и понятно - такую страницу намного легче читать и редактировать.

Есть на пути написания текста и еще один "подводный камень". Вы ведь не забыли о том, что не все сотовые телефоны поддерживают русскую кодировку? Именно поэтому желательно дублировать свой ресурс еще и в транслите (для тех, кто не может вспомнить, что это такое, напоминаем - это когда русские слова записываются английскими буквами :).

Теперь перейдем к форматирующим текст тегам и обнаружим здесь много хорошо забытого старого, то бишь основные теги языка HTML.

Каждый абзац в тексте должен начинаться с тега <p>. Для того, чтобы выровнять текст по центру, вам нужно вписать в этот тег параметр align и определить его значение - в данном случае, это center. Соответственно, вы получите строку вида <p align="center">. Догадайтесь с трех раз, как выровнять текст по левому и по правому краю, соответственно? Правильно, по левому краю задействуем <p align="left">, а по правому краю - <p align="right">. Чтобы вставить изображение, используем тег, который выглядит так: <img src="..." alt="..."/>. Вместо "..." в первом случае должен стоять путь к картинке, а во втором так называемый альтернативный текст.

Вы вполне могли забывать об этом параметре при создании веб-странички средствами языка HTML - в конце концов, не увидят ваши посетители вместо замечательной картинки надпись "Это замечательная картинка", ну да и бог с ними.

В мире же "карманного интернета" графика все еще остается чуждым элементом, поэтому не ленитесь вписывать в соответствующий параметр alt="..." альтернативные имена для картинок. Иначе посетитель, вместо того чтобы сразу кликать на нарисованную лично вами кнопку "Навигация", попросту ее не найдет. После того, как вы занесли в карту все, что хотели, поставьте туда тег <br/>, который принудительно "снесет" текст на следующую строку (эквивалентно нажатию кнопки Enter в текстовом документе). Затем можно приступать к созданию гиперссылки. Она состоит из открывающего тега <a href="..."> и закрывающего тега </a>. Все, что находится между ними, будет являться гиперссылкой. Открывающим тегом <a href="#card01> задайте гиперссылку на карту с идентификатором "card01". Следом пойдет уже известный нам тег <br/>, потом закрывающий тег абзаца </p> - и вот, описание карты №1 закончено.

Карта №2 формируется точно так же, поэтому подробно останавливаться на ее описании нет смысла. Отметим единственное различие: первая гиперссылка в этой карте №2 должна вести не на карту №3, как вы, должно быть, подумали, а на документ с именем info.wml, расположенный на том же сервере, но в подкаталоге info. В нем весь расклад этих карт в колоде и прописан.

Вставка изображений

Чтобы вставить картинку в WAP-страницу, вам потребуется запомнить только одно: никаких больше графических изысков. Почему? Да потому, что единственный поддерживаемый здесь формат называется WBMP (Wireless BMP). Он представляет собой обычное двухцветное изображение с особым алгоритмом компрессии.

Существует много способов преобразовать изображение в формат WBMP. Например, это можно сделать на страничке www.teraflops.com/wbmp, где расположен онлайн-преобразователь нежно любимых нами файлов в формате GIF и JPEG. Лучше всего, конечно, использовать маленькие и контрастные изображения - потому что, сами понимаете, дисплей мобильника - это вам не 17" монитор, и плавные переходы между цветами он делать не обязан.

Сам тег <img src> имеет несколько параметров, основные из которых: alt, localsrc, align, height и width. Так, одиночный тег <img src="picture.wbmp" height="10" width="15"/> выведет на экран изображение "picture.wbmp" высотой 10 пикселей и шириной 15 пикселей. Параметр localsrc="..." - особая фича WML, которая умеет показывать в нужном месте встроенные пиктограммы броузера. Подробная таблица таких пиктограмм и их имен доступна в документации к каждому броузеру. Но не забывайте и здесь о параметре alt, так как далеко не все сотовые телефоны поддерживают эту хитрую графику.

Но создание страницы отнюдь не заканчивается на написании кода на языке WML, его проверке и отладке. Для того, чтобы другие пользователи могли увидеть вашу страничку, вам необходимо будет закачать ее на сервер, который предоставляет WAP-хостинг. К счастью, существует несколько бесплатных серверов, которые позволят вам сделать это совершенно бесплатно. Так, например, по адресу http://www.wapspy.com/ расположен сервис, который не только великодушно поделится местом на своем сервере, но и предоставит в ваше распоряжение коллекцию из WBMP-картинок. Аналогичные сервера доступны также по адресам: tagtag.com/site/index.php3, wappy.to, http://www.wapdrive.com/. Причем последний поддерживает закачку по ftp, для большей оперативности и удобства.

Итак, напомним основные моменты, о которых не следует забывать при создании WAP-страницы. Это использование в начале каждой колоды трехстрокового описания, использование нижнего регистра в названиях карт и тегов, обязательное написание текста как минимум в двух кодировках (русской и транслите), использование тега alt при вставке изображений и обязательное тестирование созданной страницы на экране сотового телефона. Также необходимо отметить, что разные модели сотовых телефонов имеют свой собственный максимальный размер загружаемой колоды. Вот эти цифры: Nokia 7110 - около 1500 байт, Ericsson MC218 - более 8000 байт, Ericsson R380 - около 3500 байт, UP.Browser 4.x - 2048 байта, UP.Browser 3.2 - 1492 байта.

Программы для создания WAP-страниц

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

На мой взгляд, самый удобный редактор - это EasyPad Waptor. Основной приятной особенностью является встроенная возможность просмотра сваянного вами WAP-документа в эмуляторе (то есть, вы сможете хотя бы примерно увидеть ту красоту, на которую и будет любоваться ваш посетитель на экране своего мобильника). Гиперссылки, таблицы, кнопки и изображения здесь вставляются в документ одним щелчком мыши. Одновременно можно работать с несколькими документами, в каждом из которых организован функциональный переход между несколькими картами. Удобная система поиска и замены не оставит равнодушными любителей глобальных изменений в редактируемом тексте, а встроенный пример простейшей страницы наверняка поможет тем, кто делает на WAP-поприще первые шаги.

Инсталляционная версия редактора занимает всего 169 кб, поэтому его можно порекомендовать тем, кто хочет получить небольшую программу, помогающую в использовании WML-тегов и обладающую возможностью эмуляции экрана броузера.

Следующая программа называется DotWAP 2.0 и, по приведенной выше классификации, относится к редакторам первого типа. Скачать ее можно по адресу: download.inetis.com/files/DotWAP2.EXE (размер программы - 701 кб).

DotWAP вообще не предусматривает знания вами языка WML. Вы не то что не увидите ни одного тега - вы даже вручную его набить не сможете! Окна для внесения кода здесь просто нет, а есть полный список названий колод, карт и других элементов страницы. В общем, вы сразу научитесь этим пользоваться - структура похожа на обычный "виндовый" Проводник. Любой введенный текст вы сможете легко сделать жирным, подчеркнуть или поменять его выравнивание. Программа также позволяет вставлять в текст изображения из форматов GIF, JPG, BMP и WBMP. Причем картинки "чуждых" форматов легко конвертируются в "родной" WBMP непосредственно перед вставкой их в текст.

Правда, есть и одно "но": DotWAP 2 не позволит вам открыть уже существующие WML-документы, но зато с легкостью сохранит страницы в этом формате и отправит их на сервер tagtag, который предоставляет бесплатный хостинг WAP-проектам. Еще одним недочетом данной программы можно назвать практически полное отсутствие документации, ну или хотя бы файла помощи. Хотя разобраться с ней достаточно просто и без этого.

Следующая программа для создания и редактирования WAP-страниц называется CardONE. Она выпускается в двух вариантах: так называемом "облегченном" (Light) и профессиональном (Pro). Если надумаете ею пользоваться, рекомендую брать именно CardONE Pro, так как в облегченной версии многие функции доступны только в демо-режиме.

Архив с программой занимает 1,2 Мб, поэтому тем, у кого соединение с интернетом недостаточно стабильное, стоит, наверное, сначала попробовать что-то менее требовательное к скорости вашего модема.

Основной особенностью данной программы можно назвать очень удобную систему вставки таблиц и выпадающих списков. Если в других редакторах вам пришлось бы создать необходимое количество тегов и вручную заполнять их значениями, то здесь визуальный интерфейс позволяет увидеть нужные вам строки и столбцы таблицы, и задавать их значения прямо там. Особенно хотелось бы отметить Card Manager Казалось бы, ничего особенного, но это небольшое окошечко легко позволит вам добавить новую карту, удалить существующую или переименовать вообще любую карту проекта. Вы можете сохранять страницы в формате WML, а также подключать внешний WAP-броузер для просмотра ваших творений.

WML Edit v1.30 написана на Visual Basic, и именно в связи с этим "весит" 2,16 Мб. Эту программу можно назвать Блокнотом в мире WML как по возможностям, так и по потребляемым ресурсам. Из меню можно выбирать тип тега, который вы хотите вставить. Гиперссылки или изображения вставляются просто как теги, в которые надо вписывать значения. Чуть получше обстоит дело с выпадающими списками, так как в этом случае у вас сначала спрашивают количество элементов, а затем просят ввести текст каждого элемента в окошечке. По окончании этого генерируются соответствующие WML-теги, которые и вставляются в документ. Доступное оформление текста (жирный, курсив, подчеркивание), к сожалению, не может быть применено к уже имеющемуся тексту. Поэтому каждый раз придется вводить текст между тегами самому. В общем, данная программа может помочь только тем, кто считает себя достаточно опытным WML-писателем и ищет просто более удобную, чем текстовый редактор, утилиту.

WML Writer. Относительно небольшой размер этой программы (925 кб) таит в себе массу возможностей, а одной из самой приятных является подсветка текста. Это позволяет отделить пользовательский текст от команд и тегов языка, и более комфортно программировать. Большое количество тегов, которые можно вставлять в текст страницы, простые и наглядные методы создания самих страниц и выпадающих списков, возможность следить за максимальным размером создаваемой колоды, режим просмотра и последующей печати исходного кода, приятный графический интерфейс - все это позволяет назвать эту программу лучшей из рассматриваемых, по крайней мере, среди программ второго класса.

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

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

Источник: http://upgrade.computery.ru/upgrade/

 


Copyright © "Internet Zone"info@izcity.com
Копирование и использование данных материалов разрешается только в случае указания на журнал "Internet Zone", как на источник получения информации. При этом во всех ссылках обязательно явное указание адреса вэб-сайта http://www.izcity.com/. При наличии у копируемого материала авторов и источника информации - их также нужно указывать, наряду со ссылкой на нас.