Техника Web-дизайна для студента

Сохранение изображений

Сохранять изображения можно с помощью традиционных ко­манд меню File | Save (Файл | Сохранить) или File | Save As (Файл | Сохранить как). Однако в программе Photoshop имеется специальная команда File | Save for Web (Сохранить для Web), открывающая одноименное диалоговое окно с большими воз­можностями для изменения параметров изображений и демон­страции результатов. Диалоговое окно Save For Web (Сохранить для Web) показано на рис. 3.8.

В левой части окна Save For Web (Сохранить для Web) распола­гается панель инструментов. Остановимся на назначении трех инструментов. Инструмент Е2] — Hand (Рука) предназначен для перемещения изображения в окнах просмотра, если изображе­ние не помещается в окне полностью.

Инструмент Щ — Zoom (Масштаб) позволяет изменять масштаб изображения в окнах просмотра. Чтобы увеличить изображение, нужно щелкнуть по нему данным инструментом. Для уменьшения рисунка, в момент щелчка необходимо удерживать клавишу Alt.

Инструмент И — Eyedropper (Пипетка) позволяет выбрать на изображении определенный цвет, который появится в поле Eye­dropper Color (Цвет пипетки), расположенном ниже кнопки.

Правее панели инструментов располагается поле просмотра. В зависимости от выбранной вкладки, поле просмотра может содержать:

О Original (Оригинал) — окно просмотра с оригиналом, т. е. изображением до изменения параметров;

О Optimized (Оптимизированное изображение) — окно про­смотра с изображением после изменения параметров;

О 2-Up (Два изображения) — два окна просмотра с вариантами изображения;

О 4-Up (четыре изображения) — четыре окна просмотра с вари­антами изображения.

В нижней части каждого окна просмотра располагаются основ­ные параметры изображения: формат и размер файла, время пе­редачи файла при определенной скорости и др.

На вкладке Original (Оригинал) всегда демонстрируется вид изо­бражения до изменения параметров. Параметры вариантов изо­бражения в остальных окнах просмотра могут изменяться поль­зователем. Для этого необходимо выделить окно, щелкнув по нему мышкой, и приступить к изменению параметров изобра­жения в правой части диалогового окна. Можно либо выбрать имя набора параметров из списка Preset (Установки), подходя­щего в наибольшей степени, либо выбрать нужный формат из списка Optimized file format (Формат оптимизируемого файла) и начать коррекцию параметров. После коррекции набор парамет­ров можно сохранить под определенным именем и использовать в дальнейшем при работе с другими изображениями. Для этого нужно раскрыть меню Optimize Menu (Круглая кнопка) и вы­брать команду Save Settings (Сохранить установки). Откроется диалоговое окно Save Optimization Settings (Сохранить оптими­зированные установки), в котором набору параметров нужно дать имя. Он будет сохранен в папке Optimized Settings (Оптими­зированные установки). При повторных обращениях к списку Preset (Установки) созданный набор параметров будет уже при­сутствовать. Параметры для форматов JPEG и GIF отличаются друг от друга.

Для формата JPEG можно (рис. 3.8):

□ изменить степень сжатия изображения, следовательно, его качество, используя раскрывающийся список Compression Quality (Качество сжатия) или поле Quality (Качество), рас­положенные в одном ряду. Чем сильнее сжатие, тем ниже ка­чество изображения. Список Compression Quality (Качество сжатия) содержит следующие значения качества:

• Low — низкое;

• Medium — среднее;

• High — высокое;

• Very High — очень высокое;

• Maximum — максимальное.

Поле Quality (Качество) позволяет плавно изменять качество изображения (степень сжатия), устанавливая значения от О до 100;

О установить флажок Progressive (Прогрессивный). В этом слу­чае изображение будет отображаться в окне браузера поэтап­но. На первом этапе оно будет иметь низкое разрешение, ко­торое будет увеличиваться с каждым шагом. Увеличение разрешения означает проявление все более мелких деталей изображения. Это будет заметно при невысокой скорости за­грузки изображения по сети и позволит оценить содержимое изображения до его полной загрузки. Если флажок не уста­новлен, то изображение будет разворачиваться на экране по­строчно сверху вниз и оценить его содержимое возможно только после загрузки значительной части изображения;

О установить флажок ICC Profile (ICC профиль), в результате чего будут сохранены данные управления цветом, которые

Позволят браузеру улучшить качество изображения. Размер файла при этом незначительно возрастает;

□ установить флажок Optimized (Оптимизированный), предва­рительно сняв флажок Progressive (Прогрессивный), что по­зволит не только оптимизировать передачу цвета, но и не­сколько уменьшить размер файла;

□ изменить значение поля Blur (Размытие) от 0 до 2. С увели­чением значения увеличивается размытие, что позволяет сгладить резкие границы деталей изображения;

О задать в поле Matte (Фон), то есть цвет, который будет ис­пользоваться вместо прозрачного фона, не поддерживающе­гося форматом JPEG. Цвет можно выбрать из списка:

• None — по умолчанию;

• Eyedropper Color — выбранный пипеткой;

• White — белый;

• Black — черный;

• Other — другой (открывается диалоговое окно Color Picker (Выбор цвета)).

