Назначение, функции и архитектура сервиса WWW

19.1. Основные определения и понятия

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

Совокупность веб-страниц, объединенных единой темой и организованных для совместной работы, образует веб-сайт, или веб-представительство, или просто Web.

Каждая веб-страница хранится в файле, имя которого имеет расширение htm (для MS DOS и Windows-платформ) или html (для Unix-платформ). По этому расширению находят веб-страницы программы-клиенты сервиса WWW – браузеры (просмотрщики веб-страниц), причем, браузеры понимают оба эти расширения.

Веб-страницы делятся на два вида: пассивные и активные. Пассивные веб-страницы содержат только информационное наполнение (текст, графику). Для хранения в ЭВМ графика оформляется в виде отдельных файлов (в основном – в формате GIF, JPEG или PNG). Сама же вебстраница (т. е. файл с расширением htm) содержит только размеченный текст.

Активные веб-страницы кроме информационного наполнения содержат программы, с помощью которых принимается информация от посетителей (интерактивная веб-страница), осуществляется связь с СУБД (динамически обновляемая веб-страница), выводится на экран в пространстве веб-страницы баннерная реклама (веб-страница с баннерами), реализуются некоторые спецэффекты, например, использующие скроллинг, и др.

Веб-сайт кроме информационных страниц обязательно содержит корневую страницу – home page (или "домашнюю страницу"). Она имеет в Интернете стандартное имя – index.html или index.htm .

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

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

Разметка заключается в форматировании текста – определении его места на странице и способа отображения, в указании, в какое место страницы должна быть вставлена графика, как она соотносится с текстом (вставляется на свободное место, является фоном, на который наносится текст, "обтекается" текстом, и т. д.), и вставке гиперссылок, осуществляющих переход на другие веб-страницы или на используемые программы. Для разметки используется язык HTML.

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

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

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

19.2. Навигационная структура сайта

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

Навигационная структура сайта может иметь следующие конфигурации:

1. Самая простая из них – линейная (рис.19.1).

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

2. Линейная реверсивная (рис.19.2)

Эта структура допускает движение в две стороны: к следующей странице и к предыдущей.

3. Кольцевая (рис.19.3)

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

4. Иерархическая (рис.19.4)

Иерархическая структура встречается в двух вариантах: просто иерархическая (в которой, например, можно перейти с первой страницы на третью или с третьей на первую, т. е. она позволяет реверс) и иерархическая тупиковая, в которой возврат (реверс) не предусмотрен. Такие сайты, к сожалению, тоже встречаются. При этом делается расчет на то, что вернуться назад можно с помощью соответствующей кнопки браузера. Нужно только учитывать, что многие посетители сайта могут просто не знать о существовании такой кнопки в браузере.

5. Иерархическая тупиковая (рис.19.5)

6. Звездообразная (рис.19.6)

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

7. Матричная (рис.19.7)

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

8. Полносвязная (рис.19.8)

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

Данная конфигурация может иметь вид меню, которое выполнено в виде отдельного фрейма, постоянно присутствующего на экране.

Каждый сайт кроме навигационной структуры может характеризоваться информационной (или файловой) структурой и пользовательской картой сайта.

19.3. Информационная структура сайта

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

Пример информационной структуры сайта изображен на рис.19.9.

19.4. Пользовательская карта сайта

Пользовательская карта сайта показывает существенный для пользователя состав информации – т. е. тематические разделы сайта и их взаимное расположение.

Пример пользовательской карты сайта приведен на рис.19.10.

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

19.5. Конструктивные элементы веб-страницы

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

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

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

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

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

Размеры фреймов устанавливаются так, чтобы общий вид экрана был привлекательным. Информация во фреймах размещается браузером так, чтобы не выходить за пределы фрейма.

Фреймы можно использовать для хранения информации, имеющей различный период обновления. Одна из разновидностей часто применяемых фреймов – это содержание (пользовательская структура сайта, или пользовательская карта). Она должна быть постоянно перед глазами. Человек, вошедший на сайт, должен видеть, какую информацию он может получить с этого сайта. Для этого экран делится на два фрейма: в одном из них находится пользовательская карта сайта, во втором (связанном с первым с помощью гиперссылок) отображается информация из раздела, активированного в первом фрейме. Благодаря этому можно быстро знакомиться с информацией, хранящейся в различных разделах содержания, не убирая с экрана пользовательскую карту.

