Описание и основные возможности программы ms frontpage. Создание Web-страниц при помощи программы FrontPage

С развитием Интернета появился протокол обмена информацией,протокол называется HTTP (HyperText Transfer Protocol – протокол передачи гипертекста).Вместе с этим протоколом появилась и служба World Wide Web (часто называемая WWW или просто Web ), которая подставляет собой обширную сеть серверов HTTP , передающих файлы через Интернет .

Основную часть этих файлов представляют собой Web-страницы – специальные файлы, написанные на языке HTML (HyperText Markup Language – язык разметки гипертекста). Web-страницы публикуются в Интернете путем размещения таких файлов на серверах HTTP (Web-узлах) . Содержание Web-страниц может быть разным и посвященным совершенно произвольным темам, но все они используют одну и тужу основу – язык HTML .
Большинство людей желающих создать свой собственный сайт или страничку, знакомы с языком HTML только понаслышке. Поэтому им на помощь может придти программа Microsoft FrontPage ,один из самых известных конструкторов сайтов.

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

Окно программы FrontPage 2003.

Программа FrontPage выпущена компанией Microsoft и выполнена в едином стиле продуктов, входящих в пакет Microsoft Office , поэтому внешний вид программы практически не отличается от текстового процессора Word .

В верхней части окна располагается строка меню и две панели инструментов: Стандартная и Форматирование . Включать или отключать отображение панелей инструментов позволяет меню Вид .
В левой части находится Панель представлений , при помощи которой можно переключать режимы документа.
Основную часть окна занимает рабочая область, в которой могут быть открыты одно или несколько окон, содержащих отдельные документы.
В нижней части окна располагается строка состояния , содержащая справочную информацию . Так же в нижней части окна находятся три кнопки просмотра документа.
Отображение панелей инструментов.
Для управления панелями инструментов во FrontPage можно воспользоваться теми же способами, как в Microsoft Word . А именно:
в меню Вид надо выбрать пункт Панели инструментов , а в открывшемся новом подменю - установить флажки напротив тех панелей инструментов, которые вам нужны; или щелкнуть правой кнопкой мыши по какой-либо панели управления (или по области рядом с ней) и точно так же воспользоваться контекстным меню.

FrontPage , как и другие приложения Microsoft Office , позволяет добавлять, удалять, менять местами пункты меню и кнопки на панелях инструментов. Также существует возможность создавать полностью свои панели.
Для этого надо:

В меню Сервис выбрать пункт Настройка …
или
в меню Вид выбрать пункт Панели инструментов , а в появившемся каскадном меню - пункт Настройка …
В результате ваших действий откроется диалоговое окно Настройка , где можно установить необходимые панели.

Создание новой Web-страницы .

Если вы запустили FrontPage , значит, новая Web-страница у вас уже создана (при запуске FrontPage сразу открывается новая пустая Web-страница , готовая для размещения текста и любых других элементов).
Создать новую Web-страницу можно и другими способами:

С помощью кнопки Новая страница на Стандартной панели инструментов.
меню Файл выбрать подменю Создать , а затем – Страница или Web-узел ;
с помощью комбинаций Ctrl+N ;
с помощью контекстного меню (работает во всех режимах, кроме режимов Задачи и Отчеты ) - для этого внутри Списка папок данного Web ) надо щелкнуть правой кнопкой мыши и в появившемся контекстном меню выбрать пункт Создать  Страница .

Создание станиц при помощи мастера и шаблонов.

Как уже говорилось выше, если для создания новой страницы вы воспользовались меню Файл  Создать  Страница или Web-узел , то FrontPage предложит вам воспользоваться шаблоном для создания новой страницы.
Для этого он откроет диалоговое окно, внешний вид которого приведен ниже:

На вкладке Общие данного диалогового окна выводится перечень шаблонов FrontPage , доступных в настоящий момент. Выбрав любой из шаблонов, можно посмотреть его описание в поле Образец .
Создание FrontPage Web .
Microsoft FrontPage Web - это набор Web-страниц , файлов с изображениями и других компонентов, которые можно рассматривать как единое целое.
Если делать сайт во FrontPage , то для его хранения удобней всего использовать FrontPage Web .
самый главный плюс - это возможность переименовывать файлы, входящие в состав FrontPage Web .
Представьте себе, что перед публикацией вашего сайта в Интернет вы вдруг заметили, что пара файлов у вас названа русскими именами. - «Теперь по всем файлам придется лазить и ссылки ручками менять!» дуамете Вы.Вот тут-то и поможет FrontPage Web - вы можете покойно переименовать файлы, а FrontPage самостоятельно пройдется по всем другим файлам, входящим в FrontPage Web и переименует все ссылки на исправленный вами файл.
все остальные преимущества описывать не буду, но хочется сказать, что для использования всех возможностей FrontPage , то лучше использовать FrontPage Web .
Итак, чтобы создать новый FrontPage Web нажмите на стрелочку, расположенную слева от кнопки Новая страница на панели инструментов и в появившемся выпадающем меню выберите пункт Веб-узел…

Открытие Web-страниц.

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

Открыть уже существующую Web-страницу можно в любом из существующих режимов.

Из режима Page Views есть четыре способа открыть существующую страницу:

1 способ

Если вы работаете с FrontPage Web , то просто выберите нужный файл в Списке папок и дважды щелкните по нему мышью.

2 способ

В меню Файл выберите пункт Последние файлы . Из появившегося каскадного меню выберите нужный файл.

3 способ

С помощью диалогового окна Открытие файла: Файл  Открыть .

Предварительный просмотр.

Для того чтобы посмотреть, как ваша страница выглядит непосредственно в браузере можно воспользоваться вкладкой Просмотр в режиме редактирования Web-страницы . Но в данном случае может оказаться, что браузер FrontPage не вполне корректно отобразит некоторые элементы вашей страницы , поэтому лучше всего:
воспользоваться кнопочкой на панели инструментов
или в меню Файл выбрать пункт Предварительный просмот р в обозревателе.

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

Здесь можно:
Выбрать обозреватель, в котором вы хотите просмотреть свою Web-страницу . Как правило, первоначально здесь отображается браузер , который по умолчанию установлен на вашей машине.
Добавить любой другой обозреватель, для чего необходимо воспользоваться кнопкой Добавить .
Редактировать или удалить установленные обозреватели.
Установить размер экрана, на котором будет просматриваться ваша Web-страничка

Сохранение Web-страниц .

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

Удаление Web-страниц.

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

Существует три способа удаления Web-страницы .

1 способ

В панели Список папок выделите файл, который необходимо удалить и нажмите кнопку Delete на клавиатуре.

2 способ

В панели Список папок щелкните правой кнопкой мыши по файлу (или значку файла ), который необходимо удалить и в появившемся контекстном меню выберите пункт Удалить .

3 способ

В панели Список папок выделите файл , который необходимо удалить и затем выберите пункт Удалить в меню Правка .

Работа с текстом.

На первый взгляд, ввод текста во FrontPage ничем не отличается от ввода текста в любом текстовом редакторе (например, в Microsoft Word ).
Для того чтобы набрать текст, достаточно щелкнуть мышью в любом месте страницы, и курсор будет помещен в ближайшую точку, в которую можно ввести текст.
Набор прописных букв, редактирование текста (удаление символов, вставка текста и т.д.) производится точно также, как в Microsoft Word.
Есть только одно небольшое НО: при нажатии клавиши Enter во FrontPage осуществляется принудительный переход курсора на новую строку, при этом до и после абзаца ставятся фиксированные абзацные отступы.
Если вам не надо создавать абзацы, то для перехода на новую строку лучше всего использовать комбинацию клавиш Shift +Enter.

Работа с изображениями.

Графически форматы в Web .

Все компьютерные изображения, все форматы для их хранения (а, следовательно, и все программы для их обработки) делятся на два больших класса - векторные и растровые . Векторное изображение состоит из объектов - геометрических форм, составленных из прямых, дуг, окружностей и кривых Безье. Достоинств у векторной графики немало. С точки зрения дизайнера, самое главное ее достоинство состоит в том, что векторную графику можно «вертеть» как угодно, не боясь «протереть дырку» в изображении или потерять часть информации. Другое достоинство - небольшой объем файлов (в сравнении с растровыми изображениями) и независимость от разрешения устройств вывода (будь то принтер или экран монитора). Эти факторы сделали векторную графику вероятным кандидатом для использования в Internet . Правда стоит оговориться, что на сегодняшний момент векторная графика встречается не так уж часто, как хотелось бы.
Тем не менее, среди реально применяемых векторных форматов хотелось бы отметить формат Shockwave Flash фирмы Macromedia . Для просмотра этого формата в браузере нужен подключаемый модуль (plug-in ), бесплатно распространяемый фирмой Macromedia . На сегодняшний день существуют как сайты целиком и полностью созданные по этой технологии, так и сайты, используемые Flash-формат лишь частично.
Растровое представление графики базируется на понятии растра. Растр – это совокупность объектов (в данном случае пикселей), размещенных в одинаковые строки и столбцы. Т.е. растровый компьютерный файл можно рассматривать как набор маленьких цветных или серых квадратиков, образующих мозаику изображения. Т.к. размер этих квадратиков заведомо мал, то при просмотре растровой графики эти квадратики сливаются друг с другом, образуя непрерывную смену цветов.

Растровый формат хранения изображения имеет как свои преимущества, так и недостатки. Одним из больших плюсов растровой графики является возможность работы с полутонами, т.е. возможность передавать изображение точно также, как оно выглядит в жизни. А вот среди недостатков основной проблемой является размер файла. Естественно, чем больше пикселей отведено для формирования изображения , тем выше качество передаваемого изображения , но, тем самым больше будет и размер файла.
Если мы теперь вернемся к браузерам, то можно сказать следующее, что большинство браузеров без проблем могут отображать графические файлы четырех форматов (*.gif, *.jpg, *.png, *.bmp ), использовать из которых на сегодняшний момент лучше всего два - *.gif и *.jpg . Да и то после предварительной оптимизации.
Вставка изображений на Web-страницу .
Вставлять изображение на вашу Web-страницу можно несколькими способами:
1. Перетащить изображение из Windows Explorer (то есть прямо из проводника).
2. Перетащить изображение из Internet Explorer .
3. Перетащить файл с изображением с панели Список папок , прямо на страницу.
4. С помощью буфера обмена - скопировать изображение в буфер обмена из любой другой программы, а затем на странице вставить его из буфера обмена.
5. С помощью кнопки Добавить рисунок из файла на панели инструментов Стандартная .
6. С помощью меню Вставка  Рисунок.
Рассмотрим эти способы более подробно:
Способ 1
Windows Explorer (то есть прямо из проводника) надо:
во FrontPage
открыть окно проводника;
в окне проводника выделить файл с картинкой, которую вы хотите вставить на свою страницу;
левой клавишей мыши перетащить файл-картинку на свою Web-страницу картинка вставиться в то место, где на странице находился курсор вставки.
Способ 2
Для того чтобы перетащить изображение из Internet Explorer надо:
во FrontPage открыть страницу, на которую вы хотите добавить изображение;
в браузере откройте то изображение, которое вы хотите поместить на своей Web-странице браузера название файла должно оканчиваться на jpg, jpeg, gif );
левой клавишей мыши перетащите выделенную картинку на свою Web-страницу ;
Способ 3
Для того чтобы перетащить файл с изображением с панели Список папок, прямо на страницу надо:
во FrontPage открыть страницу, на которую вы хотите добавить изображение ;
выбрать необходимый файл с картинкой на панели Список папок ;
левой клавишей мыши перетащите выделенную картинку на свою Web-страничку ;
выбранная картинка вставиться в то место, где на странице находился курсор вставки.
Способ 4
Для того чтобы вставить изображение на свою Web-страницу с помощью буфера обмена, надо:
в том приложении, из которого вы хотите скопировать картинку, выделить изображение и при помощи клавиш Ctrl + C скопировать рисунок в буфер обмена;
на своей Web-странице вставить это изображение из буфера обмена при помощи клавиш Ctrl + V
Способ 5
Web-страницу вы решили воспользоваться кнопкой Добавить изображение из файла на панели инструментов Стандартная , то FrontPage откроет диалоговое окно Рисунок .
В данном диалоговом окне укажите тот файл с картинкой, который вы хотели бы добавить на свою Web-страницу и нажмите кнопку Вставить.