Вкладка Image Size (Размер изображения) является общей для всех форматов. Она предназначена для изменения размера изо­бражения. При установленном флажке Constrain Proportions (Со­хранять пропорции) достаточно поменять ширину (Width) или высоту (Height) либо в поле Percent (Процент) задать изменение размеров в процентах.

В раскрывающемся списке Quality (Качество) устанавливается способ интерполяции (улучшения качества изображения после изменения размеров). Среди предлагаемых вариантов можно ре­комендовать Bicubic (Бикубическое сглаживание). Размеры из­менятся после нажатия на кнопку Apply (Применить).

При выборе формата GIF изменится содержимое панели уста­новки параметров (рис. 3.9)

На панели установки параметров формата GIF можно выпол­нить следующие действия:

О в раскрывающемся списке Color reduction algorithm (Алгоритм сокращения цветов) выбрать один из алгоритмов перехода от полноцветного изображения к изображению с меньшим чис­лом цветов, так как формат GIF позволяет использовать не бо­лее 256 цветов. Палитра используемых цветов показана на вкладке Color Table (Таблица цветов), расположенной в ниж­ней части панели. Такое преобразование сопровождается ис­кажением цвета некоторых фрагментов изображения и ухуд­шением его качества. Чтобы потери, связанные с уменьшением количества цветов, свести к минимуму, разработаны специаль­ные алгоритмы такого перехода. Возможен выбор одного из следующих алгоритмов:

• Selective (Селективный) — учитываются особенности вос­приятия цвета глазом и требования web-безопасности (по умолчанию);

• Perceptual (Перцептуальный) — учитываются только осо­бенности восприятия цвета человеческим глазом;

• Adaptive (Адаптивный) — используются цвета, встреча­ющиеся в изображении наиболее часто;

• Restrictive (Web) (Web-безопасный) — используются толь­ко web-безопасные цвета (к web-безопасным относятся 216 цветов);

• Custom (Пользовательский) — пользователь может сам расширить палитру используемых цветов, выбирая их пи­петкой на оригинале изображения и нажимая кнопку Adds eyedropper color to palette (Добавить цвет выбранный пи­петкой в палитру), которая располагается в нижней части вкладки Color Table (вторая справа), предварительно выде­лив окно просмотра с недостающим цветом.

Рекомендуется использовать алгоритм, дающий максималь­ное качество изображения. В том же ряду кнопок первой сле­ва идет еще одна полезная кнопка — Maps selected colors to transparent (Сделать выделенные цвета прозрачными). После выделения одного или нескольких цветов в палитре (удержи­вая <Shift> или <Ctrl>), нажав эту кнопку, можно выделен­ные цвета сделать прозрачными. В списке Color reduction al­gorithm (Алгоритм сокращения цветов) можно также выбрать одну из палитр с фиксированными цветами:

• Black&White — изображение преобразуется в черно-белое двуцветное изображение;

• Grayscale (оттенки серого) — изображение преобразуется в черно-белое с 256 оттенками серого цвета;

• Windows — сохраняются 256 цветов из стандартной палит­ры Windows;

О в списке Specify the dither algorithm (Определить алгоритм имитации) можно выбрать один из алгоритмов имитации цветов, отсутствующих на экране монитора: Pattern (Узор), Diffusion (Диффузия), Noise (Шум). В случае выбора одного из алгоритмов в поле Dither (Степень имитации) с помощью ползунка можно установить степень имитации;

О установить флажок Transparency (Прозрачность), обеспечив сохранение информации о прозрачных областях изображе­ния. В случае снятия флажка, прозрачные области будут ок­рашены цветом, заданным в поле Matte (Фон);

О выбрать из списка Specify transparency dither algorithm (Опре­делить алгоритм имитации прозрачности) один из алгоритмов имитации полупрозрачных тонов. Список содержит те же ал­горитмы, что используются для имитации цвета. Необходи­мость такой имитации возникает в связи с тем, что сохранить плавный переход от пикселей изображения к прозрачному фону, например полученный в результате растушевки, невоз­можно. Можно лишь сохранить плавный переход от пикселей изображения к фону, заданному в поле Matte (Фон). Если же в поле Matte (фон) установлено значение None (Нет), то пе­реход станет резким. Использование одного из алгоритмов списка Specify transparency dither algorithm (Определить алго­ритм имитации прозрачности) позволит имитировать плав­ный переход. Поле Amount (Количество) позволяет регулиро­вать глубину имитации перехода (от 0 до 100 %) для алгоритма Diffusion Transparency Dither (Диффузионная ими­тация прозрачности);

О установить флажок Interlaced (Чересстрочная развертка), что обеспечит пошаговую загрузку изображения по сети, с посте­пенным повышением четкости изображения, аналогично ре­жиму Progressive (Прогрессивный) для формата JPEG;

□ в поле Lossy (Потери) можно установить величину допустимых потерь качества изображения (от 0 до 100), наблюдая результат на образце, получив взамен уменьшение размера файла;

О в поле Web Snap (Приближение к Web) устанавливается сте­пень приближения цветов данного изображения к web - безопасной палитре. Рекомендуемое значение "0".