Часть III. Создание меню с помощью карт-изображений

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

2. С помощью графического редактора Pain создать рисунок размером 10х10 см или 300х300 точек (пикселей), состоящий из 3-х фигур (рис 7.3).

Рис. 7.3

3. Сохранить рисунок в файлах различного формата с соответствующими именами:

bmp- 24-разрядный fig_1_24.bmp,
bmp – 16-цветный fig_1_16.bmp,
jpg – под именем fig_13.jpg
и gif - под именем fig_14.gif.

Проанализировать, какой объем занимает каждый файл и какое при этом обеспечивается качество изображения. Выбрать для дальнейшей работы файл с наименьшим объемом и приемлемым качеством, переименовать его в fig_1.

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

4.1. Открыть файл fig_1 в графическом редакторе и уточнить координаты областей рисунка- последовательно выделяя предполагаемые активные зоны, прочитать в строке состояния координаты нужных точек (рис. 7.3) и записать их для дальнейшего использования.

5. Создать HTML документ – map_1.html, содержащий заголовок:

Психологические портреты

Укажите на рисунке, какая фигура Вам больше всего нравится.

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

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

6.1. Ввести теги закладок перед заголовками – названиями фигур.

6.2. Ввести теги определения карты.

6.3. Проверить работоспособность активных зон.

6.4. Обеспечить средства для возврата в начало документа.

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

Рис. 7.4

7.1. Нарисовать рисунок (подготовить фотографию), с изображением нескольких персон, например, Ваша компания или Ваша семья (рис. 7.4). Размер рисунка не должен превышать 10х10 см, объем файла - не более 15кБ. Дать название файлу company.gif и сохранить в подготовленной папке. 7.2. Определить координаты областей – активных зон для гиперссылок с помощью графического редактора.

7.3. Подготовить HTML-документы для описания каждой персоны. Разместить их в рабочей папке, дать названия persona_1.html, persona_2.html и persona_3.html. В конце каждого документа обеспечить средство возврата в главный документ.

8. Подготовить главный документ – my_company.html, который должен содержать заголовок, краткий текст о представляемой компании, рисунок и подпись. Для создания эффекта обтекания рисунка рекомендуется использовать таблицу.

9. Убедиться в правильности переходов, предъявить результат преподавателю.

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

1. Что означает понятие HTML-документ?

2. Каковы преимущества этого вида документа?

3. Что означает понятие "тэг"?

4. Какие разновидности тэгов существуют?

5. Что входит в состав объектов управления тэгами?

6. Какова структура НТМL-документа?

7. Какой вид тэга используется для вставки гиперссылки?

8. Какой вид тэга используется для создания таблицы?

9. Какой вид тэга используется для вставки графического объекта?

Дата добавления: 2015-11-14