Практическая работа. Средства создания и сопровождения сайта. Создание web-сайта с помощью Word


Тема: Средства создания и сопровождения сайта. Создание web-сайта с помощью Word.
Цель: Освоение приемов создания web-страниц и web-сайтов с помощью текстового процессора MS Word; оформление дизайна страницы; организация внутренних и внешних гиперссылок.
Теоретические сведения к практической работе
В качестве редакторов, упрощающих создание Web-сайтов, можно использовать приложения Microsoft Office – Word, Excel, PowerPoint и др. При этом пользователь может не знать язык HTML и иметь привычную среду для оформления документа – WYSIWYG (что вижу, то и получаю). Огромное количество людей, использующих Word в своей повседневной работе, становятся потенциальными разработчиками HTML-документов.
Создать Web-станицу в Word можно двумя способами: с помощью Мастера или шаблона либо преобразовав существующий документ Word в формат HTML. При этом Word сам генерирует тэги HTML, хотя и не оптимальным образом.
Первый способ создания HTML-документов достаточно прост – надо начать создание документа "с нуля" и только следовать советам Мастера и использовать те средства, которые имеются в меню программы.
Второй способ – преобразование существующего документа Word в тэги HTML при сохранении файла Word в формате HTML. Преобразование естественно приводит к тому, что какие-то элементы оформления документа будут утрачены или изменены.
Одной из отличительных особенностей HTML-документов является то, что сам документ содержит только текст, а все остальные объекты встраиваются в документ в момент его отображения Браузером с помощью специальных тэгов и хранятся отдельно. При сохранении HTML-файла в месте размещения документа Word создает на диске папку, в которую помещает сопутствующие ему графические элементы оформления. Например, при сохранении файла с рисунками frieds.htm Word создает папку frieds.files, в которой и разместит все рисунки.
В соответствии с этим при создании сайта – группы взаимосвязанных Web-страниц – рекомендуется помещать сайт в отдельную папку и при перемещении или публикации сайта строго сохранять всю внутреннюю структуру папок.
При подготовке публикации в Интернет материалов, созданных в Word, полезно знать особенности преобразования в формат HTML. Некоторые из них приводятся ниже.

Конвертирование элементов оформления в HTML
Элемент документа WordПреобразование Word ® HTML
Размеры шрифтов В Word изображаются шрифты от 9 до 36 пунктов. Размеры шрифтов HTML изменяются от 1 до 7 и служат Браузеру указанием на размер шрифта
Текстовые эффекты: приподнятый, с тенью, уплотненный и т.д. Текстовые эффекты не сохраняются, но сам текст остается
Начертания: полужирный, курсив, подчеркивание Начертания шрифта остаются, но некоторые виды подчеркивания преобразуются в сплошную линию
Анимация текста Анимация не сохраняется, но текст остается. Для придания тексту анимационного эффекта можно использовать бегущую строку (панель "Web-компоненты")
Графика Изображения преобразуются в формат GIF или JPEG, если они не были сохранены до этого в таких форматах. Линии преобразуются в горизонтальные линии
Графические объекты: автофигуры, фигурный текст, надписи и тени Объекты преобразуются в файлы формата GIF. В среде редактирования Web-страницы можно вставить графические средства "Вставка" – "Рисунок"
Таблицы Таблицы преобразуются, однако параметры, не поддерживаемые HTML, не сохраняются (например, цветные границы и границы переменой ширины)
Нумерация страниц и колонтитулы Так как документ HTML считается одной Web-страницей, то понятие колонтитулов отсутствует, и нумерация страниц не сохраняется
Поля страниц и многоколонный текст Чтобы сохранить разметку страницы, следует использовать таблицы
Стили Определенные пользователем стили преобразуются в прямое форматирование, если оно поддерживается HTML
При необходимости вставить на HTML-страницу собственные тэги, в Word предусмотрено непосредственное редактирование HTML-кода. Это можно сделать, вызвав окно редактора через меню "Вид" – "Источник HTML". До того как перейти в этот режим, следует сделать сохранение файла. После завершения редактирования перед закрытием окна, файл также нужно сохранить.
Другая возможность перехода в режим редактирования НТМL – это открыть документ в Браузере и вызвать меню "Вид" – "В виде HTML". По умолчанию редактирование выполняется в Блокноте.
Хотя Word отображает документ практически в том же виде, в каком он в дальнейшем будет находиться в Браузере, предварительный просмотр Web-документа можно выполнить, не покидая Word.
В меню "Вид" установлены способы отображения документа Word. При выборе "Web-документ" файл отображается так, как будет выглядеть в Браузере, установленном на компьютере. Через меню "Вид" можно вернуться к обычному режиму работы с документом.
Содержание работы:
Задание № 1. Создайте с помощью Word web-сайт «Мой сайт», от имени любого любимого персонажа сказки, мультфильма, фильма и т.п. состоящий из пяти страниц:
Страница 1 должна содержать:
заголовок;
гиперссылки: «Обо мне», «Моя семья», «Друзья», «Мои увлечения».
Страницы 2, 3, 4 и 5 должны содержать:
заголовок;
по два или более отформатированных абзаца текста (один абзац не менее трех полных строк);
фотографии (минимум по одной на каждой странице).
Ссылки на главную и следующую страницу в виде кнопок.
Сохраните каждую страницу присвоив ей расширение *.html: Файл – Экспорт – Изменить тип – Web-страница в одном файле.
Сайт должен содержать информацию о выбранном персонаже, а также его родственниках, друзьях и т.п.
Требования к сайту:
заголовки и гиперссылки выравнивать по центру;
для абзацев текста использовать различные варианты выравнивания (по ширине, по левому краю, по правому краю);
использовать разные способы выравнивания фотографий;
обязателен фоновый цвет страницы, фоновый рисунок страницы;
на каждой странице должен быть заголовок окна;
для заголовков использовать шрифт Time New Roman, для основного текста Arial (размеры подобрать самостоятельно).
Придайте сайту законченный вид. Используйте вкладку Дизайн, темы
Задание № 2. Протестируйте работоспособность сайта в браузере (по возможность в двух различных). Протестируйте работоспособность сайта при выключенной графике. Для этого откройте в браузере свой документ html.