|
*** |
Прокрустово ложе для графикиНедавно мне довелось
вступить в переписку с одним из читателей
нашего издания. Читатель интересовался, с
каким разрешением необходимо сохранять
графику для последующей публикации в Сети?
В различных онлайновых банках хранятся
графические файлы с установленным
разрешением, как правило, 72 пикселя на дюйм
(dot per inch, dpi), хотя нередко можно
натолкнуться на разрешение 96 и даже 300 dpi.
Какой вариант предпочтительнее? Пришлось
отвечать, что наиболее подходящее
разрешение для отображения на экране - 1 dpi.
Или 1200 dpi. Или любое другое значение. Именно
так, не удивляйтесь.
Все дело в том, что монитору
абсолютно безразлично, что за картинку ему
подсовывают, с каким разрешением она
сохранена. Его интересует лишь размер в
пикселях. Скажем, если размер картинки 800х600,
и это совпадает с выбранным видеорежимом,
то картинка займет весь экран, а при
видеорежиме 640х480 изображение целиком на
экран не вместится. Реальное же
графическое разрешение определяется
техническими характеристиками самого
монитора, не более того.
Предположим, вы работаете в
режиме 800х600 пикселей. Сколько в таком
случае пикселей умещается на диагонали
рабочей поверхности экрана? Вспоминаем
теорему Пифагора и с легкостью вычисляем:
ровно тысяча. Теперь возьмем линейку и
измерим высоту и ширину рабочей
поверхности, в сантиметрах. У меня
получилось 27х20 см. При таких размерах
диагональ рабочей поверхности равна 33,6 см
или 13,22 дюйма. Разделим количество
пикселей, умещающихся на диагонали, на ее
длину. Получилось что-то около 76 пикселей
на дюйм, dot. Это - графическое разрешение моего
монитора. Причем, в данный момент
времени. А теперь я воспользуюсь меню
настройки монитора и "сожму" рабочую
поверхность по горизонтали. Нетрудно
догадаться, что графическое разрешение
изменится, точнее, увеличится. А картинка
размером 800х600 как занимала весь экран, так
и занимает. Что же, ее разрешение тоже
увеличилось? Нет, конечно. Так сколько dpi
нужно указывать при сохранении файла,
чтобы он корректно отображался на экране любого
монитора в любой момент времени?
Сколько ни укажи, на всех все равно не
угодишь, верно?
И последний, сугубо эмпирический
эксперимент. Возьмите любой графический
файл, откройте его в Photoshop и сохраните
несколько версий с разным графическим
разрешением. При этом следите, чтобы
ширина и высота изображения, в пикселях, не
изменялись. Теперь откройте все
сохраненные таким образом файлы и найдите
среди них хотя бы одно отличие. Не нашли?
Что и требовалось доказать.
Вот и вся премудрость. Так что при
подготовке графики к онлайн-публикации
стоит думать не о разрешении, а о
максимальной оптимизации размера файла.
Для скорейшей загрузки в браузер, снижения
трафика и экономии дискового пространства
на веб-сервере.
"Кстати", - спросил я своего
собеседника в очередном письме, - "Какой
программой графику оптимизируете?". "Photoshop
6.0. Точнее, прилагающейся к нему ImageReady
3.0", - был ответ. Что ж, продукты компании Adobe
- чуть ли не стандарт работы с графикой. Но,
если в области полиграфии Adobe
действительно нет равных, то для
оптимизации онлайновых публикаций есть
продукты и поэффективнее. Например, Ulead
SmartSaver Pro 3.0.
Проведем небольшой эксперимент. В
комплект поставки Photosop 6.0 входят несколько
файлов-образцов. Возьмем один из них - Astronaut(CMYK).tif.
Качественный снимок, вполне подойдет для
наших задач. Правда, файл велик и придется
немного его преобразовать, прежде чем
начинать экспериментировать. Во-первых,
приведем его к цветовой модели RGB,
поскольку будем отображать картинку на
экране. Во-вторых, уменьшим физический
размер. При ширине 200 пикселей высота файла
составляет 155 пикселей. Все готово к
оптимизации объема. Нажимаем комбинацию
клавиш Shift+Ctrl+M - и файл переносится в
ImageReady, в которой и будет происходить
оптимизация.
Попробуем сохранить этот
фотоснимок в формате JPEG. На вкладке Optimize
выбираем JPEG, устанавливаем значение Quality
(Качество) на 75% и ставим галочку напротив
опции Optimized. ImageReady тут же подсчитывает
размер оптимизированного файла: 20 419 байт.
Теперь откроем наш файл в SmartSaver Pro
и проделаем сходные манипуляции: Параметры
оптимизации для JPEG-формата Оказывается, что из прокрустова
ложа SmartSaver выйдет файл размером 12 447 байт.
Почти сорок процентов экономии, шутка ли!
Впрочем, нам ведь нужно не только ускорить
загрузку картинки в браузер. Неплохо было
бы еще сохранить ее качество. Хотя бы на
приемлемом уровне. Хорошо, вставим оба
файла на эту страницу. Для сравнения.
Кстати, заодно попробуйте угадать, какой
из файлов оптимизирован в ImageReady, а какой - в
SmartSaver?
Различия есть, хотя бы в цветовой
гамме, в уровне яркости и т.п. Но и тот, и
другой файл вполне могут быть
опубликованы на веб-странице, не правда ли?
Так зачем тогда использовать файл более
"тяжелый"? Вывод очевиден: для
оптимизации используем SmartSaver. Кстати, файл,
подготовленный с его помощью, помещен
слева.
Сходные результаты будут
получены и при преобразовании в формат GIF.
На этот раз воспользуемся файлом Ducky.tif.
Приведем изображение к размеру 183х200
пикселей, а затем проиндексируем его и
применим алгоритм LZW-сжатия. Другими
словами, преобразуем в формат GIF. В обеих
испытуемых программах укажем следующие
параметры оптимизации: палитра Optimized (Adaptive
в ImageReady), количество цветов - 256, Dither - 100%.
Как видим, качество изображения вновь
вполне сопоставимо:
Что же касается объема файлов, то
SmartSaver вновь более экономичен: 10 872 байта
против 16 293! Налицо 33% экономии. Неплохо, да?
Однако внимательный читатель не
преминет спросить с сарказмом: "Если
SmartSaver так хорош, то зачем автор держит на
своей персоналке еще и Photoshop? Для подобных
экспериментов, что ли?" Нет, конечно.
Дело в том, что SmartSaver потому так и
называется (позвольте перевести это
название как Умный или жесткий
сохранитель), что великолепно
оптимизирует графику для Паутины. Он
работает с готовыми картинками, а вот
возможности создания и редактирования
изображений в него не заложены. Он не
поддерживает фильтры, не работает со
слоями, не управляет цветовыми и прочими
характеристиками изображения. Вот и
приходится для этих целей использовать
старый добрый Adobe Photoshop, альтернативы
которому я пока не нашел. Ссылки по теме: Автор статьи: Александр Якутский Источник: http://www.softkey.info/ | ||
| ||
Copyright © "Internet Zone", info@izcity.com |