Способ 6
Если для вставки изображения на свою Web-страницу вы решили воспользоваться меню Вставка  Рисунок , то FrontPage предложит сделать вам дальнейший выбор:

Картинки … – выбор того пункта меню предоставляет вам возможность воспользоваться готовой библиотекой картинок.
Из файла … – выбор данного пункта меню предоставляет вам возможность самостоятельно указать местонахождение файла с картинкой, который вы хотите добавить на свою Web-страницу (использование этого пункта приведет к открытию диалогового окна Рисунок , работа с которым была описана выше).
Создать фото коллекцию … - при помощи этого пункта меню можно создать коллекцию изображений в определенном стиле. Для это в открывшемся окне Свойства коллекции фотографий при помощи кнопки Добавить на вкладке Рисунки выбрать изображения, а на вкладке Макет выбрать формат оформления.
Добавление файлов мультимедиа.

Помимо простой графики, как – изображения в форматах *.gif, *.jpg, *.png и т.д. FrontPage позволяет размещать на ваших Web-страницах файлы мультимедиа. К ним относятся: видеоклипы, звуки…

Для вставки видеоклипа надо в меню Вставка выбрать пункт Рисунок , а затем Видеозапись.. .

Откроется диалоговое окно Видео , в нем будут отображаться видеоклипы в формате *.avi, *.asf, *.ram, *.ra .

Добавить звук на Web-страницу можно на вкладке Общие диалогового окна Свойства страницы .

Работа с таблицами.

Таблица - одно из наиболее мощных инструментов используемых при создании сайтов.
Изначально таблицы применялись только для представления структурированных данных. Однако постепенно они превратились в мощное универсальное средство для компоновки Web-страниц.

Создание таблиц

Самый простой способ создания таблицы – использовать кнопку Добавить таблицу , расположенную на панели инструментов Стандартная.
Еще один способ – при помощи пункта меню Таблица  Вставить  Таблица .
А так же таблицу можно нарисовать и вставить при помощи буфера обмена.

Ввод данных и навигация по таблице.

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

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

Однако более удобно для перемещения между ячейками использовать комбинации клавиш:
Сочетания клавиш: Действие:

Tab в любом месте таблицы,кроме конца последней строки перейти в соседнюю ячейку и выделить ее содержимое
Tab в конце последней строки добавить новую строку в низ таблицы
Shift +Tab перейти в предыдущую ячейку и выделить ее содержимое
Enter начать новый абзац
Enter в начале первой ячейки добавить текст перед таблицей в начале документа

Создание и применение форм.

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

Давай познакомимся с тобой - пожалуйста, заполни следующие поля:
Твое имя:

Твоя фамилия:

Дата твоего рождения: год месяц число

Спасибо! А теперь - в путь!
1. Мала, а проворна.
Где бывает, там повелевает.
В шатер зайдет -
Богатыря перевернет.
Кто это?
Муха Блоха Капризный ребенок
2. Выпуча глаза сидит,
По-французски говорит,
По-блошьи прыгает,
По-человечьи плавает.
О ком идет речь?
Кот Лягушка Попугай

3. Чем дышит тюлень, нырнув под лед?

4. Почему плачут большие черепахи?

5. Какую одежду может и селедка носить?
Шубу Пальто Тельняшку
6. Кого называют «речной лошадью»?
Выдру Бегемота Крокодила

7. Какие птицы не высиживают птенцов?

8. Какие птицы не умеют летать?

Если вам необходимо выберать несколько ответов - нажмите и не отпускайте клавишу Ctrl и щелкайте левой клавишей мыши по нужному ответу

Но создание форм на самой страничке это только половина работы. Так как обязательно должна существовать программа, которая сможет обработать данные, введенные пользователем с помощью форм.
Такая программа может быть расположена на сервере; она может находиться в вашем Web-сайте в виде отдельного файла, а может быть просто прописана в коде html на вашей Web-страничке .
Именно она определяет - что же произойдет с той информацией, которую ввел пользователь:

информация может быть добавлена в базу данных и на ее основе могут быть построены различные графики, рейтинги…;
информация может быть переправлена по электронной почте (это часто используют для получения информации о пользователе в анкетах различного рода);
информация может быть обработана прямо на месте и посетитель вашего сайта тут же получит ответную информацию (например - получит баллы за тест, увидит введенную им информацию в гостевую книгу…).

В отношении форм существует несколько основных правил:

1. Каждая форма занимает определенный участок Web-страницы . На одной Web-страничке может быть расположена одна или несколько форм.
2. Внутри каждой формы должен размещаться, по крайней мере, один из элементов форм (хотя, как правило, их несколько).
3.Каждый элемент формы имеет имя и значение. Имя идентифицирует поле для ввода информации, а значение приравнивается к значению, выбранному пользователем.
4. Один из элементов формы (им может быть обычная кнопка или любой рисунок) должен выполнять функцию кнопки Отправить.

Создание форм во FrontPage .
Чтобы добавить форму на Web-страницу , надо:

Установить курсор в то место, где вы хотите вставить форму.
В меню Вставка выбрать пункт Форма , в открывшемся меню снова выбрать пункт Форма . Форма будет помещена на вашу Web-страницу - появиться область, помеченная пунктирной рамочкой, с двумя кнопками: Отправить и Сброс .
Пользуясь все тем же пунктом меню Вставка  Форма последовательно вставить необходимые вам элементы форм , выбирая их из раскрывающегося каскадного меню (при этом необходимо помнить, что все элементы формы вставляются внутри области формы, помеченной пунктирной рамочкой).
После того, как форма создана, остается только наполнить ее содержанием - элементами форм , текстом, изображениями, таблицами… (при этом размеры формы будут меняться автоматически).
Добавлять содержание форм можно обычным образом. Например, текст можно набирать, а можно вставлять из буфера обмена… Все действия с добавленными объектами аналогичны.
Однако создание формы - это только начало работы. После ее создания необходимо настроить свойства, как самой формы , так и ее элементов.

Настройка свойств формы.

Для обработки или сохранения данных, вводимых посетителями Web-странички , необходимо либо воспользоваться возможностями, предоставляемыми FrontPage Server Extensions , либо какой-нибудь другой программой, работающей на Web-сервере .
Но какую бы программу вы не выбрали, вам все равно придется настроить свойства формы и элементов в ней.
Чтобы открыть окно свойств формы, надо:
в меню Вставка выбрать пункт Форма , а затем -
или
вызвать контекстное меню к форме и в открывшемся контекстном меню выбрать пункт Свойства формы .
В результате откроется диалоговое окно Свойства формы .

1. В поле Сохранение результатов необходимо указать, что надо будет сделать с данными, введенными в форму . Вы можете выбрать следующие варианты:
o Отправка Имя файла - данные будут помещены в указанный файл на Web-сервере . Этот файл может быть Web-страницей , которая со временем будет становиться все длиннее и длиннее, или файлом данных, который потом можно будет обработать в Excel, Access или любой другой программой;
o Отправка Адрес почты - в этом случае каждый раз при нажатии посетителем Web-странички кнопки Отправить на форме будет генерироваться электронное сообщение, которое будет отправляться по указанному вами адресу. В этом сообщении будут содержаться все данные, которые были введены пользователем на Web-страничке.
o В базе данных - в этом случае данные формы будут отправлены в базу данных. База должна находиться на Web-сервере (или быть доступной для него).
2. В поле Свойства формы необходимо указать имя формы
Режимы просмотра во FrontPage .
FrontPage предлагает шесть различных режимов для просмотра содержимого Web-сайта:

Страница,
Папки,
Отчеты,
Переходы,
Гиперссылки,
Задачи.
Для выбора нужного режима можно воспользоваться панелью Представления , расположенной в левой части экрана, или в меню Вид на панели инструментов Стандартная выбрать соответствующий пункт меню.

Страница
В этом режиме осуществляется создание и редактирование Web-страниц. Здесь можно создавать пустые Web-страницы и страницы, базирующиеся на шаблонах, назначать страницам темы (набор стилей представления страницы на экране). В этом режимы можно добавлять и форматировать текст, оформлять страницы с использованием графических и видеоизображений (поддерживается преобразование ряда графических форматов в форматы *.gif, *.jpg и *.png ), добавлять к странице звуковое сопровождение, представлять информацию в таблицах, кадрах и формах и, наконец, создавать гиперссылки. Таков далеко не полный перечень возможностей FrontPage по редактированию содержимого Web-страниц .
Папки
В этом режиме можно просматривать структуру Web-узла (файлы и папки) и управлять ею аналогично тому, как вы это делаете в Windows , данный режим дает возможность получить более подробные сведения о файлах и папках, чем это предусмотрено в режиме просмотра Страница.
Отчеты
Предоставляет вашему вниманию более десятка отчетов, содержащих разнообразную информацию о Web-узле , открытом во FrontPage.
Переходы
Предназначен для просмотра иерархии сайта. В этом режиме можно управлять иерархией, перетаскивая прямоугольники (каждый из которых представляет определенную Web-страницу ).
Гиперссылки
Демонстрирует систему гиперссылок, которыми связаны между собой страницы Web-узла (а также систему гиперссылок на другие узлы), обеспечивает проверку их целостности и возможность изменения.
Задачи
Этот режим предназначен для управления задачами Web-узла (добавления, удаления, выполнения, установления приоритета выполнения, а также отслеживания состояния задач).

Скачать БЕСПЛАТНО FrontPage можно по следующей ссылке:

http://letitbit.net/download/28576.28615a37d4f2a575882748541adf3bf00/Microsoft_Office_FrontPage_2003.rar.html

FrontPage является одним из самых популярных визуальных инструментов web-дизайна.

Microsoft FrontPage 2003 включает средства для профессионального проектирования, разработки, работы с данными и публикации, необходимые для создания динамических веб-узлов.

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

Для FrontPage существует большое количество платных и бесплатных дополнительных модулей ( plug - ins ), расширяющих его возможности. Например, оптимизаторы графики Ulead SmartSaver и Ulead SmartSaver Pro встраиваются не только в Photoshop, но и в FrontPage .

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

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

Главной особенностью FrontPage является то, что этот редактор работает в режиме WYSIWYG (What You See Is What You Get - что видишь – то и получишь), то есть позволяет создавать HTML-страницы в визуальном режиме. Для создания страниц пользователь использует те же приемы и навыки, что и при работе в Microsoft Word.. При этом необходимый код на языке HTML генерируется автоматически.

Веб-узел

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

Веб-обозреватель (browser, браузер) – программа, используемая для навигации и просмотра различных интернет-ресурсов. Веб-обозреватель считывает HTML-документ и форматирует его для представления пользователю. Наибольшее распространение получили браузеры Microsoft Internet Explorer, Netscape Navigator, Mozilla, Opera.

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

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

Типы узлов

Рассмотрим типы узлов, которые можно подготавливать с помощью FrontPage 2003.

Имеется два вида узлов: дисковые узлы и серверные узлы. Дисковые узлы можно запускать на любом компьютере или даже с гибкого диска или компакт-диска. Дисковые узлы поддерживают только базовые функции HTML. Многие веб-компоненты, поддерживаемые программой FrontPage , не действуют на дисковом узле.

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

Большинство узлов обычно разрабатываются как дисковые узлы. Это означает, что они разрабатываются на локальном компьютере. Затем они публикуются на веб-сервере , либо внутри организации, либо на внешнем хостинге.

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

Для некоторых компонентов требуется, чтобы узел или веб-страница находились на веб-сервере , где запущен пакет Windows SharePoint Services компании Microsoft.

Другие общие веб-компоненты действуют только на серверном узле, размещенном на веб-сервере с комплектом серверных расширений FrontPage Server Extensions.

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

