Web дизайн с Macromedia HOMESITE



 

Представление ссылок на вкладке Site View

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

Для создания и редактирования элементов навигации могут применяться те универсальные инструменты, которые были рассмотрены выше (редактор кода, редактор тегов, Tag Inspector, Tag Chooser). Кроме того, для создания сенсорных карт в составе HomeSite имеется утилита Image Map Editor.

Для просмотра навигационной схемы применяется вкладка Site View окна ресурсов.

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

Следует отметить, что вкладка Site View является весьма универсальным средством.

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

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

Если на вкладке отсутствует навигационная схема, следует воспользоваться командой Refresh (Обновить), входящей в контекстное меню вкладки.

Замечание
Команда Refresh позволяет также обновить содержимое вкладки Site View после внесения правки в документ. Однако предварительно документ следует сохранить на диске.

HomeSite обеспечивает включение в навигационную схему ссылок, создаваемых с помощью следующих типов тегов:

  • <А>;
  • <IMG>;
  • <FRAME> (если он содержит атрибут SRC);
  • <APPLET> (если он содержит атрибуты CODE или CODEBASE).

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

  • в виде дерева (рис. 5.3, слева);
  • в виде диаграммы (рис. 5.3, справа).

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

В обоих случаях представление ссылки состоит из двух частей:

  • значка, отражающего тип ресурса, на который указывает ссылка;
  • собственно адреса ресурса.

Со значками все достаточно просто. В таблице 5.1 приведен перечень значков и соответствующих им типов ссылок.

Табл. 5.1. Перечень условных обозначений типов ссылок

Значок
Тип ссылки
Ссылка на HTML-файл (имеются в виду файлы, обрабатываемые на стороне клиента броузером читателя:
.html, .shtml, .xml и т. д.)
Ссылка на графический файл (jpeg, gif, png, blip)
Локальная ссылка (якорь)
Почтовая ссылка
Ссылка на файл, обрабатываемый на стороне сервера (elm, .asp, jsp и т. д.)

Рис. 5.3. Варианты представления навигационной схемы

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

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

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

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

  • абсолютной (ссылка на файл Index.html)',
  • относительной ссылкой на файл, расположенный в той же папке (ссылка на файл Slart_1.html);
  • относительной ссылкой на файл, расположенный в другой папке (ссылк на файл File_01.gif).

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

На этом же рисунке показан формат представления различных видов адре сов на вкладке Site View.

Практически все операции на вкладке Site View могут быть выполнены с помо щью контекстного меню. Его можно открыть, щелкнув правой кнопкой мыши в любой позиции вкладки. Контекстное меню содержит следующие команды:

  • Edit (Правка); команда позволяет открыть в окне редактирования доку мент, на который указывает выбранная ссылка; команда применима только к файлам, относящимся к категории Web-документов;
  • Expand Links (Развернуть ссылку); с помощью этой команды можно «заглянуть» внутрь документа, вызываемого по данной ссылке, и по-лучить его навигационную схему; тот же результат можно получить дважды щелкнув на ссылке мышью;
  • Set as Root (Установить как корневую); команда позволяет изменить уровень представления навигационной схемы, оставив в окне только ссылки более низкого уровня по сравнению с выбранной ссылкой (при этом сама ссылка отображается как корневая); чтобы вернуться к исходному варианту представления, требуется переключиться на лю бой другой документ и затем — вновь на редактируемый;
  • Refresh (Обновить); команда обеспечивает обновление содержимого окна ресурсов (например, после внесения изменений в редактируемый документ и сохранения их на диске);
  • Options (Дополнительно); это каскадное меню, в которое входят две команды:
    • Show <Title> (Показать заголовок); выбор команды приводит к тому, что адреса файлов в навигационной схеме заменяются заголовками хранящихся в них HTML-документов (то есть значениями тегов <TITLE>);
    • Gradient (Градиент); команда обеспечивает создание для навигационной схемы фона, насыщенность которого увеличивается от верхних ссылок к нижним;
  • View Style (Способ представления); это также каскадное меню, содержащее два варианта представления навигационной схемы: в виде дерева (Tree) или в виде диаграммы (Chart).

Все команды контекстного меню (за исключением Options и View Style, которые доступны всегда) становятся доступны только в том случае, если выбрана соответствующая ссылка.

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

Чтобы получить на вкладке Site View коррективе представление навигационной структуры сайта, требуется выполнить два условия:

  • строить ссылки «сверху вниз», используя в качестве «корня» файл главной страницы (Index.html), расположенный в корневой папке проекта; при этом дерево ссылок должно соответствовать дереву папок проекта;
  • открыть файл главной страницы в окне документа и перейти на вкладку Site View (если вкладка окажется пустой, выберите в контекстном меню команду Refresh).

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

Например, на рис. 5.5 показано дерево ссылок, построенное относительно файла Index.html, который находится в корневой папке проекта (New).

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

Чтобы на вкладке Site View были представлены только ссылки, являющиеся подчиненными (или дочерними) по отношению к выбранной, следует в контекстном меню этой ссылки выбрать либо команду Set as Root, либо команду Edit. Во втором случае соответствующий файл будет также открыт в окне документа.

Рис. 5.5. Дерево ссылок, построенное относительно файла главной страницы (lndex.html)

Рис. 5.6. «Раскрытие» ссылки следующего уровня