Пакет Dreamweaver

       

Карта узла



Карта узла

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

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

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

Вот еще несколько соглашений, касающихся изображений карты узла. Ссылки на гипертекстовые документы узла отображаются зеленым цветом. Если ссылка указывает на существующий файл, расширение имени которого отличается от .HTM, .HTML и т. п., она отображается синим цветом. Если ссылка некорректная, тупиковая или разорванная, используется красный цвет. Соответствующие связи помечаются специальным значком, который выглядит как стилизованное изображение разорванной связи. Внешние файлы, файлы, расположенные на других сайтах, и специальные ссылки (например, mailto: или javascript:) получают специальный значок в виде глобуса. Если включен режим контроля обращения файлов (Check In/Out), то на карте узла галочкой красного цвета помечаются все файлы, взятые на обработку сторонними исполнителями. Зеленая галочка — это признак того, что данный файл заблокирован самим разработчиком. Значок в виде замка выделяет файлы, доступные только для чтения.

Создание структуры узла

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

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

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

Рассмотрим основные шаги процедуры создания структуры.



  1. Откройте Диспетчер узла и перейдите в режим отображения карты узла. Напомним, что для этого достаточно дать команду Site > Site Map (Сайт > Карта сайта) (эквивалентная клавиатурная комбинация — ALT+F8) в окне документа или команду Window > Site Map (Окно > Карта сайта) в окне Диспетчера узла.
  2. Выберите значок основной страницы.
  3. Дайте команду Site > Link to New File (Сайт > Ссылка на новый файл) (эквивалентная клавиатурная комбинация — CTRL+SHIFT+N). Откроется диалоговое окно Link to New File (Ссылка на новый файл) (Рисунок 2.13).
  4. В поле File Name (Имя файла) введите имя файла вместе с одним из допустимых для гипертекстовых документов расширений, например: .НТМ, .HTML и др.
  5. В поле Title (Заголовок) задайте заголовок страницы. Это произвольная строка текста, которая заносится в раздел заголовков гипертекстового документа между дескрипторами <title> и </title>.
  6. В ноле Text of Link (Название ссылки) введите наименование ссылки. Вес ссылки такого рода располагаются в нижней части документа-родителя. По сути дела, они представляют собой напоминание о подчиненных документах и выделяются цветом и подчеркиванием. В процессе доработки узла черновые ссылки обычно заменяют ссылками, оформленными в стиле данного узла: текстовыми или графическими.
  7. Щелкните на кнопке ОК или нажмите клавишу ENTER.

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

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

Ссылки на существующие документы

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

  • Документ, на который требуется сослаться, является зарегистрированным объектом узла. Это значит, что его имя представлено на карте узла и на панели, содержащей список файлов и папок. Для создания ссылки на такой файл следует выбрать родительский документ, зацепить мышкой маркер-указатель и перетащить его на целевой документ. Маркер-указатель — это специальное интерактивное средство для задания ссылок; он изображается в виде кружка справа от значка выбранного документа. Разрешается перетаскивать маркер на любую панель Диспетчера узла: на карту или в список файлов.

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

При обилии раскрытых окон метод перетаскивания может потерять все свои преимущества и оказаться слишком громоздкой процедурой. В программе есть специальная команда, которую можно применить в любой ситуации. Для этого выберите родительский документ и дайте команду Site > Link to Existing File (Сайт > Ссылка на существующий файл) (эквивалентная клавиатурная комбинация — CTRL+SHIFT+K). Откроется диалоговое окно Select HTML File (Выбрать гипертекстовый файл), в котором, используя стандартные приемы навигации Windows, надо разыскать файл целевого документа. Эту команду можно дать и из контекстного меню, которое открывается при щелчке правой кнопкой мыши на значке документа.

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

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

По умолчанию маркеры-указатели появляются только у внутренних гипертекстовых файлов узла, расположенных на первых двух уровнях иерархии. Какие настройки программы следует изменить, чтобы метод перетаскивания стал доступен для глубоко вложенных файлов? Выберите гипертекстовый файл на карте узла и дайте команду View as Root (Показать как корневой). Эта команда доступна из контекстного меню, кроме того, ей соответствует клавиатурная комбинация CTRL+SHIFT+R.

Выбранный документ объявляется на время основной страницей сайта, все верхние уровни структуры узла становятся скрытыми.

В третьей строчке окна Диспетчера узла в поле Site Navigation (Навигация по сайту) выводится путь доступа к корневому документу узла. Чтобы развернуть все скрытые ветви, надо просто щелкнуть мышкой по значку основной страницы, которая обычно именуется index.htm. Описанный прием работает только для внутренних HTML-файлов узла.

Изменение ссылок

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

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

  1. Выберите значок документа-источника на карте узла.
  2. Дайте команду Site > Change Link (Сайт > Изменить ссылку) в окне Диспетчера узла. Клавиатурный эквивалент этой команды — CTRL+L; кроме того, она представлена в контекстном меню.
  3. Откроется диалоговое окно Select HTML Files (Выбор гипертекстовых файлов), в котором следует указать имя и расположение нового файла ---адресата ссылки.
  4. После окончания стандартной для системы Windows процедуры выбора файла программа Dreamweaver открывает диалоговое окно Update Files (Обновление файлов), показанное на Рисунок 2.13. Чтобы обновить все ссылки, щелкните на кнопке Update (Обновить). Для выборочного обновления выберите нужные файлы и подтвердите операцию щелчком на той же кнопке. Групповой выбор удобно выполнять, удерживая клавиши CTRL или SHIFT.

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



Содержание раздела