Возможности серверного администрирования доступны только для серверных узлов, размещенных на веб-серверах, где запущен пакет Windows SharePoint Services или FrontPage Server Extensions.

Чтобы отображать информацию баз данных, узел должен быть размещен на

ВВЕДЕНИЕ

Целью работы

Теоретические сведения

Главное меню

«Файл».

«Правка».

«Вид». Папки», «Список папок» Панели инструментов.

«Вставка».

«Формат».

«Таблица».

1.1.2 Панели инструментов

рис. 2 Вид/Панели инструментов»

Основные элементы интерфейса

При работе с узлом, вам постоянно придется просматривать его в браузере, для чего вам понадобятся следующие элементы интерфейса:

Пиктограмма - «Просмотр в браузере» . Отображается на панели «Стандартная» (см. рис. 3)

Рисунок 3. Пиктограмма «Просмотр в браузере» на панели «Стандартная»

Проектирование сайта

Создание узла

Для создания веб-узла требуется зайти в меню «Файл\Создать» . Справа появится панель Создание. Создавать можно как отдельные страницы, так и целые веб-узлы. При этом имеется возможность пользоваться готовыми шаблонами. При создании сайта они могут служить неплохую службу. Хотя бы, как пример хорошо спроектированных узлов. В данной работе необходимо создать Одностраничный веб-узел (см. рис. 4) .

Рисунок 4. Одностраничный веб-узел среди шаблонов веб-узлов

После того, как веб-узел создан, на экране появляется список папок (см. рис. 5) . Вернуться к этому представлению всегда можно из меню «Вид\Папки» . Можно также использовать «Вид\Список папок» (ALT+F1): в этом случае список папок и файлов будет занимать не основное окно, а панель слева.

При разработке сайта первым делом необходимо определиться с тематикой, подыскать содержание. На этом этапе необходимо разместить материалы для дальнейшего использования в сайте в папках узла. Это могут быть различные изображения, анимации, музыка, видео и прочие. Размещать можно как в корневой папке узла, так и во вложенных папках. Вы можете создать новую папку. В-дальнейшем, вы без труда можете пополнять папки веб-узла новыми файлами, переименовывать и переносить их из одной папки в другую – FrontPage автоматически изменит пути к этим элементам во всех страницах узла. Эта функция FrontPage чрезвычайно важна, так как некоторые из страниц вашего узла, возможно, будут сгенерированы автоматически и имена файлов будут, например: нов_стр_1.htm . При размещении на сервере с ОС Linux, страница будет работать неправильно. Правилом хорошего тона является использование в названиях только букв латинского алфавита и цифр .

Рисунок 5. Папки

Разработка структуры сайта

Следующий этап создания сайта – Разработка структуры . Прежде чем приступать к непосредственному оформлению страниц, необходимо тщательно продумать структуру сайта.

Для этого во FrontPage есть представление«ПЕРЕХОДЫ». Чтобы открыть его, откройте пункт меню «Вид\Переходы» либо «Вид\Область переходов».

Для создания страницы необходимо выделить родительскую страницу, щелкнуть правой кнопкой мыши и из контекстного меню выбрать «Создать\Страница» или нажать CTRL+N . Для включения крупных подразделов ниже второго уровня можно использовать панель ссылок («Создать\Пользовательская панель ссылок»). Панель ссылок не является отдельной страницей. При ссылке на нее открывается первая страница из подраздела. Для добавления страниц можно пользоваться также кнопками на панели переходов () – результат тот же, но гораздо проще. В-дальнейшем, на основе сформированной структуры переходов можно будет создать панель ссылок.

При составлении структуры желательно сразу же изменять названия: «Новая страница 1», «Новая страница 2», либо «Новая панель ссылок» и т.д. менять на более осмысленные названия: «Архивы», «Контакты», «Ссылки», «Галерея» и т.д.

Добавленные страницы автоматически добавляются и в список папок.

Имена файлов желательно также переименовать, используя при этом только латинский алфавит и цифры.

Пример структуры узла представлен на рис. 6.

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

Рисунок 6. Добавление страницы в Структуру узла

Разметка страницы

После разработки структуры сайта требуется продумать разметку страниц: какие элементы, на каком участке страниц размещать. На этом этапе на каждой странице бронируется место под будущие элементы дизайна.

Общие границы

Зачастую на всех страницах сайта присутствуют одни и те же элементы: рисунок в «шапке» сайта и главное меню. При изменении дизайна рисунка либо добавлении ссылки в главное меню необходимо, чтобы это отразилось на всех страницах сайта.

Для этого используются ОБЩИЕ ГРАНИЦЫ (вызываются из меню «Формат\Общие границы»).

Можно настроить общие границы сверху, слева, справа и снизу (см. рис. 7) . При этом можно включить автоматически добавляемые кнопки переходов и рисунок (рисунок должен быть предварительно помещен в список папок веб-узла). При активизации метки «включить кнопки переходов» автоматически будет включено дочернее меню (ссылки на дочерние страницы). Зачастую требуется, чтобы на всех страницах присутствовало главное меню (ссылки на домашнюю станицу + дочерние страницы домашней). Для этого надо на любой странице щелкнуть правой кнопкой мыши по панели ссылок, в контекстном меню выбрать «Свойства панели ссылок» и изменить свойства.

Если на некоторых страницах должны быть другие общие границы, надо в представлении «Список папок» выделить эти страницы и применить «ОБЩИЕ ГРАНИЦЫ» к выделенным страницам.

Рисунок 7. Общие границы

В конструкторе общие границы отображаются штриховыми линиями: любой элемент внутри этих границ будет виден на всех страницах сайта (см. рис. 8).

Рисунок 8. Панели ссылок в общих границах

Примечание: Если поддержка общих границ отключена, то чтобы её включить, необходимо зайти на закладку «Сервис\Параметры страницы\Разработка» и активизировать метку «ОБЩИЕ ГРАНИЦЫ» (см. рис. 9).

Рисунок 9. Включение компонента «Общие границы»

Панели ссылок

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

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

Таблицы. Макетные таблицы

Таблицы – одно из наиболее первых и наиболее популярных до сих пор средств разметки страницы. Нововведением являются макетные таблицы – шаблоны таблиц. При вызове из меню «Таблицы\Макетные таблицы и ячейки» появляется панель макетных таблиц (см. рис. 13), из которой вы можете подобрать наиболее понравившийся вам макет, который вы можете при необходимости изменить, объединяя или разъединяя ячейки.

К сожалению, при применении к странице компонента «Общие границы» , макетные таблицы использовать нельзя. В этом случае можно воспользоваться обычными таблицами («Таблица\Вставить\Таблица» ), отформатировав их соответствующим образом.

Рисунок 13. Макеты таблицы

Наполнение сайта

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

Изображения

Для вставки изображений используется меню «Вставка\Рисунок» .

Можно вставлять рисунки из файла либо картинки из встроенной коллекции Microsoft Office. Здесь можно также вставить flash-анимацию либо фотоколлекцию.

Фотоколлекция – это набор рисунков, каждый из которых может быть просмотрен отдельно. При настройке свойств фотоколлекции (см. рис. 14) на закладке«Рисунки» нужно добавить рисунки и описания к ним, на закладке «Макет» выбрать – способ представления рисунков.

Рисунок 14. Создание коллекции фотографий

Для вставки гиперссылки необходимо в конструкторе написать текст либо вставить рисунок, выделить область, после чего зайти в меню «Вставка\Гиперссылка» (CTRL+K). Появится окно (см. рис. 15), в котором надо настроить параметры гиперссылки.

страницу, файл, внешний сайт. В этом случае нужно написать адрес сайта, страницы, файла либо выбрать из списка.

на место в документе (закладку). Для создания такой ссылки, нужно нажать кнопку «Закладка» и далее выбрать закладку из списка. (Закладка должна быть создана заранее. Для создания закладки нужно установить курсор в месте создания закладки, после чего выбрать пункт меню «Вставка\Закладка» ).

на электронный почтовый ящик (см. рис. 16). В этом случае нужно выбрать раздел: связать с электронной почтой (кнопка в левом нижнем углу) и настроить заглавие отправляемого сообщения.

При настройке гиперссылок также можно указать, в каком окне должна быть открыта страница (в том же, в новом, …). Для этого нужно нажать «Выбор рамки» и выбрать подходящий пункт.

Можно настроить стиль, нажав кнопку «Стиль» и выбрав в поле «Класс» класс, созданный ранее (вопрос создания стили рассматривается в разделе 5.1.2 Стили ). Там же (в окне «Стиль» после нажатия соответствующей кнопки) можно настроить стиль только для данного элемента, нажав кнопку «Формат» .

Меняющиеся кнопки

Меняющиеся кнопки представляют собой разновидность гиперссылки: кнопка-рисунок, при нажатии на которую, осуществляется переход на другую страницу. Для вставки кнопок зайдите в пункт меню «Вставка\Меняющаяся кнопка» . Выберите подходящую кнопку, введите текст для отображения на экране и адрес страницы, к которой должен осуществляться переход при нажатии на кнопку.

Слои

Слои нужны, когда необходимо на одном участке страницы разместить несколько элементов, например: текст поверх рисунка. Для этого нужно зайти в меню «Вставка\Слой» . Появится прямоугольная область с синей границей (см. рис. 17). Перенесите её в требуемое место. Теперь вы можете в слое писать текст поверх рисунка.

Рисунок 17. Использование слоя

Оформление узла

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

Форматирование

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

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

Свойства страницы

Окно «Свойства страницы» позволяют отформатировать элементы страницы и подготовить страницу к публикации.

Для того чтобы открыть окно свойств страницы , требуется в режиме конструктора щелкнуть в любом месте страницы и в контекстном меню выбрать «Свойства страницы» .

В данном окне 6 закладок.

На закладке «Общая» (см. рис. 20) отображается основная информация о странице. При публикации особый интерес представляет поле «Ключевые слова» . По словам, введенным в данное поле, будет осуществляться поиск поисковыми серверами.

Рисунок 20. Свойства страницы: Общие

На закладке «Форматирование» (см. рис. 21) имеется возможность настроить цвета для всех основных элементов на странице.

Рисунок 21. Свойства страницы: Форматирование

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

Рисунок 22. Настройка эффекта выделения гиперссылок

Иногда редактор по умолчанию выбирает неправильную кодировку. В этом случае в браузере вместо слов на русском языке отображаются непонятные символы. Чтобы этого избежать требуется поля на закладке «Язык» настроить, как показано на рис. 23.

Рисунок 23. Настройка языка и кодировки

Стили

Можно создать собственные стили. Для этого нужно зайти в меню «Формат\Стиль» . Стили можно присваивать отдельным элементам HTML-разметки либо создавать пользовательские стили, которые в дальнейшем могут быть применены к выбранным элементам. Например, чтобы все ссылки по умолчанию были зеленые, нужно выбрать тег A, создать стиль, ввести имя, нажать кнопку «Формат» , выбрать пункт «шрифт », в окне выбрать зеленый цвет (см. рис. 24).

Рисунок 24. Создание стиля для тега A

Если нужно, чтобы не все, а только некоторые ссылки были определенного цвета, нужно создать и настроить пользовательский стиль (класс) (см. рис. 25).

Рисунок 25. Создание класса

В окне «Стиль » будут представлены все созданные стили (см. рис. 26).

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

Рисунок 26. Список созданных стилей

Таблицы стилей

Можно использовать готовые таблицы стилей, в которых уже прописаны стили для каждого элемента. Для этого нужно создать новую страницу (не узел), используя один из шаблонов таблиц стилей. Выбрать меню «Файл/Создать», затем в появившейся справа панели выбрать пункт «Другие шаблоны страниц …», в появившемся окне выбрать закладку «Таблицы стилей», после чего выбрать один из шаблонов (см. рис. 27).

Рисунок 27. Шаблоны таблиц стилей

После создания страницы, она должна быть сохранена в папке веб-узла, а затем связана с веб-страницей («Формат\Связи с таблицами стилей») (см. рис. 28) .

Рисунок 28. Связь с таблицей стилей

Динамические эффекты

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

