Практическое занятие № 3

Тема №3. Разработка Web-представления средствами Microsoft FrontPage.

Цель работы: - получить практический навык разработки Web-представлений средствами Microsoft FrontPage

Учебные вопросы

3.1. Введение в Microsoft FrontPage

3.2.Создание нового веб-сайта FrontPage

3.4.Варианты индивидуального задания №3. Создание Web-документа с помощью программы Microsoft FrontPage

3.1.Введение в Microsoft FrontPage

Программа FrontPage, входящая в состав Microsoft Office , рассчитана в первую очередь, не на создание отдельных Web-страниц, а на сопровождение полноценного Web-узла .

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

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

Рис.3.1. Схема структуры узла

Программа Microsoft® FrontPage® 2002 позволяет создавать профессиональные, хорошо оформленные веб-страницы и веб-узлы. Существуют и более новые версии, напрмер Microsoft® FrontPage® 2003 и др.

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

• Все функции редактора FrontPage реализуются тегами HTML.

• Редактор FrontPage не имеет средств, которые нельзя было бы представить в виде тегов HTML.

• Пользователь не знает, какие именно средства HTML использует для достижения заданного эффекта и насколько корректно они применяются.

Редактор «ориентирован» на применение браузера Internet Explorer, так что создаваемый им код HTML наиболее адекватно отображается именно в этом браузере.

Лучшим способом ознакомления с программой FrontPage 2002 является ее практическое использование.

MS FrontPage предоставляет стандартные возможности по созданию и редактированию Web-страниц.

MS FrontPage представляет следующие возможности:

• позволяет просматривать Web-сайт в различных режимах и изменять его структуру,

• создавать новый Web-сайт с помощью мастеров и шаблонов

• публиковать Web-сайт на сервере

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

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

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

Веб-узел FrontPage может содержать:

• веб-страницы,

• рисунки,

• документы,

• файлы мультимедиа.

Фрагмент Веб-узел FrontPage прказан на рис.3.2.

Рис.3.2. Веб-узел FrontPage

Основы работы с программой Microsoft FrontPage

Чтобы запустить программу Microsoft FrontPage, выполните следующие действия.

• На панели задач Windows нажмите кнопку Пуск , выберите в главном меню пункт Программы, а затем — пункт Microsoft FrontPage.

Если программа FrontPage используется в первый раз, на экран выводится пустая страница, готовая для редактирования.

Примечания

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

• Чтобы закрыть веб-узел, в меню Файл выберите команду Закрыть.

Обзор рабочей области

Программа FrontPage 2002 обладает интегрированным интерфейсом, удобным для создания и редактирования веб-страниц, а также для управления веб-узлами из одного приложения. Панели инструментов и меню совместимы с другими программами Microsoft Office XP и являются полностью настраиваемыми. Удобные сочетания клавиш позволяют ускорить выполнение часто встречающихся задач, таких как открытие веб-узлов и веб-страниц, печать и многие другие команды.

На рис.3.3 и табл.3.1 представлены элементы интерфейса программы FrontPage 2002.

Рис.3.3. Интерфейс программы FrontPage 2002

Таблица 3.1.

Краткое описание элементов интерфейса программы FrontPage 2002

Элемент	Описание
Вкладка страницы	Удобное средство выбора нужной страницы при наличии нескольких открытых страниц.
Строка заголовка	Отображение имени текущей страницы, а также ее расположения на веб-узле.
Строка меню	Содержит меню, такие как Файл, Правка, Вид и Вставка, и является отправным пунктом при выполнении многих задач в программе FrontPage.
Поле “Задать вопрос”	Применяется для поиска дополнительных сведений о процедурах в программе FrontPage. В поле Задать вопрос вводится вопрос, для ответа на который используется справочная система.
Кнопка “Закрыть”	Эта кнопка используется для закрытия отображаемой страницы.
Полосы прокрутки	Позволяют перемещаться по странице и просматривать ее по частям.
Строка состояния	Предназначена для вывода сведений о состоянии текущей задачи. Например, в строке состояния при открытии домашней страницы может быть выведен текст “Извлечение Index.htm”, а при наведении указателя мыши на ссылку в области Обычный — адрес, на который указывает гиперссылка.
Переключатель представлений страницы	Предназначен для переключения между различными режимами представления страницы. Например, выполнение большинства задач, представленных в данном учебнике, осуществляется в режиме представления Обычный. Другими доступными режимами представления являются режимы HTML-код и Просмотр.
Индикатор выполнения	Показывает состояние текущего действия.
Ожидаемое время загрузки	Указывает время, необходимое для загрузки веб-страницы пользователем для просмотра в веб-обозревателе.
Область задач	Область в программах Office XP, содержащая наиболее часто используемые команды. Удобное расположение и небольшой размер области задач позволяют использовать эти команды непосредственно во время работы с файлами.
Панели инструментов Стандартная и Форматирование	Отображаются по умолчанию. Эти панели инструментов предоставляют быстрый доступ к наиболее часто используемым командам в программе FrontPage.
Панель представлений	Сведения, выводимые в главном окне программы, зависят от выбранного в текущий момент представления. Значки на панели Представления позволяют переключаться между разными представлениями сведений, содержащихся на веб-странице или на веб-узле.

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

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

