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

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

Пиктограмма - «Просмотр в браузере». Отображается на панели «Стандартная» (см.рис. 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 предусмотрено несколько видов панелей ссылок: