Статьи про веб-графику: различные таблицы цветов, сборник статей по web-графике, Какими графическими пакетами пользуются веб-дизайнеры
Rambler's Top100 Яндекс цитирования






Оптимизация изображений в формате JPG
Программы для оптимизации изображений.

В этой статье рассмотрена оптимизация изображений в формате JPG, выборка оптимальных коэффицентов сжатия. Рассмотрены программы и модули для оптимизации изображений. Всё на наглядных примерах.
Для осуществления оптимизации нужен графический пакет или утилита, которые позволяют нам регулировать степень сжатия изображения. PhotoShop в базовой конфигурации не позволяет нам свободно регулировать степень сжатия (есть только несколько фиксированных значений). Для него можно найти модули, специально подключаемые для осуществления этой операции. Но в последних версиях PhotoShop возможность регулировки степени сжатия появилась.
Но для оптимизации графики лучше воспользоваться программами типа PhotoPaint или PaintShopPro, они проще и удобнее. В этих программах возможно регулирование степени сжатия, либо заданием процента потерь, либо заданием значения качества от 0 до 255.


Как определить оптимальную степень сжатия?

JPG-файл с сильными искажениями, оптимизация изображений
JPG-файл с сильными
искажениями. Размер: 2,02 кб.


Для этого нужно сохранить фотографию при нескольких значениях коэффициента сжатия, а затем внимательно рассмотреть ее. Потерей качества будут так называемые "дрожащие контуры", наиболее заметные в местах контрастных переходов, и появление пятен в областях с плавными переходами (на рисунке выше это хорошо видно). Тот коэффициент сжатия, при котором искажения еще не видны, но с увеличением его на один пункт или процент, становятся заметными, и будет оптимальным. Размер файла при таком разрешении будет минимальным и без потери качества.

Если такую операцию проводить с каждой фотографией, то это займёт слишком много времени. Но есть выход - все фотографии можно рассортировать на некоторые подтипы (черно-белые фотографии, тонированные фотографии, пейзажи, ночная съемка и т.д.) и к каждой такой группе подобрать свой оптимальный коэффициент. Впоследствии можно просто применять ранее найденный коэффициент ко всем подобным фотографиям.

Ниже представлены две одинаковые фотографии, но только с разной степенью коэффициента сжатия JPG. Слева - изображение, записанное в PhotoShop (не оптимизированное), а другое оптимизировано при помощи Ulead SmartSaver Pro. Обратите внимание на размеры изображений - они различаются более чем в три раза (при почти одинаковом качестве изображения).

Оптимизирование JPG, Не оптимизированная фотография
Оптимизация JPG, Оптимизированная фотография
Не оптимизированная: 14,91 кб.
Оптимизированная: 4,14 кб.



Использование прогрессивной развертки

И еще один метод оптимизации JPG-изображений - это использование прогрессивной развертки. Такой приём практически не сказывается на размере фотографии, но очень заметно при загрузке. В случае записи изображения в стандартном формате, вывод на экран осуществляется горизонтальными полосками, и до загрузки всего изображения трудно определить его смысл.
При записи файла в прогрессивном формате изображение появляется сразу целиком, но в грубой форме, (например, сильно размытым) и постепенно улучшается. Это дает посетителям возможность сразу же оценить фотографию и решить, стоит ли ожидать ее докачки, что позволит сэкономить немного времени при просмотре сайта.


Прогрессивная развертка JPG поддерживается всеми броузерами, но не каждый графический пакет может записывать в этом формате. Последние версии PhotoShop и PaintShopPro умеют это делать.


Оптимизация JPG-файлов в Adobe Photoshop

При сохранении изображения в формате JPG, основной является Quality (Качество). Регулятор задается от 0 до 100. При выборе 0 получаем максимальные потери качества, при выборе 100 минимальные, т.е. получаем файл с высоким качеством. Второй параметр Blur отвечает за четкость изображения, значения меняются от 0 до 2. За счет удаления самый мелких деталей можно еще на порядок уменьшить размер файла, при этом, не слишком ухудшив его внешний вид. Опция Progressive сохраняет файл в прогрессивном виде, при котором файл грузиться поэтапно, как это было при сохранении изображения в формате GIF.



На этом этапе мы закончим рассматривать оптимизацию JPG-изображений. В других статьях Вы найдёте оптимизацию других типов изображений, а также более подробные инструкции по использованию выше указанных программ.