§12. Преобразование изображений для Web

Это не менее сложно, чем процесс создания самих изображений.

Необходимо учесть следующие факторы:

• может ли быть сохранен точный вид оригинала;

• в каком формате производить сохранение;

• какой цветовой режим применить;

• какая нужна разрешающая способность;

• каков результирующий размер файла.

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

Слияние– появление сплошных линий цвета в графике или тени, которая должна иметь плавные переходы.

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

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

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

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

При необходимости использования прозрачных фонов или любых опций палитры Indexed Color приходится выбирать GIF89a.

Выбор цветового режима. Главная проблема на Web – прореживание полутонов. Поэтому разумно воспользоваться Web-палитрой. Прореживаемые цвета будут заменены на ближайший непрореживаемый аналог в палитре, тональный диапазон снизится.

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

Цветные логотипы и штриховая графика преобразуются сравнительно легко. Можно не только использовать опцию палитры Web в режиме Indexed Color, но и попросту изменять цвета вручную в Photoshop. С применением палитр Adaptive или Exact это позволяет значительно сократить количество цветов в изображении, а следовательно, и размер файла.

Выбор разрешающей способности. Большинство фотографий хорошо выглядят при приведении их к 72 dpi. Размытые фотографии могут быть приведены к более низкому разрешению без заметной потери качества. В принципе можно получать небольшие файлы с разрешением до 40 ppi. Однако при наличии на фотографии неорганических объектов (деталей машин, кирпичных стен, металлоизделий) стоит перейти к более высокому разрешению (96 ppi ). Их придется сохранять в JPEG с установками High или Maximum, чтобы избежать потери деталей. Для формата GIF, ориентированного на четкие линии и плоскоцветные области, различие межлу 72 и 96 ppi не столь существенно.

Выбор размера изображения. Для расчета степени увеличения изображения без нарушения детальности нужно поделить первоначальное значение разрешающей способности на заключительное. К примеру, изображение с разрешением 300 ppi может быть увеличено до 416% без потери качества при заключительном разрешении 72 ppi (300/72 = 4,16, или 416%). Уменьшать изображение можно только на 50%. Большее уменьшение ведет к потере деталей и полутонов.

Можно преобразовать большую диаграмму, вырезав важные детали в отдельные файлы. Пользуясь большим файлом в качестве руководства, зритель может смотреть усеченные изображения, чтобы увидеть детали. Большой файл может быть изображением-картой с областями, залинкованными на детальные фрагменты.

Можно преобразовать одно изображение к размерам и разрешающей способности другого. Это удобно при использовании нескольких изображений при повторной эксплуатации тега IMG без необходимости задавать высоту и ширину каждого изображения.

Использование дуплексов. При неизбежности потерь за счет приведения к 72 ppi для Internet можно попытаться восстановить привлекательность первоначальной печати из режима Grayscale в режим Duotone. Затем изображение преобразуется в режим Indexed Color или RGB.

Если сразу преобразовать изображение в Indexed Color, оно будет содержать 256 цветов. Если сначала в RGB, а затем в Indexed Color, 222 цвета. С использованием дуплекса можно уменьшить число цветов с 222 до 50 без существенной потери качества.

Расчет числа необходимых цветов производится обратным преобразованием в RGB и попыткой экспорта в GIF89a.

Уменьшение цветного изображения до минимума. Для уменьшения размера файла цветного изображения можно уменьшить число цветов, используя палитру Adaptive или Exact. При этом можно узнать точное число цветов в RGB-изображении, попытавшись экспортировать файл в GIF89a. По возможности можно сократить число используемых цветов.

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

В самом общем случае, когда цветовая граница не расположена горизонтально или вертикально, а по кривой «рассекает» пикселы (в векторном варианте), проще красить такие «рассеченные» пикселы в тот из граничащих цветов, какого на каждый пиксел приходится больше. Такой метод хорошо работает для весьма малых пикселов (при печати на лазерном принтере). На экране этот подход неприменим из-за больших размеров пикселов. Здесь пиксел закрашивается промежуточным цветом, подобранным таким образом, чтобы пропорция смешиваемых цветов соответствовала пропорции, в которой пиксел делится векторной цветовой границей. Это и есть сглаживание контура (anti-aliasing). Такое сглаживание компенсирует низкое разрешение экрана, маскируя его пиксельную решетку.

Применение сглаживания улучшает читаемость шрифтов даже небольшого кегля. Правда, при высоте буквы менее 6 пикселов применение этого метода бессмысленно, лучше выбрать системный шрифт Windows без засечек. Сглаживание вредно и в изображениях, сопоставимых по размеру с единичными пикселами: их лучше прорисовывать «попиксельно» вручную.

Прозрачные области GIF-изображений не поддаются сглаживанию, поскольку в формате GIF не поддерживается частичная прозрачность – пиксел либо прозрачен, либо нет. Сопряжение контура не с фоновым цветом, а с уровнем прозрачности (условие сохранения сглаживания над любым фоном) возможно только в формате PNG. В формате GIF применение прозрачности и сглаживания приводит к появлению неприятного ореола.

Выводы:

• если фон под изображением не известен заранее, лучше отказаться от сглаживания;

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

Использование диффузии. Применение диффузии (смешивания пикселов разных цветов взамен смешения цветов самого пиксела) позволяет значительно ограничить размеры палитры. Изображение, требующее без диффузии наличия не менее 128 цветов, может быть с диффузией сведено к 64 или 32 цветам без серьезного ухудшения качества [1]. При этом диффузия (шум) сильно ухудшает сжимаемость изображения. Объем файла может возрасти.

На резких цветовых границах со сглаживанием диффузия приводит к появлению неустранимых зубцов.

Настройка сканера. При сканировании цветных изображений желательно сначала иметь миллион цветов, чтобы с максимальной точностью зафиксировать каждый бит цвета. Затем изображение уменьшается до нужных размеров. В большинстве случаев итоговый размер изображения составляет 12 дюйма по ширине. Разрешение – 72 ppi. Удобно использовать функцию Descreen для удаления лишних точек.

В связи с тем, что изображение имеет точечный растр, возможно проявление неприятного визуального эффекта – муара. Чтобы избавиться от него можно выполнить деэкранирование внутри программного обеспечения сканера, удалив случайные пятна внутри Photoshop или использовать комбинацию фильтров для устранения точечного растра. Внутри Photoshop это опции Noise | Despectle by меню Filter. Фильтр «смягчает» все изображение. Однако, поскольку настройка параметров здесь невозможна, все изображение может получиться размытым.

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

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

Сейчас программа Photoshop позволяет зафиксировать авторство работы. Фильтр Digital Waterwork внедряет водяной знак таким образом, чтобы он не был заметен при просмотре, но сохранялся при копировании изображения.

Фильтр Real Waterwork позволяет из Photoshop связаться с корпорацией DigiMarc и провести поиск сведений об авторском праве на изображение, если оно зарегистрировано.

Перед употреблением фильтра необходимо связаться с корпорацией DigiMarc для регистрации. Компания за $150 в год предоставляет идентификатор создателя Web-пространства для изобразительной информации.

Для знакомства с фильтром можно использовать встроенный демонстрационный идентификатор.

Если изображение имеет вложенный водяной знак, его можно прочитать, выбрав Real Waterwork из подменю DigiMarc в меню Filter. Если при этом выбрать Image URL, можно сразу связаться с корпорацией DigiMarc для просмотра информации о регистрации.