Программа
FrontPage Editor
Программа Edit используется для
разработки и просмотра отдельных страниц сайта, а также для реализации гиперссылок.
В каждый момент времени может быть активизирована одна страницы сайта, и пользователь,
используя средства программы, просматривает, редактирует и формирует компоненты
этой текущей страницы.
Пользовательский
Интерфейс 
В верхней части окна программы,
как обычно, отображаются Заголовочная панель с наименованиями программы
и страницы (FrontPage Editor и NewPage1 в случае приведенного окна), панель
Главного меню (с пунктами меню File, Edit, View ) и Панель Форматирования
(с полями и кнопками выравнивания). Далее следует рабочая область с изображением
одной из страниц сайта текущей. В рабочей области отображаются элементы страницы
(фрагменты текста, гиперссылки, таблицы, рисунки), а также специальный кусор,
указывающий позицию страницы. Для размещения редактируемых элементов страницы
их необходимо предварительно указывать курсором, щелчками мышью устанавливаемый
в требуемую позицию.
Программа FrontPage Editоr обеспечивает
режимы отображения страниц Normal, HTML, Preview, кнопки которых отображаются
в нижней левой части окна программы. Режимы эти предназначены соответственно
для информационного наполнения страницы (формирования текстовых фрагментов,
таблиц, рисунков.), отображения HTML-кода страницы, и для предварительного
просмотра страницы в том виде, в каком она будет представлена на экране пользователя.
рис. 23.
Функциональность
Программы
Наиболее употребимыми командами
программы Editor являются следующие.
Команды
меню File
Kоманды
New, Open, Close,
Save, Save as используются соответственно для Создания новых, Открытия,
Закрытия, Сохранения уже существующих страниц сайта (напомним, что открытие
и закрытие самого сайта производится командами программы Explorer).
Команда
Preview In Browser
дает
возможность просматривать изображение страницы в конкретном броузере Internet
Explorer или Netscape Navigator, a команда
Page Propeties
(Свойства
Страницы) предназначена, в том числе, и для редактирования заголовка страницы
(Titles), отображаемого в заголовочной панели окна страницы (NewPage1 для
приведенного окна).
Команды
меню Edit
Команды
Undo, Redo,
Cut, Copy, Paste, обеспечивают возможность Отказа от выполненных измений
и их Пoвторного выполнения, а также возможность Вырезания, Копирования
и Вклеивания фрагментов страниц.
Команды
меню View
Команды обеспечивают отображение
и снятие панелей окна программы Edit. Так, с помощью команд StandartToolbars,
FormatToolbars можно устанавливать и снимать Стандартную Пиктографическую
панель и панель Форматирования.
Команды
меню Insert
Нижеперечисляемые команды,
формируют следующие элементы страниц в позиции курсора:
Line Break - новая
строка текущего абзаца.
Horizontal Line -горизонтальная
линия.
Navigation Bar. Данная
команда используется для автоматической установки гиперссылок между страницами
навигационной схемы (описывается в дальнейшем изложении).
Clipart - используется
для вставки изображений галереи Clipart.
Hyperlink - используется
для формирования гиперссылок как межстраничных, так и внешних.
Команды
меню Format
Нижеперечисляемые команды
используются для форматирования текстовых элементов страницы и реализуют
следующие функции:
Font- устанавливает
шрифт, размеры и стиль букв.
Paragraph - устанавливает
параметры текстового элемента, и определяют его в качестве обычного абзаца
или заголовка определенного уровня, а также производят выравнивание текстовых
элементов (левое, правое или центрированное) и устанавливают цвета фона
и букв.
Bullets and Numbering
-
формируемые элементы определяет как список с указателями пунктов или пронумерованный.
Theme - устанавливает
дизайнерское оформление (темы) данной страницы.
Background - устанавливает
цвета представления фона, букв и гиперссылок. Цвета гиперссылки при этом
могут различаться для гиперссылок, указываемых курсором, для уже посещенных
(ранее указанных) и для всех остальных.
Автоматическaя
Установка Гиперссылок
Навигационная схема сайта, формируемая
в режиме Navigation. Программа Explorer определяет логические отношения страницам
и группу информационно значимых страниц. Если текущая страница является компонентом
навигационной схемы, то с помощью команды Navigation Bar для нее можно указать
тип логического отношения (предыдущий, верхний). Указание типа отношений и соответствующих
переходов производится при помощи специального окна отображаемого данной командой.
рис 24.
В окне определены следующие варианты
отношений и переходов:
Parent level (переход ко всем
страницам верхнего иерархического уровня), Same level (переход ко всем страницам
данного иерархического уровня), Back and Next (переход к предыдущей и последующей
страницам), Child level (переход ко всем страницам нижнего иерархического
уровня), Top level (переход ко всем страницам самого верхнего иерархического
уровня), Home page (переход к главной странице), Parent page (переход к странице
верхнего иерархического уровня).
После выбора типа отношения команда
сама формирует соответствующие гиперссылки. Приведем пример. Пусть навигационная
схема имеет приведенный вид и текущей является страница NewPage2.
рис 21.
Если после запуска команды Naviagtion
Bar в отображаемом окне установить пункты BackAndNext и Homepage, то на странице
NewPage2 команда установит гиперссылки, указывающие на страницы NewPage1 и
NewPage2 (предыдущая и следующая), и на страницу HomePage.
"Ручная"
Реализация Гиперссылок
Команда Hyperlink используется
для формирования гиперссылок как межстраничных, так и внешних. Предварительно
пользователь устанавливает курсор в некоторую позицию страницы и затем запускает
команду. Далее он указывает имя страницы или адрес сайта (например, NewPage3
или seua.am), и команда в позиции курсора формирует гиперссылку на эту страницу
или на этот сайт.
Команда Hyperlink отображает окно
CreateHyperlink (Создать Гиперссылку) со списком старниц данного сайта
и полем (обозначенным URL), предназначенным для адреса гиперссылки. В списке
страниц данного сайта текущая страница приводится первой (NewPage1 для приведенного
окна). Выбором элемента списка страниц устанавливается межстраничная гиперссылка,
а вводом адреса в поле URL внешняя.
рис 25.
Так, если в отображенном списке
выбрать NewPage5, то в позиции курсора страницы NewPage1 будет сформирована
гиперссылка на страницу NewPage5.
Формируемая запись гиперссылки
содержит имя страницы или адрес сайта. Это не всегда удобно. При желании пользователь
может заменить текст гиперссылки на более удобный. Для этого в режиме отображения
Normal необходимо щелкнуть гиперссылку, привести ее в состояние редактирования
и сформировать сответствующую запись. Например, адрес "seua.am" может быть
замещен записью "Крупнейший Университет Армении". Отметим, что такое замещение
предназначено для пользователя и является внешним. Гиперссылка сохраняет первоначальный
адрес, используемый при переходах к другим страницам или сайтам.
Задания.
FrontPage Editor
Функциональность
Активизация
программы FrontPage Editor
Активизировать программу
FrontPage Editor выбором одноименной команды в окне программы Explorer
(щелчками одноименной кнопки пиктографической панели или пункта ShowFrontPageEditor
выпадающего меню Tools).
Переключаться между программами
FrontPage Editor и FrontPage Explorer, активизируя попеременно ту или другую
программу. Активизацию программ производить щелчками соответствующих кнопок
пиктографических панелей программных окон или щелчками минимизированых
символов программ панели Taskbar окна Windows.
Стуктура окна
программы
Активизировать программу
FrontPageEdit. Просматривать и указывать структурные компоненты окна панель
главного меню, стандартную пиктографическую панель, панель команд форматирования,
рабочую область страницы и панель режимов отображения Normal, HTML, Preview.
Команды главного
меню
В отображенном после активизации
окне программы FrontPage Editor просматривать, указывать и активизировaть
следующие команды главного меню программы, делая предположения об их функциональном
назначении.
В меню File команды New,
Open, Close, Save, Save as, Preview in Brouser, Print, Print Preview, Page
Propeties. При этом:
- Командами Open и Close
открывать и закрывать различные страницы сайта. Командой Preview In Browser
просматривать страницу броузерами Microsoft Internet Explorer и Netscape
Navigator.
- Командой Page Propeties
менять заголовок страницы.
В меню Edit просматривать
команды Undo, Redo, Cut, Copy, Paste, Clear, Select All, Find, Replace,
Hyperlink.
В меню View просматривать
команды Standard Toolbar, Format Toolbar, Form Toolbar, Image Toolbar,
Table Toolbar, Refresh. При этом:
- Выбором пунктов Standard
Toolbar, Format Toolbar, Form Toolbar удалять или устанавливать соответствующие
панели и просматривать их содержание.
В меню Insert просматривать
команды Line Break, Horisontal Line, Symbol, Timestamp, Navigation Bar,
Hyperlink.
Выбором пунктов Line Break,
Horisontal Line, Symbol формировать элементы страниц переход на новую строку,
горизонтальную линию, символа. При этом:
- Выбором пункта Navкigation
Bar отобразить окно Navigation Bar Propeties.
- В данном окне щелчками
кнопок Parent level (все страницы верхнего уровеня), Same level (все страницы
того же уровня), Back and Next (страницу того уровня, расположенные слева
и справа), Child level (все страницы нижнего уровня), Top level(все страницы
самого верхнего уровня), Home page (домашняя страница), Parent page (страница
) устанавливать различные типы отношений.
В меню Format просматривать
команды Font, Paragraph, Bullets and Numbering, Theme, Background. При
этом:
- Выбором тех или иных пунктов
меню устанавливать форматы шрифтов, параграфов, режимы формирования списков,
темы дизайна, расцветку фона, формировать текстовые элементы и наблюдать
результат.
В меню Table Draw Table (Рисовать
таблицу), Insert Table (Вставлять таблицу). Выбором пунктов меню устанавливать
режим вычерчивания или вставки таблицы, формировать таблицы с различным
числом и различными размерами строк и столбцев, заполнять ячейки текстовыми
данными и наблюдать результат.
Команды пиктографической
панели.
Указывая и щелкая команды
пиктографической панели, делать предположения об их функциональном назначении
и наблюдать результат. В числе прочих найти и указать такие команды, как
Show FrontPage Explorer.
Команды панели
форматирования.
Командой Format Toolbar
меню View установить панель форматирования и, указывая и щелкая отдельные
ее пункты (списки и кнопки), делать предположения об их функциональном
назначении и наблюдать результат. В числе прочих найти и указать такие
компоненты, как Change Style (Изменить стиль), Change Font (Изменить шрифт),
Increase Text Size (Увеличить размеры текста), Decreaze Text Size (Уменьшить
размеры теста), Bold, Italic, Underline (Жирный, Курсивный, Подчеркнутый),
Text Color (Цвет текста), Align Left (Левое выравнивание), Center (Центрирование),
Align Right (Выравнивание Правое), Numbered List (Нумерованный список),
Bulleted List (Список с метками).
Выбором тех или иных элементов
устанавливать стиль текстовых элементов, их шрифты, изменять размеры, стили
и цвета букв, производить выравнивание строк в абзацах, формировать текстовые
элементы, списки и наблюдать результат.
Команды панели
форм
Командой FormsToolbar меню
View установить панель форм и, указывая и щелкая отдельные ее пункты (кнопки),
делать предположения об их функциональном назначении и наблюдать результат.
В числе прочих найти и указать такие компоненты, как One-Line Text Box,
Scrolling Text Box, Check Box, Radio Button, Push Button.
Режимы отображения
Normal, HTML, Preview
Указывая и щелкая кнопки
режимов отображения Normal, HTML, Preview, наблюдать и интерпретировать
изображение рабочей области окна проектируемое, кода HTML и броузерное.
Автоматическая
Установка Гиперссылок
Открывать страницы, являющиеся
компонентами навигационной схемы (командой Open меню File). Для каждой
из них запускать команду Navigation Bar меню Insert. Выбирать и устанавливать
различные пункты (Parent level, Home page, Same level) отображаемого окна
Navigation Bar Propeties. При этом:
- наблюдать формирование
межстраничных гиперссылок.
- с использованием гиперссылок
осуществлять переходы к другим страницам сайта (щелчками гиперссылок при
нажатой клавише Ctrl).
Управление
Гиперссылками. Реализация. Удаление. Редактирование
Реализация
Открывать различные страницы
сайта. Устанавливать курсор в позицию формируемой гиперссылки. Запускать
команду Hyperlinks выпадающего меню Insert. При этом:
- В отображаемом окне выбирать
адресуемую страницу и формировать гиперссылку.
В поле URL отображаемого
окна вводить URL адреса сайтов (seua.am, seua.cscourses.am, csupomona.edu)
и наблюдать формирование гиперссылки.
Удаление
Указывать курсором гиперссылку
и выделять ее. Вводом ключа Del, удалять ее.
Редактирование
Указывать курсором гиперссылку
и выделять ее. Вводить соответствующий текст и редактировать запись гиперссылки.
Информационное
Наполнение Страницы
Активизируя различные страницы,
с использованием команд Line Break, Horisontal Line, Symbol, Timestamp
Draw Table, Insert Table выпадающего меню Insert формировать отдельные
элементы страницы. При этом учитывать следующее.
- перед формированием элемента
текстовый курсор устанавливать в соответствующую позицию страницы.
- в процессе формирования
переключаться между режимами Normal и Preview и просматривать пользовательское
и броузерное изображение страницы.
- для формирования текстовыхэлементов
использовать команды Font, Paragraph, Bullets and Numbering.
Режимы
Отображения
Активизируя различные страницы,
переключать режимы отображения Normal, HTML, Preview просматривать изображения
и делать предположения об их функциональном назначении.
Задания.
Проектирование Сайта
Приводимые задания предполагают
предварительную "ручную" подготовку сайта и его последующую техническую реализацию
на компьютере. Во время предварительной подготовки разработчик определяет содержание
сайта и его отдельных страниц, уточняет логическую соотносимость страниц, разрабатывает
логическую структуру сайта, решает межстраничные и внешние гиперссылки сайта,
и все это в режиме анализа и эспертных консультаций.
Идея Сайта
Выбрать тему сайта. Сайту
можно придать личных характер, представляя сведения о себе, своем окружении,
своих занятиях и увлечениях. Сайт может строиться как средство преставления
организации, ее администрации, истории создания, структуры и функциональности.
Сайт может носить коммерческий характер, предлагая товары, сервисы и услуги.
Сайт может быть придана научная ориентация с результатами иссследований
в некоторой предметной области. Сайт может буть адресован группе по интересам,
с предложением таких собраний, как сборники афоризмов, высказываний, максимов.
Мысленно представить содержание
отдельных разделов сайта, их заголовки, значимость и логическую соотносимость
межстраничных переходов.
Содержание
Страниц
Подготовить карточки небольшого
размера (возможно размером 1/4 стандартного листа формата А4). Заголовок
и содержание каждой из страниц записать на отдельной карточке.
На карточках оставить свободные
места для дальнейшего внесения гиперссылок.
Условными обозначениями можно
представить композицию страницы и распределение ее компонент- текстов,
таблиц, рисунков, в пространстве карточки.
Так, карточка некоторой страницы
Favorites (Увлечения) может иметь приведенный вид.
Увлечения
а) Кухня. Описание предпочитаемых
блюд рецепты, вкусовые качества.
б) Спорт вид спорта, чемпионы,
противопоказания.
г) Телевизионные передачи
- каналы, передачи, персонажи, телеведущие.
Логическая
Структура
Разложить карточки на столе.
Просматривать их, мысленно осуществляя логически соотносимые переходы и
определяя информационную значимость отдельных страниц.
На отдельном листе бумаги
начертить навигационную схему сайта, с указанием заголовков отдельных страниц
и выделив информационно значимую группу.
На отдельном листе бумаги
начертить логическую структуру сайта с указанием межстраничных гиперссылок
и переходов между ними.
В карточки внести межстраничные
гиперссылки.
Гиперссылки
на Другие Сайты
Продумать кaкие сайты могут
уточнять, дополнять, интерпретировать представленную на страницах сайта
информацию и их адреса вписать в карточки (можно использовать "seua.am"
и "seuacscourses.am").
Отредактировать тексты гиперссылок,
так, чтобы их записи были адекватны восприятию адресуемой группы, и с достаточной
полнотой информировали посетителей сайта о содержании указываемых.
Экспертный
Анализ
Предложить карточки вниманию
окружающих, обсудить с ними содержание, логическую структуру сайта, композицию
и элементы графического дизайна.
На этом этап логической разработки
завершается. Далее следует техническая реализация сайта.
Создание
Сайта
Программой Explorer разработать
навигационную схему и создать независимые страницы.
Программой Editor сформировать
элементы сайта.
Доработка
Сайт демонстрировать окружающим,
обсуждая вопросы информационного наполнения, графического дизайна, логической
структуры, эстетической ценности и общественной значимости.
