Несколько слов об оптимизации jpeg изображения

Сохранение jpeg в Photoshop для размещения на сайте

Мне частенько приходится делать изображения для размещения на сайтах. Притом это не всегда фотографии, в большом разрешении. Часто бывает, что нужно выложить небольшую или даже мелку картинку и ее размер – часто играет значение. Поэтому, при сохранении изображений для этих целей – всегда использую опцию Photoshop Save for Web and Devices … (Alt+Shift+Ctrl+S).

В принципе, единственный параметр, которым «играешься», чтобы получить нужный результат является: Quality (качество), который изменяется от 0 – 100. А результат – естественно, максимальное качество, при минимальном размере.

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

Quality 100

Нет, абсолютно нет никакого смысла сохранять изображения с этим параметром качества. Нужно помнить, или знать, что этот параметр – не процентное качество от исходного, а предел оптимизации. При таком параметре сохраняемое изображение будет иметь неоправданно большой объем. Качества 90 – 95, вполне достаточно для сохранения изображения практически без потерь.

К слову, о фотографиях, для получения качественной картинки для размещения, например на странице сайта Я обычно использую параметр качества 75 – 80. Этого вполне достаточно на мой взгляд.

Quality 50

А вот недавно, узнал один интересный факт. Работа jpeg алгоритмов такова, что изображение разбивается на блоки 8х8 пикселей, и уже внутри них происходит оптимизация. Но! При установке качества в 50 единиц и ниже, в Photoshop, включается дополнительный алгоритм оптимизации — color downsampling. Идея его в том, что при всех прочих равных условиях дополнительно усредняется цвет в соседних 8-ми пиксельных блоках. Итог работы этого алгоритма – можно видеть на картинке внизу.

Изображение сохранено в формате PNG, чтобы избежать любых искажений и артефактов. 1-й элемент – исходный, второй – качество 50, третий – качество 51. Думаю, дополнительных пояснений не требуется.

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

If you enjoyed this post, make sure you subscribe to my RSS feed!

Похожие записи:

Комментарии (6) на запись “Несколько слов об оптимизации jpeg изображения”

  1. Владимир пишет:

    Весьма полезно! Про сохранение Save for Web знал, а вот про градацию при оптимизации и влияние на качество не знал! Спасибо за полезную новость!
    У Вас нет случайно блога в ЖЖ? Я бы к себе добавил в закладки эту статью, мало ли, может пригодится кому показать!

  2. Bzzz пишет:

    Я тоже до недавнего времени не знал, про такие нюансы. Решил поделиться, и Я рад, что это оказалось полезно кому-то еще.
    Блога в жж нет, но в закладки можете добавить, или ссылочку поставить на эту статью. Будет приятно.

  3. Владимир пишет:

    Напишу ссылку конечно, но есть маленький совет! Если есть возможность, поставьте кнопки такие как на других сайтах «разместить ссылку с анонсом статьи в «Вконтакте», «Live Journal»», чтоб одним нажатием статья была добавлена, и все мои подписчики смогут её прочитать, для этого мне и другому любому человеку не надо будет даже заходить на свои сайты!

  4. Bzzz пишет:

    Да, давно все собирался поставить кнопки социальных сетей, но никак руки не доходили. Спасибо за напоминание, уже добавил.

  5. Влаадимир пишет:

    Воспользовался кнопочкой! Работает :) Очень удобно!

  6. Bzzz пишет:

    Рад, что все получилось

Оставить комментарий