Такая система позволяет реализовать полносвязный сайт, в котором переход с одной страницы на другую осуществляется с помощью одного щелчка мышью.

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

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

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

Формы (Forms) представляют собой конструкции, позволяющие посетителям вводить информацию в веб-сайт. Они могут быть выполнены в виде заполняемых текстом полей (например, анкетный опрос), списков с вариантами ответов, переключателей (представленных отдельно или объединенных в группы), флажков (для бинарных ответов типа "да" илиб"нет"), управляющих различными действиями кнопок и т.д.

Форма позволяет посетителю отреагировать на события, происходящие на сайте. Один из способов получить информацию от посетителя – организация форума: посетитель набирает текст, который появляется на сайте и становится доступным всем посетителям.

На сайте можно поместить анкету и каждого посетителя можно попросить (или обязать) ответить на вопросы анкеты.

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

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

Наиболее часто используются следующие разновидности форм:

Создание форм может быть выполнено по имеющимся шаблонам или с помощью мастеров (например, во FrontPage с помощью мастера Form Page Wizard можно создавать нестандартные формы).

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

Часто применяются такие компоненты, как:

В число компонент входят кнопки, изменяющие свой вид на экране при наведении на них курсора или при щелчке мышью (Radio Batton). Такую кнопку можно использовать как гиперссылку или как форму – вводить нажатием на кнопку соответствующую информацию (например, при голосовании).

Поисковый компонент предоставляет посетителям возможность поиска слов и предложений в тексте страниц сайта или в сообщениях дискуссионных групп.

Динамическое оглавление содержит ссылки на каждую страницу. При добавлении, удалении и редактировании страниц оглавление обновляется автоматически.

Штемпель позволяет проставлять на странице дату и время последнего редактирования или автоматического обновления страницы.

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

Баннеры представляют собой графические анимированные вставки в веб-страницу, основное назначение которых – переключить внимания посетителя "на себя" и увести его на другую страницу.

Баннер на веб-странице обычно выполняется либо в виде отдельного фрейма, либо ячейки таблицы. Он оформляется как название гиперссылки. При попадании на него курсор меняет свою форму. Щелчок по баннеру расценивается как переход по гиперссылке.

Используются баннеры чаще всего в виде баннерной рекламы, суть которой заключается в том, что несколько владельцев сайтов договариваются о взаимном размещении баннеров на этих сайтах. Считается, что таким образом расширяется аудитория потенциальных посетителей. Возможно и "внутреннее" использование баннеров, когда на своем сайте размещается свой же баннер, рекламирующий новый (опять же – свой) товар или новую услугу и предназначенный для привлечения внимания к новым возможностям сайта.

19.6. Динамические веб-документы

Динамическая страница – это страница, содержание которой создается автоматически, "на лету". При поступлении запроса на нее сервер обращается к корпоративной базе данных или документной базе за необходимой информацией. Получив и преобразовав ее в формат HTML-документа, сервер отсылает страницу клиенту. Таким образом, в том виде, в котором ее получит клиент, веб-страница на сервере не хранится.

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

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

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

Связь эта описывается с помощью CGI-скриптов, Java-скриптов, инструментов, содержащихся в последних версиях HTML, на языках типа Perl, PHP. Некоторые пакеты (например, такие как пакет FrontPage) содержат специальные средства (мастера и шаблоны), позволяющие реализовать такие конструкции без знания этих языков.

Для создания динамических веб-документов используются активные элементы типа "формы" или "компоненты".

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

Динамической может быть не только веб-страница. Динамическим может быть и весь сайт. В этом случае структура сайта, предлагаемая посетителю, формируется после его регистрации и определения его интересов. Зачатки динамической структуры можно увидеть в электронных досках объявлений – BBS (Bulletin Board System), существовавших до разработки Интернета. При входе в BBS посетитель проходил обязательную процедуру регистрации, после чего определялись его полномочия и на экран выводился доступный ему состав разделов.

Контрольные вопросы