О
П
Р
О
С



WAP

WAP — (англ. Wireless Application Protocol — протокол беспроводного доступа) — это средство получения доступа к ресурсам интернет посредством только мобильного телефона, не прибегая к помощи компьютера и/или модема. По сути это технический стандарт, описывающий способ, с помощью которого информация из интернет передается на дисплей мобильного телефона.

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

Как создать WAP сайт. Руслан Богданов

WAP Как создать WAP сайт. Руслан Богданов
Язык:Русский
Формат:
Обновлено:2008-10-31
Автор:





Как создать WAP сайт. Руслан Богданов

Вам приходилось когда-нибудь заходить в Интернет через сотовый телефон?

Как создать WAP сайт. Руслан Богданов

Если да, то Вам наверное приходилось видеть так называемые WAP сайты. Другими словами — сайты для сотовых телефонов.

Это очень простые HTML-странички, содержащие немного текста, ссылок и картинок.

Хотите заиметь такую же?

Оказывается, это совсем не сложно, если:

  1. У Вас уже есть свой веб-сайт;
  2. Хостинг, на котором расположен сайт, поддерживает WAP-протокол (это должно быть указано в описании услуг хостинга).

Если Вы уже счастливый обладатель такого сайта, то Вам не составит труда добавить на него WAP-раздел.

Самый простой способ сделать WAP-раздел, это установить готовый магазин. Или даже несколько магазинов. Например, это может быть магазин сотовых и аксессуаров от diamondelectric.ru или же магазин мобильного контента (мелодий, картинок и игрушек) от b2m.ru.

Но в любом случае, Вам понадобится главная WAP-страничка, ссылки с которой будут вести на разные разделы Ваших магазинов. К ней же можно будет привязать подходящий поддомен (дочерний домен) Вашего сайта. Например, у моего сайта bestfree.ru поддомен называется wap.bestfree.ru

Поддомен нужен, чтобы посетителям было легче набирать адрес Вашего сайта в своих сотовых телефонах. Согласитесь, гораздо проще набрать и запомнить адрес http://wap.ваш_сайт.ru, чем http://www.ваш_сайт.ru/index.wml. Хотя по сути, они ведут на одну и ту же страницу index.wml.

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

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

Цель этой статьи — создать главную страничку Вашего WAP-сайта, с которой уже можно будет дать ссылки на любые разделы любых магазинов.

Вот как выглядит эта страничка на моём сайте:


<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card id="main" title="wap.BestFREE.ru">
<p align="center">

РАЗВЛЕЧЕНИЯ:<br/>
<a href="http://wap.dating.playfon.ru/?t=2&d=79814293">WAP-знакомства</a><br/>
<br/>

ПАРТНЁРСТВО:<br/>
<a href="http://wap.b2m.ru/register.php?t=2&d=79814293">Заpаботай</a><br/>
<br/>

ПРИОБРЕСТИ:<br/>
<a href="http://wapt5v.playfon.ru/?t=2&d=79814293">Реалтоны</a><br/>
<a href="http://wapm5v.playfon.ru/?t=2&d=79814293">Полифония</a><br/>
<a href="http://wapft5v.playfon.ru/?t=2&d=79814293">Полные MP3</a><br/>
<a href="http://wap.playfon.ru/p/prog.wml?t=2&d=79814293">Пpогpаммы</a><br/>
<br/>

ЗАКАЗАТЬ:<br/>
<a href="http://wappart.diamondelectric.ru/wap_2.1/types_list.php?deu=4387&amp;categ=23">Телефоны</a><br/>
<a href="http://wappart.diamondelectric.ru/wap_2.1/types_list.php?deu=4387&amp;categ=16">Коммуникатоpы</a><br/>
<a href="http://wap.BestFREE.ru/zarjadka.php">Заpядки</a><br/>
<a href="http://wappart.diamondelectric.ru/wap_2.1/types_list.php?deu=4387&amp;categ=19">Чехлы для тел/КПК</a><br/>
<a href="http://wappart.diamondelectric.ru/wap_2.1/types_list.php?deu=4387&amp;categ=32">Коpпуса для тел/КПК</a><br/>
<a href="http://wappart.diamondelectric.ru/wap_2.1/types_list.php?deu=4387&amp;categ=33">Клавиатуpы для тел/КПК</a><br/>

</p></card></wml>


Как создать WAP сайт. Руслан Богданов

Согласитесь, очень напоминает обычную HTML-страницу.

Всё, что Вам нужно сделать, это скопировать этот код в обычный текстовый файл и заменить мои ссылки и текст на Ваши. Затем просто преобразовать полученный файл в кодировку UTF-8 и загрузить на хостинг.

Давайте рассмотрим всё по порядку:

1. Скопируйте весь вышеприведённый код в простой текстовый редактор (например, в блокнот).

2. Всё, что выше вот этой строчки:

<card id="main" title="wap.BestFREE.ru">

трогать не нужно. Это информация о протоколе.

В самой строчке замените wap.BestFREE.ru на текст, который Вы бы хотели видеть в заголовке WAP-странички. На рисунке справа этот заголовок показан инвертированным цветом — белый текст на чёрном фоне.

Набор ссылок на рисунке немного не соответствует ссылкам в коде. Не обращайте внимания, я просто убрал самые длинные ссылки, чтобы код был понятнее.

3. В строчке

<p align="center">