В разделе 5.1.1 Свойства страницы уже было рассмотрено формирование эффектов выделения для гиперссылок.

Смена страниц

Смена страниц позволяет выбрать динамический визуальный эффект, запускаемый при загрузке текущей страницы: Появление сверху, снизу, жалюзи вертикальные, ... Для выбора эффекта надо зайти в «Формат\Смена страниц» . Здесь вы сможете подобрать понравившийся вам эффект и настроить длительность.

Эффекты DHTML

Простейшие эффекты (например, смена цвета ссылки при наведении курсора) можно настроить на панели «Эффекты DHTML ». Для этого сначала требуется отобразить эту панель инструментов («Вид\ ...»).

Например: чтобы заменять картинку по щелчку мыши, нужно выделить картинку, выбрать событие «Щелчок », действие «Замена » и рисунок (см. рис. 29).

Рисунок 29. Создание эффекта DHTML

Поведение

Если описанных возможностей недостаточно, можно воспользоваться панелью «Поведение» («Формат\Поведение» ). Здесь можно практически для любого блочного элемента выбрать действие, которое должно запускаться, и событие, при котором это действие запускается.

Работа с данным инструментом строится следующим образом:

1. В представлении «Страница» нажмите в нижней части окна документа кнопку «Конструктор» .
2. В меню «Формат» выберите команду «Поведение» .

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

1. В панели задач «Поведение» нажмите кнопку «Вставить» , затем выберите требуемое действие.
2. В появившемся диалоговом окне выберите необходимые параметры и нажмите кнопку «OK» .

6. Чтобы выбрать событие, в группе «События» выделите событие по умолчанию, затем выделите требуемое событие.

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

Публикация узла

Перед публикацией необходимо проверить текст на наличие орфографических ошибок («Сервис\Орфография или F7» ).

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

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

Иногда возникает необходимость в создании копии веб-узла и сохранении этой копии в определенном расположении на жестком или на сетевом диске. Средство публикации Microsoft FrontPage предоставляет удобный способ создания такой копии.

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

Перед публикацией нужно сначала ввести ключевые слова в окне «Свойства страницы».

Для публикации зайдите в пункт меню «Файл\Опубликовать узел» . Появится окно, в котором вы сможете указать, как и где публиковать узел (см. рис. 30). Если вы выкладываете узел в Интернет, удобнее использовать «протокол FTP» (он поддерживается практически всеми серверами). Если узел размещается в локальной сети или тем более на том же компьютере, следует выбрать пункт «Файловая система» .

После этого зайдите в пункт «Оптимизация HTML» – данная опция позволяет значительно сократить код и размер веб-страниц за счет удаления примечаний, комментариев и прочей служебной информации, не влияющей на возможности узла.

Рисунок 30. Публикация узла

Порядок выполнения работы

Результатом работы должен стать созданный студентом сайт с удобной системой навигации, содержащий всевозможные элементы гипертекста (текст, ссылки, изображения, фотоколлекции, бегущую строку и прочее), а также динамические эффекты и форму обратной связи. Минимальное число страниц сайта определяется числом студентов, участвующих в его разработке: 8 – для одного, 10 – для двоих, 12 – для троих .

2.1 Работа, выполняемая студентом самостоятельно до начала работы в компьютерном классе

1. Разработать структуру сайта по выбранной вами тематике (показать диаграмму страниц сайта и связей между ними письменно либо в электронном виде). Пример структуры см. в главе «Разработка структуры сайта» на стр. 8.

2. Подготовить содержание сайта: текстовые материалы, таблицы, изображения. (Должны быть представлены текстовые документы и файлы изображений).

Требования к форме представления результатов работы

Результаты работы предъявляются в виде веб-узла (папки со страницами сайта) и отчета. Отчет может быть предъявлен в электронном либо распечатанном виде.

Структура отчета представлена ниже.

Титульный лист

Цель работы

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

Задания

Создать сайт на тему <указать тему>

<Остальные задания взять из параграфа «Работа в компьютерном классе » (см. стр. 24)>

Структура сайта

<Вставить скриншот из представления «Переходы».>

<Представить скриншоты всех страниц сайта с кратким описанием назначения страниц и хода их разработки>

Выводы

<Перечислить действия, выполненные и освоенные в ходе работы.>

Литература

1. http://www.microsoft.com/rus/office/FrontPage/Default.mspx - Общие сведения о FrontPage 2003

2. http://www.microsoft.com/rus/smallbusiness/products/howto/buildwebsitefrontpage.mspx - Создание веб-узлов с помощью FrontPage 2003

3. Microsoft FrontPage 2003. Русская версия – М. Эком, 2005

ВВЕДЕНИЕ

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

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

Задания приведены на странице 24. Их предваряют теоретические сведения, описывающие основные элементы интерфейса, возможности, инструменты MS Frontpage и приемы работы с ними.

В рамках самостоятельной работы студентов предусматривается подготовка к лабораторной работе, которая состоит в ознакомлении с материалами пособия, продумыванию тематики и структуры сайта, подготовке содержимого для наполнения сайта в ходе работы (текстовые материалы, изображения).

Теоретические сведения

Интерфейс Microsoft FrontPage 2003

FrontPage представляет собой WYSIWYG – редактор HTML (what you see is what you get - что видите, то и получаете). Это означает, что в браузере веб-страницы будут выглядеть так же, как и в редакторе.

Работа в редакторе Frontpage весьма похожа на работу с текстовым процессором, подобным Microsoft Word. Интерфейсы двух редакторов, как и всех приложений, входящих в пакет Microsoft Office, во многом схожи: те же стандартные кнопки, практически те же пункты в главном меню, соответственно те же основные элементы: текст, гиперссылки, изображения, таблицы, диаграммы, прочие объекты. Форматирование (настройка шрифта, отступов и прочее) осуществляется примерно так же, как и в Microsoft Word. Предполагается, что читатели уже обладают базовыми навыками использования этих элементов. Поэтому вопросы добавления основных элементов гипертекста на страницу и их форматирование будут рассмотрены лишь поверхностно.

Несмотря на значительное сходство с Word, Frontpage является профессиональным программным продуктом для создания сайтов, что определяет существенные отличия.

Если Word предназначен для работы с отдельным документом, то Frontpage – для работы с целым веб-узлом, состоящим из многих файлов и папок. Наличие во Frontpage представлений «Список папок» и «Переходы» облегчает поиск и переход от одной страницы к другой и формирование связей между ними. Инструмент «Общие границы» позволяет выделять на всех (или определенных) страницах часть пространства, элементы на которой совпадают. Таким образом, добавив или изменив изображение или меню из ссылок на одну из страниц в этих общих участках страницы, эти изменения автоматически отобразятся на всех остальных. Это значительно облегчает работу по формированию заголовочной области («шапки») страницы и главного меню. Панели ссылок упрощают формирование меню ссылок, а объявления позволяют автоматически писать заголовок страницы. Динамические эффекты позволяют создавать визуальные эффекты, такие как: изменение изображения по щелчку мыши, изменение цвета ссылки при наведении курсора, или эффектное появление содержимого страницы при загрузке.

Рисунок 1. Интерфейс FrontPage

На рис. 1 представлен интерфейс редактора Microsoft Frontpage 2003 .

Сверху окна располагается главное меню. Под ним панели инструментов.

Слева представление Список папок. Справа основное окно редактора веб-страницы.

Для работы со страницей существует 4 основные режима (указаны в строке внизу страницы):

«Конструктор». Основной режим. В данном режиме можно добавлять, изменить, удалять элементы. При этом их положение на страницы будет такое же, как в браузере.

«Код». HTML-код страницы.

«С разделением». Совмещение предыдущих режимов. Разделяет окно на 2 части: в одной конструктор, в другой HTML-код.

«Просмотр». Запускает просмотр страницы, близкий к просмотру в браузере. Часть элементов на странице могут не работать, поэтому зачастую удобнее просматривать страницу непосредственно в браузере. Для этого на панели инструментов есть пиктограмма с изображением лупы над страницей.

Главное меню

Главное меню состоит из пунктов:

«Файл». Обеспечивает работу с файлами: создание, открытие и сохранение веб-страниц и веб-узлов целиком, публикацию узла, экспорт и импорт

«Правка». Обеспечивает стандартные возможности правки

«Вид». Позволяет выбирать представление страниц узла. Наиболее интересны пункты: «Папки», «Список папок» для работы с отдельными файлами и папками узла, «Переходы», «Область переходов» для настройки структуры страниц в узле. Здесь также можно настроитьПанели инструментов.

«Вставка». Обеспечивает возможность вставки элементов в веб-страницу. Наиболее важные пункты: «Слой», «Панель ссылок», «Веб-компонент», «Форма», «Рисунок», «Меняющаяся кнопка», «Закладка», «Гиперссылка».

«Формат». Меню форматирования. Содержит возможности форматирования шрифта, абзацев, выбора темы, настройки стилей и общих границ.

«Таблица». Меню для работы с таблицами, в том числе макетными.

В главном меню также есть окна: «Сервис», «Данные», «Рамки», «Окно», «Справка».

1.1.2 Панели инструментов

Основные панели инструментов редактора MS FrontPage представлены нарис. 2 . Чтобы включить/выключить ту или иную панель, требуется зайти в пункт меню «Вид/Панели инструментов» либо щелкнуть правой кнопкой мыши по одной из панелей редактора и выбрать нужную панель.

Рисунок 2. Список панелей инструментов

Microsoft Front Page представляет собой полнофункциональное средство создания эффективно работающих Web –узлов, а так же детального и гибкого управления ими. Это приложение предоставляет широкие возможности импорта, редактирования и форматирования HTML файлов. Доступ ко всем этим функциям осуществляется с помощью удобного интерфейса, хорошо знакомого пользователям пакета Microsoft Office.

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

FrontPage содержит множество функций, сведенных вместе в одном рабочем пространстве. Рабочее пространство FrontPage делится на несколько экранных областей: слева находится панель режимов, а справа от нее – список папок. С помощью панели режимов можно простым нажатием соответствующей кнопки перейти от одного режима отображения Web-страницы к другому.

Существует несколько режимов работы в FrontPage.

1. Режим Folders используется для работы с отдельными файлами и папками. Он позволяет удалять перемещать и переименовывать файлы и папки, также просматривать структуру файлов Web-узла.

Front Page может работать с графическими файлами различных форматов: *.BMP; *.TIF; *.WMF (метафайлы WINDOWS); *.RAS (Sun Raster); *.EPS (инкапсулированный Postscript); *.PCX (Paintbrush); *.TGA (Targa) конвертируя их в форматы публикаций *.GIF и *.JPG. По умолчанию Front Page импортированные форматы сохраняет в формате GIF.

2. Режим Page предназначен для создания и редактирования отдельных страниц. Данный режим позволяет вставлять изображения, таблицы, гиперссылки, а также оформлять страницы с помощью различных стилей и макетов. Функция «Ярлыки страниц» позволяет упростить одновременное редактирование нескольких страниц. Переключение с одной страницы на другую осуществляется посредством ярлыков и производится одним щелчком мыши.

Для редактирования страниц применяются три режима: Normal (Обычный), HTML и Preview (предварительный просмотр). Работа в режиме Normal позволяет нам видеть страницу, так как она представлена на экране монитора. В режиме HTML производится редактирование кода HTML-страницы. Режим Preview позволяет видеть страницу в том виде, в котором она действительно будет выглядеть в Web-браузере (Internet Explorer.)

Создать сайт во Front Page можно тремя способами: при помощи мастера (wizards), шаблона (templates) или на основе готовых файлов. Шаблоны представляют собой встроенные страницы, содержащие необходимое форматирование для создания и настройки создаваемых страниц. Мастера и шаблоны позволяют создавать сайты различных типов.

При открытии в данном режиме Web-узла на экране появится новая пустая страница. Можно начать работу с чистой страницы, а можно использовать для работы один из готовых шаблонов. Для этого необходимо выбрать File - New - Page. В окне вкладки Web Sites (Web-сайты) вы видите несколько вариантов создания сайта:

