Рефераты. Разработка web сайта на основе HTML с использованием JavaScript

Схема цепочки со справочным разделом выглядит так:

Возможны различные варианты организации справочного раздела:

·         Раздел состоит из нескольких независимых документов.

·         Некоторые документы раздела имеют ссылки друг на друга или даже образуют цепочку.

·         Справочный раздел состоит из одного документа с метками, на которые настроены ссылки в документах цепочки.

·         Каждый документ в цепочке имеет свой собственный справочный раздел, и эти разные разделы могут содержать ссылки друг на друга.

Применение цепочек

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

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

Иерархия

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

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

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

Иерархическую структуру книги хорошо отражает оглавление (содержание). В правильно оформленных книгах оглавление помещают на первых страницах.

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

Оглавление оказывается полезным, даже если книга предназначена для последовательного чтения.

Оглавление:

·         дает представление о книге в целом;

·         позволяет быстро открыть нужный раздел для продолжения чтения;

·         помогает найти отдельные, полюбившиеся фрагменты.

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

Схему иерархического приложения можно изобразить следующим образом:

Документ 00.htm (корень иерархии) содержит ссылки на разделы 01.htm, 02.htm, 03.htm, ..., nn.htm (ветви иерархии). Эти разделы, в свою очередь, содержат ссылки на подчиненные документы и так далее, вплоть до таких документов как 030101.htm и 030102.htm: они уже не имеют ссылок (листья иерархии).

Пример гипертекстовой иерархии

Схема этого примера выглядит следующим образом:

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

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

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

Модифицированный иерархический справочник

В модифицированном справочнике на основной странице сформирован еще и гипертекстовый алфавитный указатель тегов. Это дополнение показывает заботу разработчика о пользователе.

Уложим картинку в фоновый паркет

Теперь, после "высоких" сфер, одна приятная (но и опасная для новичков!) техническая подробность.

Пользуясь атрибутом bgcolor команды BODY, можно выкрасить фон документа в какой-нибудь один цвет.

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

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

Фоновая картинка задается в команде BODY атрибутом background:

<BODY background=имя файла с картинкой>

Примеры

1.       

Этот фон задается командой:

<BODY background=./pic/fon1.jpg>

Посмотреть на полном экране

Картинка, которая используется как фоновая плиточка:

2.       

3.       

Этот фон задается командой:

<BODY background=./pic/fon2.jpg>

Посмотреть на полном экране

Картинка, которая используется как фоновая плиточка:

4.       

5.       

Этот фон задается командой:

<BODY background=./pic/fon3.jpg>

Посмотреть на полном экране

Картинка, которая используется как фоновая плиточка:

6.       

7.       

Этот фон задается командой:

<BODY background=./pic/fon4.gif>

Посмотреть на полном экране

Картинка, которая используется как фоновая плиточка:

8.       

Антипримеры

1.       

Этот фон задается командой:

<BODY background=./pic/bfon1.jpg>

Посмотреть на полном экране

Плохая стыковка плиточек.

Картинка, которая используется как фоновая плиточка:

2.       

3.       

Этот фон задается командой:

<BODY background=./pic/bfon2.gif>

Посмотреть на полном экране

Очень плохая стыковка плиточек.

Картинка, которая используется как фоновая плиточка:

4.       

5.       

Этот фон задается командой:

<BODY background=./pic/bfon3.jpg>

Посмотреть на полном экране

Берегите глаза!

Картинка, которая используется как фоновая плиточка:

6.       

7.       

Этот фон задается командой:

<BODY background=./pic/bfon4.jpg>

Посмотреть на полном экране

Берегите глаза!

Картинка, которая используется как фоновая плиточка:

8.       

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

Графика

 

Иллюстрации в тексте радуют глаз и делают документ более привлекательным. Пора и нам записать в свой актив вывод картинок средствами HTML.

Браузеры "понимают" два графических формата GIF и JPG.


Формат GIF

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

GIF-формат имеет три приятные дополнительные возможности:

·                      Мультипликация. Используя анимационный GIF-редактор, легко собрать простой мультик: нарисовать отдельные кадры, настроить время задержки в последовательности показа, "зациклить кино" или показывать кадры только один раз. Когда анимация готова, она записывается на диск как обычный GIF-файл. Хотя в этом файле не одна, а целая серия GIF-картинок и разная настроечная информация.

Страницы: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18



2012 © Все права защищены
При использовании материалов активная ссылка на источник обязательна.