Онлайн учебник по работе с программой ImageReady

Создание графики для сайта

       

Выравнивание пользовательских ломтиков вдоль общей границы

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

  1. Выберите инструмент Slice Select (Выделение ломтиков), нажав клавишу Shift, щелчком мыши выделите ломтики, которые необходимо выровнять.
  2. На панели опций щелкните по одной из кнопок выравнивания (рис. 23.87).

Кнопки выравнивания на панели опций

Рис. 23.87. Кнопки выравнивания на панели опций инструмента Slice Select

Кнопки распределения ломтиков на панели опций

Рис. 23.88. Кнопки распределения ломтиков на панели опций инструмента Slice Select

Равномерное распределение пользовательских ломтиков вдоль одной оси

  1. Выберите инструмент Slice Select (Выделение ломтиков) клавиши К или комбинации клавиш Shift+K, затем, нажав клавишу Shift, выделите те ломтики, которые следует распределить.
  2. Щелкните по одной из шести кнопок распределения, расположенных на панели опций (рис. 23.88).

Создание карты изображения на основе слоя

Карта изображения (image map) содержит «кнопки» произвольной формы, каждая из которых имеет собственную URL-ссылку (рис. 23.89). Воспользуйтесь этим способом, если области, с которыми необходимо связать URL-адреса, имеют непрямоугольную форму или вы предпочитаете работать с одним файлом изображения вместо нескольких файлов для каждого ломтика.

Программа ImageReady позволяет создавать карты изображений при помощи слоя или инструмента. Карта на основе слоя, включающая в себя все непрозрачные фрагменты слоя, автоматически обновляется каждый раз, когда редактируется слой. Карты, созданные при помощи инструментов, могут быть выровнены по общей границе или распределены вдоль одной оси. Настройки и размеры карты, созданной при помощи инструмента, допускается копировать. Несложно превратить карту, созданную на основе слоя, в карту, созданную при помощи инструмента.

  1. На палитре Layers (Слои) выберите слой с прозрачными областями (рис. 23.90). Непрозрачные пикселы станут «горячими» точками карты изображения.
  2. Воспользуйтесь командой Layer > New Layer Based Image Map Area (Слой > Создать новую область карты изображения на основе слоя). Прямоугольная карта изображения окружит непрозрачные области слоя.
  3. Из всплывающего меню Shape (Фигура) палитры Image Map (Карта изображения) выберите форму «кнопки»:

Изображение с несколькими перекрывающимися элементами

Рис. 23.89. Изображение с несколькими перекрывающимися элементами, подходящее для создания карты изображения с помощью палитры Layer Options

Создание карты изображения

Рис. 23.90. Создание карты изображения на основе слоя

Выбор формы кнопки

Рис. 23.91. Выбор формы кнопки и ввод URL-адреса на палитре Image Map

Деление изображения на ломтикиМожно изменить форму фигуры на карте изображения с помощью инструмента Image Map Select (Выделение карты изображения), клавиша Р (комбинация клавиш Shift+ Р). Активизировав этот инструмент, выберите форму фигуры из всплывающего меню Shape (Форма), расположенного на палитре Image Map (Карта изображения).

Деление изображения на ломтикиПри использовании опции Polygon (Многоугольник) в поле Quality (Качество) или с помощью ползунка можно задать точность, с которой карта изображения должна повторять очертания изображения.

Деление изображения на ломтикиПрограмма ImageReady может кодировать карту изображения в HTML либо для клиента, либо для сервера. Для того чтобы выбрать одну из этих опций, щелкните по кнопке Output Settings (Настройки вывода) в диалоговом окне Save Optimized (Сохранить с оптимизацией), а затем выберите тип карты из всплывающего меню Туре (Тип) в разделе Image Maps (Карты изображения).

Rectangle (Прямоугольник), Circle (Круг) или Polygon (Многоугольник) (рис. 23.91).

  1. Введите URL-адрес (включая префикс http://) - см. рис. 23.91. Введенный адрес появится под именем слоя на палитре Layers (Слои), как показано на рис. 23.90.
  2. По желанию. В поле Target (Цель) содержится информация о том, в какой HTML-фрейм будет загружаться содержимое ссылки, а какие HTML-фреймы следует сохранить. Это поле становится доступным только после того, как был введен URL-адрес.
  3. По желанию. В поле Alt (Альтернатива) введите слово или слова, которые станут появляться, если браузер пользователя не будет отображать соответствующую картинку (рис. 23.91).
  4. Повторите шаги 1-6 для других слоев изображения.

Создание карты изображения с помощью инструмента

  1. Выберите один из инструментов: Rectangle Image Map (Прямоугольная карта изображения), Circle Image Map (Круглая карта изображения) или Polygon Image Map (Полигональная карта изображения), нажимая клавишу Р или комбинацию клавиш Shift+P.
  2. Нарисуйте прямоугольник или окружность вокруг какой-либо области в окне изображения. Нажав клавишу Shift, можно нарисовать квадрат. При нажатии клавиши Alt прямоугольник или окружность будут рисоваться относительно выбранного центра. Есть и другой способ. Постройте многоугольник: щелкнув в окне изображения, укажите начальную точку фигуры, затем щелчком мыши отмечайте каждую следующую точку, пока не окружите желаемую область ломаной. Дважды щелкните в любом месте, чтобы автоматически замкнуть выделение (рис. 23.92).
  3. Введите URL-адрес (включая префикс http://) на палитре Image Map.
  4. По желанию. Поле Target (Цель) на палитре Image Map (Карта ссылок) определяет, в какой HTML-фрейм будет загружено содержимое ссылки и какие HTML-фреймы будут сохранены (см. раздел «Связывание ссылок с ломтиками изображения»). Данное поле доступно только тогда, когда в поле URL введен адрес.

Многоугольник, построенный с помощью инструмента <B>Polygon Image Map

Рис. 23.92. Многоугольник, построенный с помощью инструмента Polygon Image Map

Ввод размеров фигуры на панели опций

Рис. 23.93. Ввод точных размеров фигуры на панели опций

Поля, определяющие размеры карты

Рис. 23.94. Поля, определяющие размеры карты, на палитре Image Map

Перемещение границы карты

Рис. 23.95. Перемещение границы карты

  1. По желанию. В поле Alt (Альтернатива) на палитре Image Map введите слово или слова, которые появятся, если браузер пользователя не будет отображать соответствующую картинку.
  2. Повторите шаги 1-6, чтобы создать другие карты изображения.

Деление на ломтикиДля того чтобы указать точные размеры прямоугольника или окружности, прежде чем нарисовать эти фигуры, на панели опций установите флажок Fixed Size (Фиксированный размер) и введите значения в поля Width (Ширина) и Height (Высота) - см. рис. 23.93.

Деление изображенияДля того чтобы с большой точностью переместить или изменить размеры прямоугольника или окружности после того, как вы уже нарисовали эти фигуры, воспользуйтесь полями X и Y или W (Width - ширина) и Н (Height - высота) на палитре Image Map (рис. 23.94). Либо активизируйте инструмент Image Map Select (Выделение карты изображения) с помощью пиктограммы, щелкните по одному из манипуляторов карты и переместите его (рис. 23.95).

Рейтинг@Mail.ru