Мастер Discussion web- сайты предназначаются для ведения обсуждений.

Мастер Import Web-сайт создаётся на основе готовых файлов.

Мастер Corporate Presence-для создания сайта компании.

На вкладке Frames Pages (страницы фреймов) перечислены шаблоны фреймовых схем. Фреймы – это многостраничные схемы, где окно браузера делится на несколько подстраниц. В диалоговом окне New на вкладке Style Sheets приведены шаблоны каскадных таблиц стилей.

Создать материал для Web-узла можно путем импортирования его из другого источника, причем импортировать можно не только отдельный файл, но и целую папку и даже Web-узел. Для этого необходимо вывести на экран диалоговое окно Import и выбрать File –Import. Импортируемые файлы или папки можно изменять путем нажатия кнопки Modify.

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

FrontPage предоставляет возможности форматирования таблиц: автоформатирование, автозаполнение и разделение. Функция Table Autoformat (Автоформат таблицы) позволяет быстро создать на сайте таблицу профессионального качества. Для того чтобы применить данную функцию, щелкните мышью по любой таблице, редактируемой в приложении FrontPage, а затем выберите команду TablegTableAutoformat и выбрать нужный стиль, который автоматически определяет тип границ, тени и цвета, используемые при форматировании таблицы. Функция автоматического заполнения таблицы позволяет скопировать один и тот же элемент в несколько ячеек. Для этого нужно выделить строку и выполнить команду TablegFillgRight (Заполнить вправо). Аналогично можно заполнить ячейки, расположенные снизу, использовав команду TablegFillgDown (Заполнить вниз). Функция разделения таблицы позволяет в любом месте разделить одну таблицу на две.

3. Режим Reports дает возможность получить полный набор табулированных отчетов о состоянии Web-узла. Например, узнать количество страниц на Web -узле; его общий размер; недавно добавленные, измененные или старые страницы, нуждающиеся в обновлении; файлы к которым нет ссылок в пределах узла; нарушенные ссылки на другие страницы в текущем и других узлах; незавершенные страницы с назначенными авторами и статусом отображения каждой страницы и др. Таким образом, с помощью этого режима можно отследить проблемные области и исправить их, используя соответствующую панель инструментов.

4. Режим Navigation определяет параметры перемещения пользователей по Web-узлу и показывает структуру Web-узла. С помощью данного режима можно поменять расположение страниц в Web-узле, перетащив страницу из папки и переместив ее в нужное место; удалить страницу из Web-узла или добавить внешнюю связь к структуре. При изменении заголовка страницы с помощью режима Navigation, он автоматически будет отображен на странице, без необходимости дальнейшего редактирования.

5. Режим Hyperlinks (гиперссылки) дает возможность просмотра связей между страницами Web-узла. Гиперссылка - это текст или изображение на Web-странице, при щелчке на котором происходит переход к другой Web-странице или сайту. Front Page имеет несколько вариантов создания гиперссылок. Например, разместить все гиперссылки на одной главной странице или создать навигационную панель(navigation bar), которая автоматически создаёт и отображает гиперссылки на страницы вашего сайта.. навигационная панель легка в использовании, она имеет некоторые недостатки:

1. Навигационная панель содержит только определённые ссылки, которые вы можете только настроить и не более.

2. Панель навигации не будут работать до тех пор, пока вы не создадите структуру сайта.

Также можно создать и интерактивную карту (image map), представляющую собой рисунок с активными участками (hotspots), являющимися ссылками, на которых пользователь с помощью щёлчка мыши, переходит к нужной странице.

Просмотр связей между страницами Web-узла выполняется в диалоговом окне Create Hyperlink. Связи представлены в виде стрелок, поэтому оборванная стрелка обозначает нарушенную связь. Чтобы исправить нарушенную связь необходимо перейти в режим Broken- Hyperlink, щелкнуть правой клавишей мыши на нарушенной ссылке и выбрать Edit-Hyperlink. Все нарушенные ссылки будут автоматически исправлены.

В режиме Hyperlinks по умолчанию будут показаны не заголовки страниц, а имена их файлов. Это легко исправить, воспользовавшись одной из команд контекстного меню. Так, с помощью команды Show Page Titles вместо имен файлов будут показаны заголовки страниц, а, используя команду Hyperlinks to Pictures, можно отобразить гиперссылки на графические файлы. Команда Repeated Hyperlinks позволяет отобразить повторяющие гиперссылки, то есть все связи страницы с одним и тем же файлом. Для отображения ссылки на закладки внутри одной страницы используют команду Hyperlinks Inside Page.

Лучшие закладки – это заголовки разделов. Чтобы создать закладку, следует открыть страницу и выделить текст, на который требуется установить ссылку. Имя закладки вводится в диалоговом окне Bookmark, путем выбора Insert-Bookmark (вставка-закладка). С помощью данного диалогового окна можно также осуществлять удаление закладки. Чтобы создать одновременно и закладку и гиперссылку, необходимо щелкнуть правой кнопкой мыши на выделенном тексте будущей закладки и, удерживая ее нажатой, перетащить текст в место, где должна находится гиперссылка. После этого выберите в контекстном меню Link Here (создать ссылку). FrontPage автоматически создаст закладку и вставит на нее гиперссылку, в которой используется текст закладки.

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

Во FrontPage существует также возможность соединяться с другими Web-узлами и FTP-серверами, для этого нужно знать URL соответствующего файла. При создании в Web-документе ссылки на файл в Интернете, необходимо выделить текст будущей ссылки и щелкнуть на кнопке Hyperlink, затем в диалоговом окне Create Hyperlink ввести полный URL или щелкнуть на кнопке обзора ресурсов, если URL неизвестен. В этом случае FrontPage автоматически запустит Web-браузер, с помощью которого указывается необходимый файл, и введет URL в соответствующее поле автоматически.

FrontPage является мощным инструментом для корпоративного использования, позволяя легко организовывать дискуссионные клубы, онлайновые опросы и списки, редактируемые из браузера. С помощью служб SharePoint Team Services можно быстро настроить сайт группы в Интранете, на котором участники группы могут сохранять, искать и совместно использовать данные, документы и Web-страницы.

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

Также на страницу можно добавить интерактивный опрос. Посетители могут отвечать на вопросы при помощи браузера и просматривать результаты опроса на автоматически генерируемых диаграммах. Добавление опроса задается командой FilegNewgSurvey (ФайлgСоздатьgОпрос).

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

6.7. Назовите основные компоненты и формы пакета FrontPage, определите понятие «режим WYSIWYG»

Microsoft Frontpage позволяет разрабатывать документы Web и управлять ими. Не только страницами Web, для работы с которыми имеется масса прекрасных программ, но документами Web (sites) в целом, т. е. наборами связанных страниц.

Frontpage состоит из трех основных компонентов:

1. Frontpage Explorer (Проводник) обеспечивает создание структуры документов Web, и предоставляет мастеров и шаблоны, которые позволяют это сделать всего за несколько минут. Если Web уже установлен, проводник дает визуальное представление всего документа Web и позволяет поддерживать его в дальнейшем;

2. Frontpage Editor (Редактор) позволяет создавать отдельные страницы

Web или редактировать ранее введенные страницы в режиме WYSIWYG "что видите, то и получаете"; Режим точного отображения "What You See Is What You Get". Принцип WYSIWYG - это принцип соответствия экранного образа готовому документу. В этом режиме автор непосредственно видит на экране готовый результат и работает с ним.

3. Frontpage Personal Web Server (Персональный сервер Web) обеспечивает проверку всех аспектов работы данного Web и его обслуживание в Internet.

Рис. 10.28. Диалоговое окно «Insert Table» Рис. 10.29. Создание таблиц в HTML-документе Рис. 10.30. Панель «Таблица» Рис. 10.37. Панель «Формы» Рис. 10.38. Примеры форм Рис. 10.39. Меню команды «Form Field» Рис. 10.44. Пример титульного листа типовой Web-страницы Рис. 10.45. Диалоговое окно «Marqueе Properties» Рис. 10.46. Диалоговое окно для создания кнопки Рис. 10.47. Диалоговое окно вставки таблицы Рис. 10.48. Диалоговое окно «Select File» Рис. 10.49. Диалоговое окно «Создание гиперссылки»

Программный пакет FrontPage был разработан компанией Vermeer Technologies, известной своими разработками стандартных графических средств представления и размещения информации в WWW. Microsoft приобрела этот пакет и включила его в состав MS Office.

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

При его создании разработчики полагали, что у пользователей не хватает времени или опыта для того, чтобы разбираться в тонкостях языка HTML. Поэтому в данной программной среде пользователю предоставляется возможность собирать Web-страницу из готовых компонентов в том виде, в каком она появится на экране браузера. На программу возложены функции генерирования соответствующих управляющих кодов HTML. Фактически задача создателя сайта при работе в этой программе сводится к подбору материалов и форматированию текста. Тем самым публикация материалов в Internet стала доступной для непрофессионалов. С другой стороны, и у специалистов меньше времени стало уходить на написание кодов стандартных операций.

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

Программный пакет FrontPage поставляется с несколькими дополнительными утилитами, вместе составляющими так называемый FrontPage Bonus Pack:

Microsoft Image Composer, графический редактор, предназначенный для создания изображений для Web-сайта и манипулирования ими. Утилита содержит различные эффекты для обработки изображений и более 200 Мбайт электронных фотографий, которые можно использовать.

Microsoft Personal Web Server (Персональный Web-сервер Microsoft), версия Internet Information Server (US, Информационный сервер Internet), работающая под Windows 9.х и Windows NT Workstation. От FrontPage Personal Web Server (Персонального Web-сервера FrontPage), входящего в состав собственно FrontPage, Microsoft Personal Web Server отличают более высокая производительность и наличие дополнительных возможностей.

Web Publishing Wizard (Мастер публикации в WWW), который позволяет размещать Web-сайты у провайдера или в онлайновых службах. Обычно этот мастер используется для серверов, не поддерживающих серверные расширения FrontPage (FrontPage Server Extensions).

В FrontPage используется графический FrontPage Explorer для создания, просмотра и сопровождения Web-сайтов, а также для размещения их на компьютере, в локальной сети или Internet. FrontPage Explorer содержит команды для администрирования Web-сайтов FrontPage, проверки, просмотра и управления гиперссылами (URL).

Программный пакет Microsoft FrontPage, по определению разработчиков, предназначен для создания и сопровождения Web-узлов. Он может быть использован для эффективной разработки и построения динамичного Web-узла.

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

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

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

FrontPage может как создавать новые страницы, так и редактировать подготовленные ранее HTML-документы. Web-cтраницы можно рассматривать в режиме WYSIWYG, в виде разметки HTML-кода и в виде предварительного просмотра (подобного окну браузера). Помимо этого имеется возможность загрузки Web-страницы в браузер для предварительного просмотра (обычно Internet Explorer).

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

Форматирование текста . Пакет FrontPage предоставляет возможности настройки гарнитуры символов текста, их цвета и размера (кегля). Большинство параметров оформления можно изменять, используя кнопки на панели инструментов.

В программе поддерживается набор функций форматирования абзацев: установка интервала и центровки, отступов и т.д. Имеется выбор форматирования стилей списков.

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

Возможно несколько вариантов размещения таблицы стилей:

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

Внутренняя таблица стилей. Таблица включается в код страницы. Определенные в ней стили относятся только к одной странице.

Встроенный стиль. Действие стиля распространяется только на отдельные элементы страницы и определяется в открывающем теге документа.

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

Ссылки . Предоставляется возможность использования закладок (переходов по ссылке внутри текста страницы), позволяющая пользователям перемещаться между разделами текста. Дополнительно задан интерфейс поиска закладки.

Программный пакет FrontPage поддерживает несколько видов ссылок:

Ссылки на URL-адрес (можно ввести адрес вручную или выбрать из имеющихся ссылок). При работе с гиперссылками предоставляется возможность перетаскивания URL-адреса из проводника или браузера на разрабатываемую страницу.