Дополнительные сведения о программе FrontPage

Мастер ответов

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

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

1. Найдите в строке меню поле Задать вопрос .

2. Введите вопрос, сформулировав его своими словами. Например: “Как проверить орфографию на веб-странице?”.

3. Нажмите клавишу ENTER.

Глоссарий

При работе с учебником по FrontPage могут встретиться незнакомые термины. Эти термины могут появиться в интерфейсе пользователя программы FrontPage или в Интернете. Для поиска определений незнакомых слов следует использовать глоссарий справки FrontPage 2002.

Чтобы найти глоссарий, выполните следующие действия.

1. В поле Задать вопрос введите слово FrontPage.

Внимание!   Если введенное слово или фраза не относится непосредственно к программе FrontPage, вместо электронной справки FrontPage на экран может быть выведена справка Microsoft Office XP.

2. Нажмите клавишу ENTER.

3. В выведенном списке элементов, относящихся к нужному термину, выберите первый элемент.

4. Нажмите кнопку Отобразить на панели инструментов справки.

5. Появится скрытая область с вкладками Содержание, Мастер ответов и Указатель.

6. Выберите вкладку Содержание.

7. Знак плюс (+) рядом с какой-либо главой справки Microsoft FrontPage означает, что содержимое соответствующего списка “свернуто”, то есть скрыто. Если присутствует этот знак, список можно развернуть.

8. Щелкните знак “плюс” , расположенный слева от значка книги.

9. Появится список разделов, в нижней части которого следует щелкнуть знак “плюс” рядом с элементом Глоссарий.

В развернутом списке элемента Глоссарий содержится один раздел, который также называется Глоссарий.

10. Щелкните раздел Глоссарий .

В правой области появится список терминов в алфавитном порядке.

11. Прокрутите список, чтобы найти нужный термин.

12. Завершив работу с глоссарием, нажмите кнопку “Закрыть” .

В версии FrontPage2003 вместо содержание приводится Оглавление, а вместо глоссарий

приведен Термины (рис.3.4).

Рекомендуется ознакомится с справочным материалом по созданию веб-узла (рис.3.5).

Рис.3.4. Справка FrontPage 2003 «Оглавление»

Рис.3.5. Справка FrontPage 2003 «О создании веб-узла»

Создание нового веб-узла FrontPage

Чтобы начать создание нового веб-узла FrontPage, необходимо в области задач выбрать

одностраничный веб-узел - будет создан веб-узел FrontPage с пустой домашней страницей, готовый для дальнейшей работы (рис.3.6).

Рис.3.6. Фрагмент Области задач

Другие шаблоны веб-узлов – позволяет создать веб-узел FrontPage с готовыми макетами страниц, рисунками и темами оформления.

Применение шаблонов веб-узлов

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

Рис.3.7. Диалоговое окно Шаблоны веб-узлов

Для хранения веб-узла на локальном компьютере необходимо указать место хранения, например: C:\Мои документы\Мои веб-узлы\мой_веб_узел.

Для размещения веб-сайта на сервере с установленными серверными расширениями FrontPage, службами SharePoint Team Services 1.0 или Windows SharePoint Services: мой_сервер/мой_веб_узел

Рассмотрим представления

Открытие или создание страницы выполняется в одном из представлений страницы: Конструктор, С разделением, Код или Просмотр (рис.3.8).

Рис.3.8. Активно представление Конструктор

Первое представление – это Конструктор.

Представление Конструктор позволяет разрабатывать наглядный макет страницы, вводить текст, добавлять рисунки и гиперссылки и т. д. При работе в представлении Конструктор вся работа с кодом HTML осуществляется «за сценой». Пример работы в представлении Конструктор показан на рис.3.9.

Рис.3.9. Пример работы в представлении Конструктор

Представление С разделением разбито на две части (рис.3.10).

• В верхней части отображается код страницы HTML

• В нижней части — страница в представлении Конструктор.

При работе в одной из частей вторая обновляется автоматически.

Рис.3.10. Активно представление С разделением

Представление С разделением обладает рядом преимуществ:

• Точность разработки – при большом опыте работы с HTML, можно отслеживать код HTML, создаваемый при использовании конкретных средств представления Конструктор.

• Гибкость -    позволяет работать с представлением Конструктор и с кодом HTML одновременно, можно легко переходить от одного к другому, не переключаясь в другое представление.

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

Рис.3.11. Пример работы в представлении С разделением

Представление «Код»

В представлении Код отображается код страницы HTML.

Представление Код предназначено для быстрого и точного ввода и редактирования тегов, атрибутов и событий HTML.

Представление «Просмотр»

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

Важно помнить, что в представлении Просмотр страница отображается приблизительно; в обозревателе она не будет отображаться в точно так же, как здесь.

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

Пример в представлении Просмотр показан на рис.3.12.

Рис.3.12. Пример в представлении Просмотр