Posts Tagged ‘изображением’

Карты ссылок

Карты ссылок
Создадим изображение в Photoshop на основе карты Европы, с которой мы работали в главе 4. На карте цветом выделены несколько стран, куда некая фирма организует туры. Изображение после размещения на сайте этой фирмы будет служить картой ссылок на страницы с подробной информацией о каждом туре. Иными словами, щелчок курсором мыши на территории любой страны в этой карте должен приводить к отдельной Web-странице.
Инструменты определения зон
ImageReady предлагает удобный способ создания карт ссылок. Она автоматически генерирует необходимый код на основе разбивки на зоны, выполненной пользователем. далее…

Оптимизация формата GIF

Оптимизация формата GIF
В результате оптимизации формата JPEG мы получили весьма существенный (97%) выигрыш в размере файла, сохранив приемлемое качество изображения. Но наилучшим ли способом проведена оптимизация? Может быть предпочтительнее использовать формат GIF?
1. Перейдите на вкладку 2-Up (2 варианта) в окне документа. Перед вами одновременно оригинал (слева) и оптимизированное изображение (справа).
2. Щелкните курсором мыши в пределах левой половины окна документа. Это сделает активным оригинал изображения.
3. В списке Settings (Установки) палитры Optimize (Оптимизация) выберите вариант GIF 64 Dithered. далее…

Разделение сложных контуров

Разделение сложных контуров
PostScript-принтеры имеют некоторые ограничения по сложности контуров, поэтому при распечатке достаточно насыщенных документов может появиться сообщение о превышении лимита.
Для упрощения таких контуров в программе Adobe Illustrator предусмотрена возможность автоматического разделения «длинных» контуров на несколько более «коротких» контуров. Если в диалоговом окне Document Setup (Параметры документа) установить флажок Split Long Paths (Разбивка сложных контуров), то при сохранении или выводе на печать программа Adobe Illustrator «по своему усмотрению» разбивает сложный контур прямыми линиями, которые видны только при просмотре в контурном режиме

Read the rest of this entry »

Интерфейс ImageReady

Интерфейс ImageReady
Главное окно ImageReady в первый момент легко перепутать с Photoshop, настолько похожи они внешне: та же панель инструментов, знакомые палитры. Как мы уже отмечали, такое сходство не случайно. Более внимательный взгляд отметит и множество особенностей. В первую очередь это несколько специальных инструментов на панели инструментов.

  • Инструмент (Прямоугольное выделение со скругленными углами) предназначен для создания выделенных областей в форме прямоугольника со скругленными углами. Палитра свойств (Параметры) для этого инструмента содержит поле (Радиус), в котором задается радиус скругления в пикселах.
  • Инструменты (Прямоугольная карта ссылок), (Круглая карта ссылок), (Многоугольная карта ссылок) и (Выделение карты ссылок) служат для создания карт ссылок. Первые три используются для определения прямоугольных, круглых и многоугольных областей карты, а последний — для их выделения в документе.

    Инструмент Slice (Фрагмент) предназначен для разрезания изображений на прямоугольные фрагменты, a Select Slice (Выделение фрагмента) — для выделения таких фрагментов. Оба эти инструмента присутствуют и в Photoshop, но мы их до сих пор не рассматривали. Впрочем, в этом нет необходимости, поскольку разрезание изображений в обеих программах пакета реализовано одинаково.