Ссылки на адрес электронной почты. Этот тип ссылок позволяет посетителям Web-сайта отправить сообщение по какому-либо конкретному адресу, заданному в ссылке. После ее выбора открывается окно составления сообщения в программе электронной почты.

Возможно дополнительное указание закладки внутри ссылки (в диалоговом окне создания ссылки указывается наименование закладки), а также вывод страницы (или файла) ссылки в отдельном кадре (фрейме).

Следует отметить, что код, записанный в стандартном представлении URL-адреса, автоматически преобразуется в гиперссылку.

Таблицы . FrontPage имеет удобный механизм построения таблиц. Таблицу можно задать с помощью меню Table . В Редакторе также существует панель рисования таблиц, из которой при помощи инструментов Карандаш и Ластик можно соответственно рисовать и стирать ячейки таблицы. В Редакторе предусмотрены такие механизмы работы с таблицами, как удаление, вставка и объединение ячеек, установка выравнивания (вертикального и горизонтального) данных внутри таблицы, заливка ячеек определенным цветом.

Таблицы Excel и диаграммы Microsoft Office также могут быть встроены в Web-страницу.

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

Изображения . Важным вопросом является представление изображений в Web-страницах. В FrontPage предусмотрена процедура вставки как стандартных картинок из библиотеки (clip art), так и изображений из графических файлов (используются форматы: *.gif, *.jpg, *.bmp, *.tif, *.wmf, *.ras, *.pcx, *.pcd, *.tag, *.eps). После вставки изображения выводится панель с кнопками опций редактирования изображений. К ним относятся функции расположения изображения относительно соседних объектов, размещения текста на изображении, поворота и симметричного отображения картинки, управления яркостью и контрастностью, получения фрагмента, восстановления первоначальных параметров, задания рамки.

Клиентские карты изображений . Особое внимание следует обратить на механизмы создания гиперссылок с помощью изображения. Возможно автоматическое создание уменьшенной копии (thumbnail) для предварительного просмотра изображения. Редактор в этом случае автоматически формирует гиперссылку на исходный файл изображения и представляет на странице уменьшенную копию.

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

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

Когда посетитель Web-страницы заполняет форму и делает щелчок по предлагаемой кнопке, данные отправляются в программу на сервере. Программа сервера должна существовать. Без нее информация просто не будет сохранена. При поступлении данных программа сервера их обрабатывает. Обработка может быть простой, например сохранение данных в файле, или сложной, такой, как сортировка, расчеты по предоставленным данным или передача подтверждения об отправке информации. Стандарт программирования, который определяет, как посетители взаимодействуют с Web-узлом, назван CGI - Common Gateway Interface (общий интерфейс шлюзов). Программы сервера, имеющие дело с входной информацией типа форм, называются скриптами CGI и написаны в соответствии со спецификациями CGI. Без помощи пакета FrontPage (или аналогичного) приходится писать CGI-скрипт для управления формами и устанавливать его на Web-сервере. Однако многие провайдеры Internet не разрешают устанавливать пользовательские скрипты на своих серверах.

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

Формы можно создавать в FrontPage только в том случае, если у разработчика установлен Personal Web Server. Формы FrontPage можно создать с помощью Мастера форм, путем разработки собственной пользовательской формы и с помощью шаблона.

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

однострочное текстовое поле (One-line text box);

прокручивающееся текстовое окно (скроллинг);

флажки (Checkbox);

переключатели (Radio button);

раскрывающееся меню (Drop-down menu);

нажимающиеся кнопки (Push button);

графические кнопки (Image).

Для придания странице динамичности используются бегущие строки. Предусмотрен элемент marquee (бегущая строка).

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

Microsoft FrontPage предназначен для создания и последующего администрирования Web-узлов сетей Internet/Intranet. Microsoft FrontPage состоит из двух модулей: FrontPage Explorer и FrontPage Editor.

Модуль FrontPage Explorer предназначен для:

создания Web-узла;

установления прав доступа;

организации файловой структуры Web-узла;

запуска FrontPage Editor для редактирования страниц.

По окончании процесса создания Web-узла данный модуль используется для его размещения на сервере в сети Internet/ Intranet.

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

Особенностями модуля FrontPage Explorer являются:

На рис. 10.1 приведено рабочее окно FrontPage Explorer.

Интерфейс программного пакета FrontPage выдержан в стиле других приложений Microsoft Office. Он имеет многостраничное окно документа с указателями страниц, окно с пиктограммами основных разделов проекта, панели инструментов, плавающие меню и т.д. Для большинства объектов поддерживается метод перетаскивания (drag and drop) между окнами и панелями. Предусмотрены возможности управления составом панелей.

FrontPage построен как SDI-приложение (Single Document Interface - в окне программы отображается только текущий документ). Для каждого вновь открытого документа формируется свое рабочее окно.

Рабочие окна программного пакета . После запуска программы на экран выводится исходное рабочее окно программного пакета. На рис. 10.4 приведено рабочее окно, формируемое приложением после начала работы по умолчанию. В этом окне представлен HTML-код, создаваемый по умолчанию для каждой новой страницы.

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

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

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

Внизу, на статусной строке визуализируется расчет скорости загрузки страницы при удаленном соединении с Web-сайтом для определенных условий (скорости или типа соединения). Разработчику Web-сайта приходится искать компромисс между объемом передаваемой информации и возможностями канала связи. Полноцветная графика, звук, видео могут сделать Web-сайт привлекательным, но если пользователю придется ждать длительное время загрузки страницы через низкоскоростной модем, то эффект может быть совершенно иным. Можно задать параметры связи, по которым программа будет тестировать скорость загрузки.

Если выбрана страница HTML, пользователь может создавать разметку страницы вручную. Как правило, в этот режим документ переводится, когда создание визуального образа уже закончено и нужно задать дополнительные настройки, отредактировать выполнение скриптов и т.д. Управляющие теги выделяются цветом. Для каждого тега можно вывести всплывающее меню с набором его свойств. Свойства тега можно также задать с помощью команды Tag Properties .

На рис. 10.6 приведен вид рабочего окна в режиме работы с HTML-кодом.

Режим Preview служит для просмотра документа в том виде, как он будет выглядеть в окне браузера. Просмотр в Preview не должен быть единственным контролем проделанной работы. Необходимо тестирование работы Web-сайта в основных браузерах.

Для управления содержимым проекта - иерархией папок и составом файлов - служит рабочее окно, выводимое с помощью пиктограммы Folders панели Views (рис. 10.7).

В списке слева перечисляются подпапки в составе основной папки Web-сайта. В основной части окна представлен список файлов с группировкой по подпапкам. Каждый файл сопровождается комментариями, в которых приведены сведения о типе файла, времени его модификации, авторе и дополнительные пояснения. Подпапки могут быть преобразованы в дочерние Web-сайты. В этом случае в список папок будет добавлена запись о дочернем Web-сайте (subweb).

При работе на Web-сайте могут потребоваться самые разные отчеты о состоянии работы. Отчеты представлены в специальном окне (рис. 10.8), выводящемся при нажатии на пиктограмму Reports панели Views . В списке присутствуют следующие отчеты:

All files (список всех файлов в составе Web-сайта).

Pictures (список графических файлов в составе Web-сайта).

Unlinked files (файлы, недостижимые из основной страницы Web-сайта).

Linked files (файлы, достижимые из основной страницы Web-сайта).

