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

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

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

Редактор FrontPage «ориентирован» на применение обозревателя Internet Explorer, так что создаваемый им код HTML наиболее адекватно отображается именно в этом браузере. В частности, FrontPage позволяет использовать «бегущую строку», средство, которое не входит в стандарт HTML, но поддерживается Internet Explorer. Из числа стандартных средств HTML редактор FrontPage не поддерживает фреймы (точнее говоря, создание документов описания фреймов).

Окно программы FrontPage представляет собой комбинацию окна редактора и окна браузера. Документ HTML отображается редактором, как специфическим браузером, отображающим даже обычно невидимые элементы (такие как якоря). В то же время, этот текст можно редактировать средствами, аналогичными имеющимися в текстовом процессоре.

Рис. 1

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

Чтобы открыть программу в меню Пуск выберите Все программы - Microsoft Office – Microsoft Office FrontPage 2003.

Для упрощения и автоматизации создания Web-страниц редактор FrontPage позволяет использовать мастера и шаблоны. Выбор в списке Шаблон или Мастер веб-узлов, кроме пункта Нормальная страница, приводит к использованию мастера или шаблона документа. Результат представляет собой скорее план страницы, чем законченный продукт, и от пользователя требуется наполнение созданных разделов конкретным содержимым.

Шаблоны (Форма обозрения или Форма подтверждения) представляют собой готовый документ «общего характера». В тех местах, где должен располагаться текст, соответствующий нуждам конкретного пользователя, вместо этого помещен текст, описывающий принципы заполнения соответствующего раздела. Этот текст заменяется в ходе редактирования документа. В начале документа-шаблона имеется комментарий (не отображаемый в обычном браузере), описывающий общие правила заполнения данного шаблона. Сохранение документа, сформированного на основе шаблона, не изменяет сам шаблон, который может использоваться многократно.

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

Создание веб-узла (сайта) с помощью шаблона

1.    В меню Файл выберите команду Создать и области задач Создание документа в группе Создать веб-узел выберите Другие шаблоны веб-узлов…;

2.    В диалоговом окне Шаблоны веб-узлов выберите нужный шаблон (например, Личный веб-узел);

3.    Новый веб-узел будет создан в папке Мои документы - Мой узел и открыт в окне программы (Рис. 1);

4.    В окне Список папок отобразятся страницы сайта и папки для хранения фотографий, рисунков, тем оформления и пр.;

5.    Двойным щелчком откройте любую страницу для редактирования (в шаблоне страницы уже имеется цветовое и шрифтовое оформление (тема) и макет страницы, состоящий из таблиц, а также панели навигации, которые связывают между собой страницы сайта). Первая (главная) страница сайта всегда называется Index.

6.    Не забывайте сохранять изменения, несохраненные страницы сайта обозначаются звездочками .

Создание веб-узла (сайта) без использования шаблонов

1.    Создайте папку для Вашего веб-узла;

3.    Программа предложит добавить данные FrontPage – нажмите ОК;

4.    Создайте первую страницу сайта. В меню Файл выберите команду Создать и в области задач Создать страницу выберите Пустая страница.

Существует одно правило: размер странички должен укладываться в размер одного экрана. Т.е. если сайт рассчитан на пользователей 15 дюймового экрана то разрешение должно быть 600х800, а для 17 дюймового – 1024х786. В строке состояния отображается размер страницы и время ее загрузки . Чтобы изменить размер страницы щелкните левой кнопкой в поле размера в строке состояния и выберите в выпадающем списке нужный размер.

9.    Затем страницы заполняется нужными картинками и текстом. Для корректного расположения на странице текста, панелей навигации, рисунков их помещают в таблицы с прозрачными рамками. Чтобы создать таблицу, используют команду Таблица - Вставить таблицу. В открывшемся диалоговом окне указывают размер таблицы (в ячейках), а также дополнительные параметры, реализуемые как атрибуты соответствующих тегов. Чтобы занести информацию в таблицу, следует установить курсор в нужную ячейку и начать ввод. При работе с ячейками таблицы можно применять любые команды форматирования.