как Вы верно уже догадались, указано выравнивание текста, ограниченного тегами <p align="center"> и </p>.

Если выравнивание по центру Вам нравится — можете не менять.

Если хотите прижать к левому краю, замените 'center' на 'left', если же к правому — на 'right'.

Тег <br/> создаёт перенос строки, как и аналогичный тег <br> в языке HTML.

4. Осталось только поменять тексты и адреса ссылок в строчках вроде этой:

<a href="http://wapt5v.playfon.ru/?t=2&d=79814293">Реалтоны</a>

Но здесь есть два нюанса:

а) Некоторые скрипты магазинов не заменяют автоматически значок & (амперсанд) на &amp; , как того требует синтаксис языка WML. В результате браузер выдаёт ошибку.

В таком случае нужно вручную заменить & на &amp; в ошибочных ссылках.

В качестве примера скажу, что в ссылках на разделы магазина diamondelectric.ru приходится заменять амперсанд, а в ссылках на b2m.ru — они работают и так.

б) При переводе в кодировку UTF-8, загадочным образом кракозябрится русская буква "р" (эр) маленькая. Пока я не придумал ничего лучше, чем заменять её на английскую "p" (пи) маленькую.

5. В этом примере не показано, как вставлять изображения на WAP-страницу. Поскольку пока ещё не все телефоны понимают форматы GIF и JPEG, то чтобы добавить изображение, Вам понадобиться специальный конвертер для подготовки картинок в формате WBMP. Ссылка на один из таких конвертеров есть в конце этой статьи.

Если Вам всё же хочется добавить хоть одну картинку, вставьте туда, где хотите её видеть, вот этот тег:

<img src="picture.wbmp" alt="описание картинки" />

Затем измените адрес src="picture.wbmp" и описание картинки.

6. Теперь сохраните этот файл с именем, которое будет отличаться от index. Например я сохранил под именем index-test. Это нужно для того, чтобы у Вас был исходный файл в кодировке Windows-1251, на случай, если Вы в дальнейшем решите внести изменения в него. Уверен, что он не раз Вам пригодится.

7. Итак, исходный файл у нас готов, нужно перевести его в кодировку UTF-8. Где-то в Рунете есть специальные программы-переводчики, но мне пока не удалось заставить работать те из них, которые смог найти.

Пришлось придумать обходной путь. Есть хороший бесплатный текстовый редактор TigerPad.

Чтобы преобразовать текст в кодировку UTF-8, я копирую его в редактор TigerPad и выбираю в командном меню Кодировки / Другие / Перевести из Win в UTF-8 кодировку.

Если все русские буквы кракозябрятся, значит всё в порядке. Результат сохраняем в файл index.wml.

8. Теперь загрузите эту страницу на сервер, в папку с Вашим сайтом. Наберите в адресной строке браузера путь к файлу (например: http://www.ваш_сайт.ru/index.wml).

К сожалению, браузер Internet Explorer версий 6 и ниже не умеет отображать WAP-страницы. Поэтому Вам понадобиться браузер Opera или Mozilla Firefox. Или же можно попробовать набрать путь к файлу index.wml в сотовом телефоне, поддерживающем протокол WAP.

Если страница открывается — всё в порядке, можно устанавливать магазины и создавать поддомен.

Если же не открывается, видимо в код закралась ошибка. В отличие от обычного HTML, язык WML не прощает ошибок. То есть пока браузер не увидит правильный код, он будет показывать сообщение об ошибке.

В таком случае внимательно сверьте код Вашей странички с моим кодом. Возможно, проблему создаёт амперсанд (об этом рассказано в п.4.а этой статьи), или же Вы удалили какой-то необходимый символ, например закрывающий слеш "/" в тегах <br/> или <img src="picture.wbmp" alt="picture" />.

По правилам WML все теги должны быть закрыты этим слешем. Поэтому если тег не парный (как в случае <p align='center"> и </p>), то слеш ставится перед закрывающей скобкой.

Теперь у Вас точно всё должно получиться.

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

И напоследок — обещанная ссылка на конвертер изображений DotWAP. Вот она:

http://www.bestfree.ru/soft/inet/wapeditor.php

На самом деле, это не просто конвертер, а настоящий редактор, позволяющий создавать WAP-странички, даже не заглядывая в код. Вы можете воспользоваться им и вообще не использовать код, который я привёл в этой статье.

Но мне всё-таки хотелось бы, чтобы прочитав эту статью, Вы могли "ручками" создать свой WAP-сайт. Ведь это действительно совсем не сложно, правда? :)

P.S. Разрешается свободно копировать и цитировать данную статью при условии указания открытой активной ссылки на источник и сохранения авторства Руслана Богданова.

P.P.S. Если Вас заинтересовала эта статья, возможно, Вам будет интересно узнать, как легко установить RSS-канал новостей на Ваш сайт. Вот ссылка на статью:
http://www.bestfree.ru/article/webdesign/rss.php



Получать обновления:







Комментарии


Данную страницу еще никто не комментировал...


1 Все комментарии проверяются. Спам и некультурные высказывания будут удалены.
2 Задавать вопросы лучше на нашем форуме. Просто зарегистрируйтесь и создайте новую тему.

captcha
Обновить
Идёт загрузка...
* Поля, обязательные для заполнения

Наша рассылка:


Полезный совет:


  
Мы в Google+

Система проверки ошибок от Mistakes.ru