Slow Pages (страницы, скорость передачи которых превышает предел (например, 30 с для скорости 28,8 Кбит/с).

Older files - файлы, созданные ранее последних 72 дней.

Recently added files - файлы, добавленные в течение последних 30 дней.

Hyperlinks - список всех гиперссылок.

Unverified hyperlinks - неподтвержденные гиперссылки.

Component errors - список файлов, в которых возникают ошибки представления компонентов.

Uncompleted tasks - список незавершенных заданий.

Unused themes - список неиспользованных декораций.

В каждом из списков можно перейти непосредственно к редактированию того или иного объекта, щелкнув мышью на соответствующей записи.

При разработке Web-сайта важно иметь представление о характере переходов между страницами. Топологию сайта можно оценить при помощи страницы карты навигации Navigation панели Views (рис. 10.9). На карте каждая страница представляется в виде прямоугольника, с названием. Страницы на схеме можно разделить на страницы-родители (страницы, с которыми связаны страницы-потомки более низкого уровня); страницы-потомки (связанные с родительскими страницами графическими или текстовыми гиперссылками); страницы-братья (страницы, имеющие общих родителей).

На схеме гиперссылок FrontPage (рис. 10.10) демонстрирует графическое представление ссылок между фрагментами Web-сайта. Экран разделяется на две панели - список файлов и схему ссылок. На схеме отображается характер ссылок в виде значков. Конверт обозначает возможность посылки электронной почты прямо со страницы; рисунок - графический файл; глобус - внешнюю ссылку; разорванная ссылка - адрес ссылки задан неправильно; треугольник с восклицательным знаком - ошибка в задании компонента. На схеме также показаны пиктограммы типов файлов Microsoft Office, на которые ссылаются страницы

Сегодня проекты становятся все более сложными. Поэтому разработчику необходимо представлять объем работ, который предстоит выполнить, а также выстроить продуманную последовательность действий при создании Web-сайта. С другой стороны, разработка Web-сайтов ведется, как правило, рабочей группой, членам которой нужно координировать свои действия. В связи с этим предусматривается ведение списков заданий.

FrontPage предлагает режим Tasks View (перечень заданий). Проводник формулирует перечень заданий для каждого Web-сайта, создаваемого в FrontPage, и предоставляет этот список в распоряжение всех авторов, принимающих участие в работе. Программный пакет не только позволяет записать все эти задания, но и избавляет от необходимости их упорядочивать. Каждое задание сопровождается его описанием, приоритетом, конкретным исполнителем и т.д.

Окно (рис. 10.11) открывается по нажатии пиктограммы Tasks или при выборе в меню View Проводника опции Tasks .

В окне выводится список заданий, состоящий из следующих полей:

Status - состояние заданий (красный маркер - не выполнено, зеленый - выполнено),

Task (Задание) - содержит описание задания,

Assigned To (Кому предназначено) - показывает ответственных за выполнение каждого из заданий,

Priority (Приоритет) - указывает приоритет задания: high (высокий), medium (средний) или low (низкий),

Associated With (Связано с) - имя страницы или файла, требующих редактирования для выполнения задания,

Modified Date (Дата изменения) - дата последнего изменения задания,

Description (Описание) - описание каждой задачи.

Главное меню программного пакета . Главное меню программы выполнено в виде стандартного меню Microsoft Office 2000 и включает десять команд: File , Edit , View , Insert , Format , Tools , Table , Frame , Windows , Help .

В меню File объединены функции управления файлами и проектами, создания Web-сайта и отдельной Web-страницы, их сохранения, закрытия, печати и выхода из программы. Например:

New/FrontPage Web - создание нового Web-сайта.

New/Folder - создание нового каталога в существующем сайте.

Open FrontPage Web - открытие существующего Web-сайта для просмотра или редактирования.

Close FrontPage Web - закрытие текущего Web-сайта.

Publish FrontPage Web - перенос текущего содержимого на другой Web-сервер или в папку.

Delete FrontPage Web - удаление содержимого текущего Web-сайта.

Import - импорт файлов или папок в текущий Web-сайт.

Export - экспорт документа в файл.

Page Setup - настройка параметров страницы при печати.

Print Preview - предварительный просмотр документа перед печатью.

Recent File - список файлов, изменявшихся в последнее время.

В меню Edit включены команды отмены совершенного действия, копирования объекта в буфер, вставки объекта, поиска и замены фрагментов текста, а также работы с заданиями. Состав этого меню наиболее близок к традиционным:

Cut - вырезать документ с помещением в буфер обмена.

Redo - отмена отмены.

Copy - скопировать документ в буфер обмена.

Paste - вставить документ из буфера обмена.

Delete - удалить документ.

Rename - переименовать документ (при этом автоматически изменяются ссылки во всех документах на переименовываемый объект для обеспечения целостности данных).

Open - открыть документ для редактирования (FrontPage Editor для HTML и т.д.).

Open with - открыть документ для редактирования с указанием типа редактора.

Add To Do Task - добавить элемент в список задач.

Bookmark - вставка/редактирование закладки.

Database - управление отбором данных из БД в документ.

Properties - просмотр свойств документа и т.д.

Меню View включает команды установки режимов работы, визуализации тегов, вид плавающих панелей:

Toolbar - включение/выключение панели инструментов.

Status Bar - включение/выключение строки состояния.

Format Marks - включение/выключение отображения символов форматирования.

Refresh - обновление информации в документе.

Hyperlink View - включение режима просмотра связей.

Folder View - включение режима просмотра структуры папок.

Hyperlinks to Images - включение/выключение режима просмотра связей документов с графическими файлами.

Repeated Hyperlinks - включение/выключение отображения повторяющихся связей.

Hyperlinks inside Page - включение/выключение режима отображения связей внутри документа.

Refresh - обновление отображаемой информации.

Меню Insert включает команды вставки элементов различных типов (разрыва, горизонтальной линии, символа, комментария, графического изображения, видеоизображения, фоновой музыки, текстового файла, управляющего компонента, гиперссылки, ActiveX, JavaScript, PowerPoint Animation, формы, даты и времени и т.д.), собранные в соответствующие подменю.

Меню Format объединяет опции форматирования, управления внешним видом страниц, установки стиля оформления, параметров шрифта и абзаца, настройки типа списка, управления эффектами, установки фонового изображения и т.д.

Меню Tools включает дополнительные функции управления свойствами проекта, проверки орфографии, установки свойств всего Web-сайта или отдельной страницы в его составе, а также рабочей средой FrontPage. С помощью этого меню осуществляется запуск FrontPage Editor.

Меню Table , Frames и Window включают специфические опции работы с таблицами, фреймами (кадрами) и окнами.

Некоторые опции указанных подменю поддерживаются меню более низкого уровня, так что получается иерархическая структура. Ниже, на рис. 10.12 приведено подменю Insert/Active Elements (Вставить/Активные элементы) .

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

Диалоговые окна . При работе с программным пакетом MS FrontPage многие опции требуют установки дополнительных настроек, для чего служат диалоговые окна. Помимо стандартных окон Microsoft Office (открытие и сохранение Web-сайта или объекта в составе сайта, окна со списком шаблонов и т.д.) в FrontPage используются и специальные диалоговые окна, среди которых следует отметить диалоговые окна задания свойств тегов, для каждого из стандартных тегов и некоторые другие.

В качестве примера на рис. 10.13 приведено диалоговое окно вставки таблицы (Insert Table ).

Наиболее часто используемые команды представлены в составе инструментальных панелей. Общий вид этих панелей идентичен панелям MS Office. Например, на рис. 10.14 приведен общий вид фрагмента инструментальной панели: перейти в FrontPage Explorer (), вставить компонент FrontPage (Insert FrontPage Component ), вставить таблицу (Insert Table ), вставить изображение (Insert Image ), создание или редактирование гиперссылки (Create or Edit Hyperlink ).

Окна Мастеров . Мастера в FrontPage построены так же, как и мастера в других приложениях Microsoft Office 2000. В качестве примера можно привести окно Мастера создания Web-сайта дискуссий, приведенное на рис.10.15.

Слева располагается изображение, характеризующее тот или иной шаг мастера. Под изображением находится индикатор состояния (полоса с указанием, какая часть мастера выполнена). Справа помещены поля настройки и комментарии. Кнопки на форме: Cancel (Отмена) , Back (Назад) , Next (Дальше) , Finish (Закончить) .

Использование . Этот программный модуль предназначен для разработки структуры организации Web-узла. Он предоставляет множество средств управления Web-страницей, в том числе проверку ссылок, управление графическими стилями и списком текущих задач, а также дает возможность (путем нажатия одной кнопки) публиковать на данном Web-узле либо всю информацию, либо лишь те страницы, которые претерпели изменения.

Фактически FrontPage Explorer (Проводник FrontPage) - это приложение в пакете программ FrontPage, использующееся для управления целым Web-узлом.

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

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

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

Создав узел, его можно перенести на сервер, выбрав команду File/Copy Web (в Explorer).

Создание нового узла . Для создания нового Web-узла (или, по терминологии FrontPage, нового Web) необходимо выбрать в меню File команду New Web FrontPage или щелкнуть по кнопке New Web на панели инструментов. Появится диалоговое окно, показанное на рис. 10.16. Из этого окна требуется выбрать один из двух режимов работы: открыть существующий Web-узел для продолжения работы или создать новый Web-узел. Если будет создаваться новый Web-узел, то после нажатия кнопки ОК на экране появляется диалоговое окно, представленное на рис. 10.17.

В этом окне можно выбрать один из шести предлагаемых шаблонов для Web-узла или один из двух Мастеров создания Web-узлов.

Диалоговое окно предоставляет возможность выбора между вариантами, различными по уровню сложности, - от Empty Web (пустой Web) до Corporate Presence Wizard (Мастер представления фирмы). Различие заключается в диапазоне возможностей.

Для того чтобы создавать Web-узел «с нуля», необходимо вы-брать опцию Empty Web (Пустой узел) . Пустой Web позволит получить Web-документ, в котором будет отсутствовать какая-либо информация.

Выбор опции Corporate Presence Wizard вводит в действие мастера (программное средство автоматизации), позволяющего получить заполненный Web-документ с помощью шаблонов страниц, разработанных специально для представления фирмы.

После выбора варианта Web-узла пакет предложит ввести в появившемся диалоговом окне имя и пароль, а затем в окне рис. 10.18 место размещения нового Web-сайта.

Шаблон личного Web-узла (рис. 10.19) поставляется уже сконфигурированным, с ссылками на страницы сотрудников и руководителей, а также ссылкой mailto (послать письмо).

Использование . Редактор FrontPage поставляется с тремя мастерами - Form Page (Страница с формами), Frames (Кадры) и Personal Home Page (Личная страница). Редактор использует свыше двадцати шаблонов (рис. 10.20).

В диалоговом окне шаблоны могут быть представлены в виде списка или иконок.

Если необходимо создать пустой документ, выбирается шаблон Normal (Обычный).

Для создания новой страницы нужно в FrontPage Editor активизировать команду File/New . Затем в раскрывшемся диалоговом окне New (рис. 10.20) выбрать тип шаблона или позицию Normal Page (Обычная страница) и нажать кнопку OK . В последнем случае на экране появится пустая страница, в правом верхнем углу которой находится мигающий курсор. Для размещения текста необходимо ввести его с клавиатуры или вставить из буфера. Редактор использует буфер обмена аналогично другим приложениям MS Office: можно вырезать или копировать любые фрагменты в других открытых в Редакторе страницах или из документов других программных приложений. Процедура традиционна: вырезаем или копируем нужный фрагмент в буфер, переходим в создаваемый документ и выполняем вставку. Удалить текст или другие элементы можно несколькими способами: выделив удаляемый фрагмент, можно затем нажать клавишу Del или активизировать команду Edit/Clear .

Для открытия страницы Web-сайта в FrontPage Editor исспользуется команда File/Open . При активизации этой команды раскрывается диалоговое окно Select File традиционной формы.

Установка свойств Web-страницы и Web-сайта . Для установки в Редакторе свойств страницы используется команда File/Page Properties (Свойства страницы) . В диалоговом окне Page Properties (рис. 10.21) помимо общей информации, например, названия страницы, устанавливаются такие параметры, как фоновый рисунок и фоновый звук, цвет фона, стандартные цвета текста и гиперссылок, поля страницы. Для редактирования свойств Web-страница должна быть открыта в FrontPage Editor.

В текстовом поле Title можно ввести или отредактировать название страницы; поле Base Location предназначено для задания необязательного базового URL-адреса страницы. Для установки ссылки на целевой фрейм этой страницы вводится его имя в текстовом поле Default Target Frame . В секции Background Sound (Фоновый звук) можно задать свойства фонового звука (звуковой файл можно проигрывать несколько раз или закольцевать, пока будет открыта страница).

На вкладке Margins можно задать верхний и левый отступы для страницы. Для этого задается флажок отступа и вводится размер отступа в пикселах.

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

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

Вкладка Language используется для задания кодировок. В окнах со списками доступных языков выбирается кодировка, используемая при сохранении HTML-документа, и кодировка, применяемая при его последующей загрузке.

Для задания свойств не отдельной страницы, а Web-сайта в целом нужно открыть диалоговое окно установок Web-сайта FrontPage Explorer (Tools/Web-settings ). В этом многофункциональном окне (рис. 10.22) можно задать различные параметры создаваемого Web-сайта.

На вкладке General приводятся название Web-сайта и сведения о нем (версия расширений сервера и версия самого сервера).

Вкладка Advanced содержит поле ввода со списком выбора языка скриптов, используемого по умолчанию (VBScript или JavaScript). Для демонстрации файлов скрытых папок следует вы-брать флажок опции показа файлов скрытых папок. Если требуется удалить временные файлы, следует нажать кнопку Delete Files .

Для выбора кодировки страницы по умолчанию нужно указать ее значение в поле со списком Default Page Encoding вкладки Language . В поле со списком Server Message Language этой же папки задается язык сообщений, возвращаемых сервером.

В панелях навигации употребляются разделы перехода к основной странице, на страницу вперед или назад и на уровень вверх. На вкладке Navigation можно задать названия разделов (по умолчанию заданы Home, Back, Next, Up). По нажатии кнопки Default ранее введенные значения заменяются на перечисленные выше.

Редактирование документа . После создания документа или загрузки его из существующего набора (Web) можно использовать многочисленные функции редактора для создания или редактирования страницы.

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

Панели инструментов Редактора . Рис. 10.23 иллюстрирует панели и инструментарий Редактора FrontPage. Многие из них похожи на кнопки панелей инструментов, которые существуют в других приложениях MS Office.

Редактор FrontPage предоставляет для создания документов ряд панелей инструментов. Нижняя полоска инструментов носит название панели форматирования.

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

С помощью опций меню View (Вид) можно сделать любую из панелей инструментов видимой или невидимой.

Форматирование текста . При форматирование текста можно использовать текстовые стили. Физические стили доступны через панель инструментов.

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

FrontPage в соответствии с правилами языка HTML исчисляет размер шрифта в уровнях. При этом наименьшему уровню соответствуют наименьший размер; например, первому уровню соответствует текст с размером кегля 8 пунктов второму уровню - 10 и т.д.

Для изменения размера шрифта нужно выделить участок текста, который необходимо изменить, а затем щелкнуть на кнопке увеличения (Increase Text Size ) или уменьшения (Decrease Text Size ) размера шрифта на панели инструментов. Можно также использовать команду Format/Font (Формат/Шрифт) , которая вызывает появление диалогового окна, приведенного на рис. 10.24.

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

Редактор предоставляет несколько дополнительных стилей (специальных стилей). Для их выбора используется вкладка Special Styles (рис. 10.25) приведенного выше окна.

Чтобы применить специальный стиль, следует его вы-брать, а затем нажать кнопку OK . Доступны следующие специальные стили:

Citation. Курсив, который может быть использован для выделения заголовков.

Sample. Шрифт пишущей машинки.

Definition. Используется для выделения терминов.

Blink. Делает текст мерцающим.

Code. Моноширинный шрифт, который обычно используется для представления кода программ.

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

Bold. Полужирный шрифт.

Italic. Простой курсив.

Keyboard. Моноширинный шрифт, который можно использовать, например, для ввода текста пользователем.

Напротив каждого флажка со стилем стоит соответствующий тег стиля. Возможно использование нескольких стилей одновременно.

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

Vertical Position (Вертикальная позиция)

диалогового окна

Font (вкладка Special Styles)

выбираются опции

Superscript (Верхний индекс)

или

Subscript (Нижний индекс)

.

Номера уровней соответствуют изменению высоты верхнего или нижнего индекса по отношению к основной строке.

Форматирование абзацев . Редактор FrontPage предоставляет возможность форматирования абзацев. Оно выполняется по аналогии с текстовыми редакторами.

Создание нового абзаца в процессе ввода текстовой информации осуществляется нажатием клавиши Enter.

По умолчанию новый абзац будет использовать стиль Normal (Обычный). Для установки иного стиля абзаца нужно сделать следующее:

Установить курсор там, где необходимо начать следующий абзац.

Выбрать пункт Paragraph (Абзац) в меню Format (Формат) . Выбрать новый стиль в диалоговом окне Paragraph Properties (Свойства абзаца) и нажать кнопку OK .

Тот же эффект можно получить в режиме редактирования, например:

Выделить абзац и для него описанным выше способом назначить новый стиль.

Щелкнуть правой кнопкой мыши в пределах абзаца и в появившемся контекстном меню выбрать пункт Paragraph Properties , выбрать в раскрывшемся диалоговом окне новый стиль и щелкнуть на кнопке OK .

Для задания отступа абзаца нужно установить курсор в пределах абзаца и нажать кнопку Increase Indent (Увеличить отступ) или кнопку Decrease Indent (Уменьшить отступ) на панели инструментов. Таким образом увеличивается или уменьшается отступ.

Для выравнивания абзаца по левой и правой границе и центрирования используются клавиши Align Left (Выключка влево) , Align Right (Выключка вправо) или Center (Выключка по центру) соответственно на панели форматирования. Эти кнопки могут использоваться как для позиционирования абзаца на странице, так и для размещения текста в ячейке таблицы.

Чтобы вставить разрыв строки, надо установить курсор там, где должен быть переход на следующую строку, а затем выбрать в меню Insert пункт Line Break (Разрыв строки). Появится диалоговое окно Break Properties (Свойства разрыва) (рис. 10.26).

В этом окне следует выбрать одну из следующих опций:

Normal line break (Обычный разрыв строки) . Добавление разрыва строк без сдвига текста, вне зависимости от наличия какого-либо графического изображения с левой или с правой стороны.

Clear left margin (До свободного левого края) . Если с левого края страницы располагается изображение, то строка после разрыва начнется ниже изображения, т.е. по чистому левому краю.

Clear right margin (До свободного правого края) . Если с правого края страницы располагается изображение, то строка после разрыва начнется ниже изображения, т.е. по чистому правому краю.

Clear both margin (До свободных границ с обеих сторон) . Если хотя бы с одного из краев страницы располагается изображение, то строка после разрыва начнется там, где поле страницы свободно.

Для вставки горизонтальной линии используется команда Insert/Horisontal Line . Появившаяся линия будет использовать те же параметры оформления, что и предыдущая горизонтальная линия, созданная при помощи Редактора FrontPage.

Для изменения цвета выделяется участок текста и нажимается кнопка Text Color (Цвет текста) на панели форматирования. В появившемся диалоговом окне Color (Цвет) (рис. 10.27) выбирается цвет из стандартного набора и нажимается кнопка OK . Для использования дополнительных цветов необходимо нажать кнопку Определить цвет (Define Custom Colors) , задать цвет и затем щелкнуть мышью на кнопке Add to Custom Colors .

Создание таблиц . Для того чтобы вставить таблицу, можно использовать команду Table/Insert Table или щелкнуть по кнопке Insert Table панели инструментов. На экране будет визуализироваться диалоговое окно

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

Для удаления разметки таблицы используется инструмент Ластик (вторая слева кнопка панели). Можно и автоматически вставлять столбец или строку в таблицу (кнопки Insert rows , Insert column ). Выделенные ячейки удаляются по нажатии кнопки Delete Cells .

Выделив несколько ячеек, можно объединить их в одну или разделить на части (кнопки Split Cells и Merge Cells ).

За способы выравнивания объектов в ячейках отвечают кнопки (Align Top - по верхнему краю ячейки, Center Vertically - по центру, Align bottom - по нижнему краю).

Выделенные ячейки можно выровнять по высоте (кнопка Distribute Rows Evenly ) или ширине (кнопка Distribute Rows Evenly ).

Заливка выбирается из выпадающего списка (кнопка Fill Color ).

Часто требуется ограничить размеры ячеек размерами объектов. Для этого используется кнопка Auto Fit .

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

Пакет FrontPage может осуществлять импорт изображений. При этом FrontPage поддерживает разнообразные форматы файлов: *.TIF, *.PCX, *.JPG и *.GIF из файлов или архивов URL. Способ преобразования формата *.JPG в формат.GIF, к сожалению, не был найден. Это может повлечь за собой возникновение проблем при использовании программ просмотра, не поддерживающих формат *.JPG.

Для того чтобы поместить изображение на страницу, необходимо выбрать пункт меню Insert/Image . По этой команде визуализируется диалоговое окно вставки изображения (рис. 10.31).

В этом окне представлены опции для загрузки файла с локального диска или через URL-адрес, которые можно привязать к странице.

По умолчанию изображение помещается в позицию курсора и выравнивается по левому краю. Можно усилить контроль над расположением изображения, если воспользоваться окном свойств этого изображения. Для вызова окна необходимо щелкнуть правой кнопкой мыши по полю изображения и в появившемся контекстном меню выбрать пункт Properties . Диалоговое окно Properties показано на рис.10.32. В нем можно задать режим выравнивания, определить размеры рамки, величину горизонтального и вертикального промежутков, текстовую альтернативу изображения и его версию более низкого разрешения, а также, если имеются гиперссылки, с какими URL-адресами они связаны.

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

Работа с фреймами (кадрами) . Для подготовки страницы c фреймами используются опции меню Frame (фрейм, кадр). В режиме создания нового документа в меню Frame оказывается доступной одна команда: New Frames Page . Ее активизация открывает диалоговое окно выбора одного из десяти шаблонов (рис.10.33).

В левой части диалогового окна в поле Frames приведены типы возможных сочетаний фреймов. Они могут быть представлены в виде списка или иконок. Предварительно выбранная совокупность фреймов визуализируется в поле просмотра (Preview ), в правой части диалогового окна (рис. 10.33). После выбора соответствующего шаблона на создаваемой странице (фреймсете), по нажатии кнопки ОК , появится разбиение страницы на фреймы. На рис. 10.34 приведен пример кадров шаблона Banner and contents.

В каждом из трех представленных на странице фреймов присутствуют идентичные кнопки:

Set Initial Page : выбрать готовую страницу в качестве содержания фрейма (кадра).

New Page : создается новая страница для кадра.

После нажатия соответствующей кнопки в Редакторе отобразится выбранная страница фрейма.

Для управления свойствами фрейма используется диалоговое окно Frame Properties (рис. 10.35), раскрывающееся командой Frame/Frame Properties .

В нем задаются размеры и отступы при выводе фрейма, название кадра и исходная страница, а также способы представления полосы прокрутки: по мере надобности, всегда, никогда (рис. 10.36).

Границы между фреймами могут перетаскиваться курсором мыши.

Вставка баннеров . Баннеры используются для размещения на Web-странице изменяющегося рекламного текста или изображений. Для вставки в страницу баннера используется Менеджер баннеров (рис. 10.40). Окно менеджера открывается с помощью команды Insert/Component/Banner Ad Manager .

В полях Width и Height указывается ширина и высота баннера в пикселах. Для перехода между сменяющими друг друга изображениями используется способ, заданный в поле Transition Effect (горизонтальный переход, вертикальный переход, растворение, сжатие, расширение или простой переход без визуальных эффектов). В поле ввода Show each picture for... задается время показа каждого изображения (в секундах).

По нажатии кнопки баннера должен производиться переход на ресурс, указанный рекламодателем. Поэтому в поле Link To приводится URL-адрес, на который будет осуществляться переход.

Для реализации работы баннера необходимо задать изображения. Для этого в списке Pictures to Display указывают список графических файлов. Список снабжен стандартной панелью навигации (Add - добавить, Remove - удалить, Move Up - перенести изображение выше по списку, Move down - перенести ниже).

Для того чтобы вставить готовый баннер, следует нажать кнопку OК окна менеджера, отмена производится нажатием Cancel .

Установка гиперссылок . Для создания гиперссылки необходимо отметить текст, который будет служить указателем гиперссылки, и нажать кнопку на панели инструментов Create or Edit Link () . На экране появится диалоговое окно, подобное тому, что показано на рис. 10.41.

Установка ссылки для изображения в целом аналогична созданию ссылок на фрагмент текста. В этом случае нужно щелкнуть по изображению, для которого создается ссылка, и нажать кнопку Создать или редактировать ссылку для того, чтобы открыть диалоговое окно, представленное на рис. 10.41.

При создании ссылки для изображения-карты необходимо щелкнуть по изображению и использовать кнопки на панели инструментов Image для указания треугольных, круговых или многоугольных активных участков, связанных с данной ссылкой (hot region).

Диалоговое окно Create Link позволяет создавать ссылки на файлы локального Web-узла, на файлы в других Web-сайтах Internet или на файлы, которые созданы, но являются пустыми.

Инструменты для управления ссылками . Эти функции обычно возлагаются на администратора Web-узла. Отслеживание всех ссылок внутри или выходящих за пределы данного Web-узла требует регулярной проверки каждой ссылки в отдельности. Поэтому FrontPage Explorer поставляется с утилитами для работы со ссылками.

Проверка ссылок . Если в меню Tools выбрана команда Verify Hyperlinks , то Проводник (Explorer) должен выполнить проверку всех ссылок в узле, включая те, которые ведут к страницам, расположенным за его пределами. Проводник предоставляет отчет в форме, показанной на рис. 10.42.

Ссылки на страницы внутри Web-узла помечаются красным кружком и словом Broken , если обнаруживается, что они разорваны. Если ссылка работает нормально, она вообще не выводится на экран. Ссылки на страницы за пределами узла отмечаются желтым кружком и вопросительным знаком. Это означает, что они должны еще быть проверены. Можно проверить каждую внешнюю ссылку, пометив ее и нажав кнопку Verify . Если внешняя ссылка оказывается действующей, Проводник помещает перед ссылкой зеленый кружок со словом ОК . Если ссылка оказывается разорванной, появляется красный кружок со словом Broken .

Пересчет ссылок . Команда Tools/Recalculate Links (Пересчет ссылок ) обновляет то, что видно в каждом из трех режимов просмотра, чтобы отразить изменения, сделанные авторами.

С помощью команды Recalculate Links можно:

обновить информацию о Web-узле, визуализируемую в режимах обзорного вида, вида на ссылки и обобщенного вида;

регенерировать все зависимые команды в открытом Web-узле;

обновить индекс, созданный компонентом Search bot.

Пересчет ссылок фактически выполняется в персональном Web-сервере, который является частью пакета FrontPage. После того как сервер заканчивает выполнение этой команды, управление возвращается к Проводнику (Explorer).

Сохранение документа . Для того чтобы сохранить созданный документ, используется команда File/Save as , по которой открывается диалоговое окно, представленное на рис. 10.43. В этом диалоговом окне можно сохранять документы как обычный файл или как шаблон.

При одновременной работе с несколькими файлами в меню File), мы применили следующие процедуры:При оформлении Web-страниц можно также воспользоваться предложенными в программном пакете видами оформления. Доступ к ним открывается в меню Format/Theme/Choose Theme . По активизации этой команды раскрывается диалоговое окно тем, представленное на рис. 10.50.

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

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

В центре правого фрейма над заголовком электронного издания размещено окно с анимацией.

Из окна меню по ссылке можно выйти в любой текстовой раздел. При этом содержимое правого фрейма изменяется (рис. 10.52).

Для горизонтального перемещения между разделами преду-смотрены графические кнопки (рис. 10.53), которые позволяют пролистывать материал разделов без возвращения в оглавление.

Таким образом, программный пакет FrontPage является многофункциональной программной средой, позволяющей создавать полноценные Web-страницы и Web-сайты. Его интеграция в пакет Microsoft Office, по мнению разработчиков, позволяет более эффективно использовать возможности приложений MS Office по созданию материалов для заполнения Web-страниц и фреймов (кадров) путем импорта материалов из этих приложений.

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

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