В качестве основного средства форматирования используется Панель инструментов форматирования. Она содержит:

• раскрывающийся список Изменение стиля  позволяющий выбрать стиль оформления абзаца (соответствующий стандартным функциональным элементам HTML;

• раскрывающийся список Изменение шрифта  позволяющий выбрать гарнитуру шрифта (наличие такого же шрифта в ходе просмотра документа через Интернет не гарантируется);

• кнопки увеличения и уменьшения размера текста (в относительных единицах HTML);

• кнопки выбора начертания ;

• кнопки выбора выравнивания текста;

• кнопки создания маркированных (неупорядоченных) и нумерованных (упорядоченных) списков

• кнопки задания отступа текста (на основе некорректного использования элементов HTML)

Дополнительные элементы форматирования, не вынесенные на панель инструментов, задаются в отдельных диалоговых окнах. Их можно открыть, например, с помощью команд Формат - Шрифт и Формат - Список.

Для создания гиперссылки надо выделить фрагмент текста, который будет использоваться как ссылка, и дать команду Вставка - Гиперссылка. В открывшемся диалоговом окне «Добавление гиперссылки» выбирают вкладку Связать с . Для создания внешней ссылки введите интернет-адрес на нужную страницу в поле Адрес, для создания ссылки на другую страницу своего узла (используется относительный адрес) выберите папку, в которой находится файл и укажите его мышью. Для создания ссылки внутри страницы выберите команду  и укажите на какую закладку ссылается объект, предварительно поставив закладку в это место с помощью команды Вставка – Закладка и указав имя закладки. Выбрав вкладку одновременно с созданием ссылки будет создан соответствующий документа, который немедленно открывается для редактирования.

Кнопка служит для указания места открытия ссылки (в этом же окне, в новом окне и др.)

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

10.          Созданные страницы объединяют с помощью ссылок. При связке в общий документ ссылки можно спрятать под любой видимый объект (картинки, меню, кнопки и т.д.). Можно воспользоваться меню Вставка - Панель ссылок (Рис. 5) или меню Вставка – Меняющаяся кнопка (Рис. 6).

Рис. 5

Рис. 6

11. В конце, когда страница создана, ее нужно сохранить в нужной папке. Сохраните файл под именем index в папку веб-узла и дайте название странице, нажав на кнопку Изменить в разделе Название (например, Главная или Домашняя) (
Рис. 7).

 
Рис. 7

Содержимое веб-страницы

Специальной команды создания формы редактор FrontPage не имеет. Однако при добавлении поля формы (через меню Вставка - Форма) создается и форма, включающая это поле. При добавлении последующих полей следует следить за тем, чтобы они включались в ту же самую форму.

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

Дополнительные объекты вставляются в редактируемый документ при помощи меню Вставка. Например, для вставки изображения используется команда Вставка – Рисунок, а затем выбрать меню Картинки (эта команда позволяет вставить рисунок из коллекции MS Office) или меню Из файла (открывает диалоговое окно, в котором нужно указать место расположения картинки или фото на диске). В ходе создания документа различные графические форматы автоматически преобразуются в форматы GIF и JPEG. Сохранение преобразованного файла осуществляется при сохранении документа, при этом Вам будет предложено указать папку, в которую будет сохранен рисунок.

Другие элементы, которые можно разместить на странице, — это:

• горизонтальная линейка (Вставка - Горизонтальная линия);

• видеозапись (Вставка -Рисунок- Видеозапись);

• фоновое звуковое сопровождение (Формат – Фон - Фоновый звук и и нажав на кнопку Обзор указать место расположения звука);

• «бегущая строка» (Вставка - Веб-компонент - Бегущая строка, этот элемент воспроизводится только обозревателем Internet Explorer).

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

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

По вопросам, связанным с этим веб-узлом, обращайтесь по адресу rspu@rspu.edu.ru

© КЛ ЛИ РГПУ, 2005-2006. Все права защищены.
Последнее изменение: 13.09.2006.