Использованные в статье программные пакеты: Adobe Photoshop 6, Macromedia Fireworks 4
В принципе подготовить фотографии для сети сегодня можно очень быстро и довольно просто: достаточно нажать на автоматические кнопки в Photoshop - и готово! Другое дело, когда самое важное - не скорость, а качество. В этом случае процесс существенно удлиняется и делится на 4 этапа: первоначальная ретушь, конверсия цвета, понижение разрешения и оптимизация файла.
Первоначальная ретушь
Первый этап - самый, что ни на есть классический для фотографа. Обычно, если фотография уже печаталась, этот этап уже пройден. Если нет, действуя как обычно, нужно тщательно отретушировать фотографию: фотография в высоком разрешении должна быть почищена, отрегулирована по цвету и контрасту и т.п. Вы меня спросите: "Анатолий, ну зачем же мучиться, все равно же в сети все будет маленькое и в низком разрешении?". Конечно, но, во-первых, у Вас появится готовый для печати файл, что никогда не помешает, а во-вторых, даже детали все равно остаются заметными после изменения масштаба и разрешения фотографии.
Конверсия цвета
Перейдем ко второму этапу, конверсии цвета. Вот здесь начинается самое интересное. Как профессиональный фотограф, имеющий дело с оцифрованными фотографиями, Вы работаете с полным контролем цвета. То есть, работая для печати, используете либо цветовое пространство CMYK, либо профессиональное цветовое пространство RGB типа AdobeRGB или ColorMatchRGB. И, конечно, Ваш откалиброванный монитор светит с температурой в 5000 или 6500 кельвинов. К сожалению, характеристики мониторов непрофессиональных компьютеров, через которые смотрят на сеть большинство посетителей Интернета, сильно отличаются от мониторов профессиональных графических станций.
Во-первых, диапазон цветового пространства непрофессиональных компьютеров существенно уже.
Во-вторых, в Интернете зачем-то возникает проблема разницы в гамме различных операционных систем. Дело в том, что браузеры не умеют распознавать и компенсировать характеристики гаммы, с которой создавалась фотография, и поэтому используют общую гамму операционной системы. Учитывая, что на мониторах, подключенных к PC, гамма равняется 2,5, а на экранах, подключенных к Макинтошам и Silicon Graphics, гамма равняется 1,8, одна и та же картинка будет выглядеть прекрасно на PC-мониторах, но чересчур светло на мониторах Макинтошей и SGI.
В-третьих, большинство непрофессиональных мониторов светят с температурой в 9300 кельвинов без какой-либо компенсации изображения.
Для того чтобы охарактеризовать цветовое пространство непрофессиональных компьютеров, W3C (World Wide Web Consortium) разработал пространство sRGB, которое берет за основу узкий диапазон цветов и усредненную гамму 2,2. Поэтому sRGB принято рассматривать как стандартное цветовое пространство Интернета. То есть, решение первых двух несоответствий - это конвертировать подготовленный файл из Вашего рабочего пространства в рабочее пространство sRGB.
Для конверсии цветового пространства фотографии в Photoshop можно воспользоваться инструментом конверсии ICC-профилей. В английском варианте Photoshop он находится в "image > mode > profile to profile". Изначальный профиль "source space" - это профиль цветового пространства фотографии. Конечный профиль "destination space" - это sRGB. Параметр "intent" обычно лучше оставить на "perceptual". Можно переконвертировать профиль ICC файла и другими способами, например, поменяв общее рабочее пространство Photoshop на sRGB и открыв затем файл с конверсией профиля.
Все сделали? Замечательно! Теперь у Вас есть отретушированный файл высокого разрешения с профилем рабочего пространства sRGB! Сохраните полученный файл, проверив, что он будет сохранен с цветовым профилем sRGB. А как же быть с гаммой и разницей в температуре экрана?
В принципе, Photoshop сам конвертирует гамму из Вашего рабочего цветового пространства в гамму sRGB под 2,2g. Что касается разницы в температуре экрана, то пространство sRGB рассчитано на монитор с температурой в 6500 кельвинов, и конверсии в 9300 кельвинов не произойдет. Поэтому, лучше всегда посмотреть на фотографию глазами сетевого пользователя и подкорректировать цвета и гамму.
Для того чтобы превратить свою графическую станцию в непрофессиональный компьютер, необходимо выполнить следующие действия.
Во-первых, руками переключите температуру Вашего монитора на 9300 кельвинов.
Во-вторых, с помощью Adobe Gamma Control (или с помощью любой другой программы типа ColorSync на Макинтоше или драйвера графической платы на PC) поменяйте цветовой профиль ICC Вашего монитора на профиль с усредненной гаммой в 2,2 и температурой экрана в 9300 кельвинов.
В-третьих, отключите механизм контроля над цветом в Photoshop или лучше просто откройте сохраненную фотографию в какой-либо программе без оного, например в Fireworks. Важно помнить, что единственный способ отключить контроль над цветом в Photoshop 6, оставаясь в рабочем цветовом пространстве sRGB, - это выбрать "edit > color settings > web graphics defaults" а затем включить "view > proof colors", не забыв выбрать "view > proof setup > monitor RGB".
Когда Вы увидете результат глазами посетителя Интернет, Вам, скорее всего, придется немного подкорректировать цвет и гамму фотографии.
Понижение разрешения
На третьем этапе необходимо понизить разрешение фотографии с 300dpi, что нужно для обычной печати до 72dpi, которой хватит для сети. Почему 72dpi? Потому что среднее разрешение мониторов на сегодняшний день - 72 dpi, а на большее, чем 95 dpi они, к сожалению, вообще не тянут. А поскольку Интернет мы смотрим через экран, 72dpi - как раз самое оно. В параметрах разрешения файла "image > image size" задайте точные высоту и ширину фотографии в пикселях (разрешение 72dpi). Как только Photoshop пересемплирует картинку, проверьте размер фотографии, выбрав в меню "view > actual pixels", - Photoshop покажет картинку в разрешении 72dpi.
| Секрет повара: лучше пересемплировать фотографию в несколько приемов, таким образом, сохраняя наибольшее количество деталей и текстур. Принцип такой: пересемплировать за каждый прием не более чем на 50% от изначального разрешения. Между приемами неплохо пройтись фильтром резкости Unsharp Masking. |
Оптимизация файла
Наконец, последний этап - оптимизация файла. Важно помнить, что единственный пригодный для фотографий в сети формат JPEG сжимает размер файла с потерями в качестве, в отличии, например, от LZW-компрессии для TIFF-файлов. Уровень качества и, соответственно, сжатия размера файла JPEG выражается в процентах. 100% - никакого сжатия, максимальное качество, 50% - сжатие на 50%, качество в два раза хуже оригинала. К сожалению, JPEG с трудом передает резкие грани. Там, где много резких цветовых граней или деталей, он добавляет большое количество артефактов и много шума. То есть, чем больше деталей у фотографии, тем меньше ее можно будет сжать без сильных потерь в качестве.
Лично я предпочитаю работать над оптимизацией JPEG в Fireworks от Macromedia. Не говоря уже просто об эффективности Fireworks в области дизайна для Интернета, полевые опыты показали, что при одинаковом качестве изображения Fireworks делает конечные файлы меньше, чем Photoshop. В любом случае, процесс будет один и тот же.
Откройте фотографию в Fireworks, или войдите в "save for the web" в Photoshop. Выберите в параметрах оптимизации фотографии "optimize" сначала формат JPEG, а затем уровень качества. Я всегда начинаю с самого низкого, примерно 60%, а потом постепенно поднимаюсь в качестве. После того, как Вы выбрали нужное качество, перейдите в двойной просмотр "2 up" , где Вы увидите слева оригинал без компрессии, а справа конечный JPEG. Внимательно изучите полученный JPEG. Запомните полученный размер файла. Если Вы не довольны качеством, поднимитесь до 65%, сравните с оригиналом, проверьте размер файла. И так далее. Обычно, надо остановиться на компромиссном уровне, когда уже довольно тяжело углядеть артефакты и шум JPEG, а размер файла еще не слишком большой.
Что имеется в виду под выражением "размер файла еще не слишком большой"? В идеале считается, что каждая HTML-страница не должна превышать 30-35 килобайтов. Но, например, на моем фото-сайте www.anatolyivanov.com страницы весят 50-80 кило. Причем нужно учитывать, что вес страницы состоит из веса кода HTML и JavaScript и веса картинок.
Уровень качества JPEG варьируется в зависимости от изображения: от 65% для простой по композиции фотографии с нерезкими цветовыми перепадами до 95% для очень резкой, контрастной и детальной фотографии. Кроме того, иногда артефакты можно спрятать в изобилии деталей. Если Вы работаете в Fireworks, обязательно сохраните изначальный файл PNG. Если Вы передумаете, всегда можно будет вернуться к оригиналу и поменять параметры. Когда Вы достигнете нужного баланса между качеством и размером, экспортируйте Ваш JPEG "file > export" (Fireworks) или запомните его, нажав "ok" (Photoshop).
Все! Ваша фотография готова к публикации в сети!
Весь процесс может показаться длинным, но на практике он занимает не так много времени. Если Вам нужно приготовить за одну ночь 200 фотографий можно, конечно, воспользоваться очень мощной командой "batch process" в Fireworks. К сожалению, в этом случае, качество будет усредненное. Если же вам надо приготовить 40 фотографий для Вашего он-лайн портфолио, не поленитесь потратить максимум времени, чтобы приготовить свои фотографии. Ведь именно по этим фотографиям о Вас будут судить как о фотографе!
Хочу также добавить, что существуют более сложные методы подготовки фотографий к публикации в Интернет, такие как селективная оптимизация или использование таблиц HTML вкупе с разрезкой на ломтики, о которых я расскажу в следующих статьях.
