Четверг, 2025-01-23, 1:03 AM
Статьи - Web дизайн
Приветствую Вас Гость | RSS
Главная страница Каталог статей Регистрация Вход
Меню сайта

Категории каталога
Web дизайн [104]
Статьи по Web дизайну

Наш опрос
Выбираем ОС
Всего ответов: 192

Начало » Статьи » Web дизайн » Web дизайн

Создание wap-страниц (в формате *.wml)
В этой статье мне бы хотелось поделиться своим опытом создания wap-страниц и вообще wap-сайта.
Для того, чтобы сайт можно было просматривать в мобильном браузере не всегда подойдет формат *.html, ведь совсем малая часть мобильные телефонов его отображает. Но все равно знаний языка html вам хватит. Поддерживаемый формат мобильными браузерами – это *.wml . Я его опробовал и могу сказать, что он даже легче чем сам html. Может это потому что здесь никакие скрипты и специальные возможности не поддерживаются.
Я постараюсь объяснить вам все на простом примере создания wap-страницы в формате *.wml . Итак, начнем:

Во-первых, надо сказать что стандартный браузер internet explorer формат wml не поддерживает и не может отобразить wap-страницу, поэтому для того, чтобы работать с такими страницами рекомендую приобрести, например, браузер opera. Здесь можно будет предпросматривать страницу. Также необходим текстовый html-редактор страниц – именно текстовый, потому что не получится создать страницу на визуальном редакторе. Сам я использую для создания wap-страниц программу microsoft office frontpage. Тут можно и кодом писать, и визуальным ректором попробовать (в случае с прописанием начального кода вручную визуальный редактор подойдет). Вы можете найти программу подходящую именно вам.

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

<?xml version="1.0" encoding="utf-8"?>
<!doctype wml public "-//wapforum//dtd wml 1.2//en" "http://www.wapforum.org/dtd/wml12.dtd">

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

Как и в html основной код страницы обозначен тегом <html> и </html>, ак и здесь обозначаем основной код страницы <wml> и </wml>.

<wml> </wml>

Конечно открытие и закрытие этого тега соответственно должно быть в начале и в конце кода страницы (вначале то есть после кодов для кодировок).

В теге head, который здесь также присутствует, пишем:

<head><meta http-equiv="cache-control" content="no-cache" forua="true"/></head>

Чем-то вроде тега body в *.wml является тег card. Именно в этом теге пишется содержание страницы. Итак, вот как выглядит код для card:

<card id="index" title="Первая wap-страница">
</card>

Здесь в поле «id» пишется название страницы, а в «index» пишется ее заголовок. Между первой и второй строчкой кода выше конечно пишется код содержания страницы.

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

Пишем:

<p align="center">

Это чтобы все содержимое было по центру, по-другому нельзя, потому что не так отобразится на экране мобильных телефонов. После, в конце закроем тег «p».

Для того, чтобы написать простой текст, просто пишем его на отдельной строчке и в конце ставим «<br/>». Причем этот тег нигде не начинается, он просто говорит о конце строчки и пишется во всех строчках в отображении. Например, напишем:

wap-страница<br/>

Написав это, получим сточку со словами «wap-страница» посередине.

Теперь поставим ссылку, самую простую ссылку. Это можно сделать кодом:

<a href="http://wap.site.ru/index.wml">Главная </a><br/>

Здесь думаю все понятно. Заметьте и в этой строчке поставлен тег «<br/>, потому что его ставят в каждой строчке, только не строчке кода, а строчке самой страницы.

Думаю, с текстом и ссылками разобрались, теперь скажу о картинках. Поставить картинку можно кодом:

<img src="logohallo.gif" alt="wap.site.ru"/><br/>

Здесь тоже наверно все понятно. Картинку вы можете своб поставить, для этого напишете вместо «logohallo.gif» ссылку на свою картинку. Обратите внимание, тег <alt> обязателен.

Все что осталось узнать, это тег, который выдает содержимое через строчку. Как и в html здесь это тег «p». То есть для выделения текста через строчку необходимо ввести его код между:

<p> </p>

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

Но все же необходимо посмотреть, что получится из всего этого, из того, что мы сейчас делали, итак, вот код, который у нас получился:

<?xml version="1.0" encoding="utf-8"?>
<!doctype wml public "-//wapforum//dtd wml 1.2//en" "http://www.wapforum.org/dtd/wml12.dtd">
<wml>
<card id="index" title="Первая wap-страница">
<p align="center">
wap-страница<br/>
<a href="http://wap.site.ru/index.wml">Главная </a><br/>
<img src="logohallo.gif" alt="wap.site.ru"/><br/>
</p>
</card>
</wml>

Если вы решите просмотреть страницу в браузере, то не разберете ничего из слов. Все русские буквы будут в виде вопросительных знаков. Поэтому тут работа еще не заканчивается, осталась самая важная часть – перевод кода в формат wml. Для этого существуют такие программы, которые переводят этот код, а именно его русские буквы на нужный формат. Их совсем мало и трудно найти, поэтому специально для вас, я разместил один простейший такой «переводчик» и вы можете скачать его здесь. Распакуйте оба файла в одну папку и запустите приложение. Тут для вас откроет окошко с двумя полями. В первое мы вводим наш код и тут же в соседнем поле появляется новый вариант этого же кода, тот что нам и нужен. Итак, получится:

<?xml version="1.0" encoding="utf-8"?>
<!doctype wml public "-//wapforum//dtd wml 1.2//en" "http://www.wapforum.org/dtd/wml12.dtd">
<wml>
<card id="index" title="Первая wap-страница">
<p align="center">
wap-страница<br/>
<a href="http://wap.site.ru/index.wml">Главная </a><br/>
<img src="logohallo.gif" alt="wap.site.ru"/><br/>
</p>
</card>
</wml>

Теперь все русские буквы будут правильно отображаться.

Категория: Web дизайн | Добавил: webmaster (2006-12-04)
Просмотров: 375 | Рейтинг: 0.0 |

Всего комментариев: 0
Имя *:
Email *:
Код *:
Форма входа

Сервисы

Поиск по каталогу

Друзья сайта

| Ссылки 1 | Ссылки 2 | Ссылки 3 |
www.webmaster.clan.su Каталог+поисковая система be number one Bakililar.az Top Sites Сервис авто регистрации в
каталогах, статьи про раскрутку сайтов, web дизайн, flash, 
photoshop, хостинг, рассылки; форум, баннерная сеть, каталог 
сайтов, услуги продвижения и рекламы сайтов Скрипт для определения тиц (Яндекс CY: индекс цитирования). Определение pr (Google Pagerank). Проверить тиц pr сайта.
Copyright WebMaster.Clan © 2006 Бесплатный хостинг uCoz