Кроме того, на панели инструментов имеются кнопки режимов:

  • Toggle Slices Visibility (Переключение видимости фрагментов). Если кнопка нажата, то границы фрагментов, на которые разрезано изображение, видны на экране, в противном случае — нет. Переключателю на панели инструментов соответствует команда-переключатель Slices (Фрагменты), находящаяся в списке Show (Демонстрация) меню View (Вид).

    Примечание
    Если выбрать инструмент Slice (Фрагмент) или Select Slice (Выделение фрагментов), режим показа фрагментов включается автоматически.

  • Toggle Image Maps Visibility (Переключение видимости карты ссылок). При нажатой кнопке ImageReady отображает границы областей карты ссылок. Переключателю на панели инструментов соответствует команда-переключатель Image Maps (Карты ссылок), находящаяся в списке Show (Демонстрация) меню View (Вид).
  • Rollover Preview (Просмотр ролловеров). При нажатой кнопке, в режиме просмотра ролловеров, можно проверить их работу прямо в окне документа. Редактирование ролловеров в этом режиме невозможно.
  • Preview in Default Browser (Просмотр в браузере по умолчанию). Нажатие кнопки открывает текущее изображение в браузере, принятом в системе по умолчанию. Это окончательный режим проверки карт ссылок, ролловеров и анимации. Только он обеспечивает полностью адекватное отображение этих элементов страницы. Изображение в браузере сопровождается дополнительной информацией о нем и текстом, необходимым для работы динамических элементов.

    Редактор ImageReady имеет и несколько особых палитр:

  • Optimize (Оптимизация). Содержит параметры оптимизации изображений для экспорта в выбранный формат. Вид оптимизированного изображения демонстрируется прямо в окне каждого документа ImageReady. В строке состояния окна документа указываются текущие параметры оптимизации или иная информация, которая выбирается в списке, открывающемся щелчком на треугольной стрелке. В этом же списке задается предполагаемая скорость модема, позволяющая оценить время загрузки изображения в браузере пользователя. Color Table (Цветовая таблица). Показывает текущую палитру изображения, если задан режим оптимизации в индексированный формат (GIF или PNG-8). Она также имеет свой аналог в модуле Save For Web Photoshop и работа с ней тоже аналогична.
  • Layers (Слои). Единственное отличие этой палитры от палитры Layers (Слои) в Photoshop заключается в том, что в нижнем ряду кнопок есть стрелки перехода между слоями и добавления эффектов. Поскольку при создании анимации ее фазы размещаются на отдельных слоях, кнопки перехода к предыдущему или следующему слою используются для перемотки кадров.

Layer Options/Effects (Параметры слоя/Эффекты). Используется совместно с палитрой Layers (Слои) и позволяет задавать параметры слоя и ассоциированных с ним эффектов. Если в палитре Layers (Слои) выделена строка эффекта, то в палитре Layer Options/Effects (Параметры слоя/Эффекты) оказываются настройки этого эффекта. Если же выделен слой, то в этой палитре вы найдете параметры слоя . Styles (Стили). далее…

Разделение сложных контуров

Разделение сложных контуров
PostScript-принтеры имеют некоторые ограничения по сложности контуров, поэтому при распечатке достаточно насыщенных документов может появиться сообщение о превышении лимита.
Для упрощения таких контуров в программе Adobe Illustrator предусмотрена возможность автоматического разделения "длинных" контуров на несколько более "коротких" контуров. Если в диалоговом окне Document Setup (Параметры документа) установить флажок Split Long Paths (Разбивка сложных контуров), то при сохранении или выводе на печать программа Adobe Illustrator "по своему усмотрению" разбивает сложный контур прямыми линиями, которые видны только при просмотре в контурном режиме,

 

 

Программа не разбивает "длинные" контуры, имеющие параметры обводки, составные контуры и маски. Для разделения контура следует использовать инструмент Scissors (Ножницы) (?<).
Для разбиения составного контура или маски надо сначала выполнить команду Release (Отменить) меню Object/Compound Paths (Объект/Составной контур), а затем воспользоваться инструментом Scissors (Ножницы).
Для разбиения маски надо сначала выполнить команду Release (Отменить) меню Object/Mask (Объект/Маска), а затем также воспользоваться инструментом Scissors (Ножницы).
Если объект имеет толщину обводки и заливку, то образуется два объекта: один для контура, который не разбивается, и второй для заливки, который разбивается.

Nota Bene. Однако следует иметь в виду, что программа не в состоянии учесть все тонкости взаимодействия многих объектов друг с другом, и тем самым ее "самостоятельные" действия могут нарушить дизайн страницы. Сложные объекты разбиваются на отдельные составные части, следовательно затрудняется работа над объектом как целым ("целая морока" собрать его обратно: болев полно об этом повествует глава 5). Поэтому перед тем, как установить указанный флажок, совсем не лишне сохранить копию исходного документа, тем более что речь идет именно о сложном документе, на который потрачено много сил и времени.

далее…

Разрезание изображений

Разрезание изображений
Множество разнородных графических элементов Web-страницы могут потребовать для оптимизации различных параметров, или даже форматов. В таких случаях большое изображение можно разрезать на фрагменты и задать для каждого фрагмента индивидуальные параметры. Сборка фрагментов в единое изображение осуществляется HTML-кодом страницы. Разрезание изображения также удобно для организации ссылок и необходимо при создании ролловеров (см. ниже).
На приведен пример заголовка Web-страницы, где разрезание приводит к существенному выигрышу в размере и качестве. Основная часть заголовка полноцветная, и займет наименьшее место при сохранении в формате JPEG. В кнопках-ролловерах использованы всего два цвета. далее…