Далее: Задание 8. Использование Java-скриптов
Вверх: Создание статического Web-сайта на
Назад: Задание 6. Оптимизация гипермедийного
- Получите разрешение преподавателя на коррекцию страниц с помощью изменения HTML-кода. Еще раз просмотрите страницы образцового оптимизированного сайта (папка “Сайт-Фильтр-Образец”). Обратите внимание на то, что все заголовки окон страниц (не путайте с заголовками самих страниц) одинаковы и совпадают с заголовком сайта — “Герменевтика”. Аналогичная картина наблюдается на вашем собственном сайте. Зададимся целью добавить в заголовки окон информацию о подзаголовках. Для этого применим “ручную” корректировку HTML-кода страниц.
- “Ручное” редактирование HTML-кода страниц относится к области продвинутого подхода при создании сайтов. Любые малейшие (в том числе случайные) необдуманные изменения кода могут привести к частичной или полной неработоспособности отдельных страниц и всего сайта. Обнаружить такие ошибки нелегко, и в большинстве случаев вместо исправления ошибок кода целесообразно заново обработать страницу в MS Word.
- В целях безопасности работайте только с дополнительной копией папки последней версии вашего сайта. Откройте начальную страницу сайта index.htm в программе Блокнот (правый щелчок по значку файла — Открыть с помощью — Блокнот. Откроется окно Блокнота с весьма объемным и сложным текстом HTML-кода страницы, состоящим из большого количества тегов.
- Найдите тег типа <title>Герменевтика </title>, где вместо слова “Герменевтика” — название вашего сайта. Аккуратно, не трогая угловых скобок, добавьте к названию сайта дефис (тире) и название подзаголовка начальной страницы. Получится тег типа <title>Герменевтика — Что такое герменевтика</title>. Закройте окно Блокнота с сохранением изменений. Откройте начальную страницу в браузере и убедитесь в том, что заголовок страницы изменился.
- Аналогичным образом добавьте названия подзаголовков в заголовки остальных страниц.
- Получите у преподавателя разрешение на оформление всплывающих надписей. Всплывающая надпись появляется при наведении курсора на картинку в окне браузера. Например, фотография человека может быть дополнена всплывающей надписью с именем и фамилией этого человека. Пронаблюдайте появление всплывающих надписей на картинках страниц оптимизированного сайта-образца.
- Решите, какое изображение (и какой страницы) вашего сайта будет дополнено всплывающей надписью. Откройте папку с файлами, обслуживающими страницу. Определите, какой файл содержит нужное изображение (например, “image003.jpg”). Откройте в Блокноте страницу сайта. Найдите тег, содержащий имя файла “image003.jpg”. Для этого воспользуйтесь функцией поиска Блокнота (“Правка — Найти”). В поле поиска введите “image003” (без кавычек). Поиск должен привести вас к тегу типа
<img border=0 ... src=”4.files/image003.jpg” align=left hspace=12>
- Аккуратно перед правой угловой скобкой сделайте пробел и далее впечатайте без пробелов title=”Гадамер”, где Гадамер — текст вашей всплывающей надписи, заключенный в латинские КАВЫЧКИ (не путать с двумя апострофами!). Тег должен принять вид
<img border=0 ... src=”4.files/image003.jpg” align=left hspace=12 title=”Гадамер”>
- Закройте окно блокнота с сохранением изменений и пронаблюдайте в браузере работу всплывающей надписи. Оформите с помощью всплывающих надписей другие изображения на страницах вашего сайта.
Далее: Задание 8. Использование Java-скриптов
Вверх: Создание статического Web-сайта на
Назад: Задание 6. Оптимизация гипермедийного
ЯГПУ, Центр информационных технологий обучения
25.09.2012