Карты ссылок
Создадим изображение в Photoshop на основе карты Европы, с которой мы работали в главе 4. На карте цветом выделены несколько стран, куда некая фирма организует туры. Изображение после размещения на сайте этой фирмы будет служить картой ссылок на страницы с подробной информацией о каждом туре. Иными словами, щелчок курсором мыши на территории любой страны в этой карте должен приводить к отдельной Web-странице.
Инструменты определения зон
ImageReady предлагает удобный способ создания карт ссылок. Она автоматически генерирует необходимый код на основе разбивки на зоны, выполненной пользователем. Разбить изображение на зоны карты ссылок можно либо специальными инструментами, либо на основе слоев в документе. Для ввода ссылок используется палитра Image Map (Карта ссылок).
- Откройте документ Relief.psd из рабочей папки на жестком диске и сохраните его под именем Europe_map.psd с помощью команды Save As (Сохранить как) меню File (Файл).
- На панели инструментов выберите инструмент Rectangle Image Map (Прямоугольная карта ссылок).
- Создадим этим инструментом прямоугольную зону для карты ссылок и назначим ей гипертекстовую ссылку. Очертите инструментом Rectangle Image Map (Прямоугольная карта ссылок) территорию Великобритании так, как вы сделали бы это инструментом Crop (Обрезка). Появилась прямоугольная рамка вокруг зоны карты ссылок (рис. 11.19).
Рис. 11.19. Зона карты ссылокПримечание
Изображение внутри рамки выглядит немного светлее, чем должно быть. Таким Образом ImageReady показывает зону карты ссылок. Подчеркнем, что это, как и рамка, только лишь способ отображения зоны: цвета изображения на самом деле не меняются. Отмените отображение карты ссылок кнопкой Toggle Image Maps Visibility (Переключение видимости карты ссылок), и вы убедитесь в этом. Настройки режима отображения карт ссылок сосредоточены в разделе Image Maps (Карты ссылок) диалогового окна Preferences (Установки) (рис. 11.20). В поле Image Map Overlay (Наложение карт ссылок) задается величина осветления зон карты ссылок. Чтобы отменить осветление, установите флажок Show Lines Only (Показывать только линии). Цвет рамки вокруг зоны карты ссылок выбирайте в списке Line Color (Цвет линий). Флажок Show Bounding Box (Показать габаритную рамку) включает показ габаритной рамки у круглых зон. - Выберите на панели инструментов инструмент Image Map Select (Выделение карты ссылок).
- Скорректируйте созданный контур зоны карты ссылок, перемещая боковые и угловые манипуляторы рамки вокруг области.
- Теперь определим зону карты ссылок для Голландии. Прямоугольная форма зоны в этом случае не подходит, т. к. прямоугольник "залезет" на территорию Германии. Выберите на панели инструментов инструмент Polygon Image Map (Многоугольная карта ссылок).
Рис.11.20. Раздел Image Maps диалогового окна Preferences - Подведите курсор инструмента к границе соседней зоны карты ссылок, над изображением мельницы, и щелкните мышью.Вы определили первый угол многоугольной зоны.
- Перемещайте курсор вниз, за ним потянется тонкая линия отмечающая сторону многоугольной зоны. Чтобы линия была строго вертикальной, нажмите клавишу SHIFT. Эта сторона новой зоны должна совпадать со стороной соседней.
- Когда курсор окажется ниже изображение мельницы, сделайте еще один щелчок мышью. Вы определили положение второго угла и одной стороны многоугольной зоне.
- Продолжайте определять углы многоугольной зоны (рис. 11.21) Когда вы будете создавать последнюю сторону зоны, курсор окажется в точке из которой вы начинали. Рядом с курсором появится маленький кружок Теперь щелчок мыши замкнет контур зоны карты ссылок.
Рис. 11.21. Создание многоугольной зоны карты ссылок
С помощью инструментов, использованных в этом упражнении, вы можете определить произвольные зоны, составляющие карту ссылок. При этом наличие слоев в документе не важно, поскольку карта ссылок строится для документа в целом. Не рассмотренный нами инструмент создания круглой зоны работает так же, как для прямоугольной. Инструмент Image Map Select (Выделение карты ссылок) используется не только для коррекции формы зон, но и для их выделения. Чтобы выделить зону, щелкните инструментом внутри нее. Вокруг выделенной зоны появится рамка с манипуляторами.