Школа Email-маркетинга

Оптимизация изображений в формате PNG

Оптимизация изображений в формате PNG

Здравствуйте, уважаемые читатели!

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

Главное препятствие к широкому использованию этого формата состоит в плохой сжимаемости файлов и их, сравнительно, больших размерах.

Я уже писал о методах оптимизации изображений в формате PNG, и, если рассмотреть эти методы, можно заметить, что средств для изменения размеров файла очень мало.

Но недавно я узнал новый, оригинальный метод изменения размеров файлов в формате PNG и сразу решил познакомить с ним своих читателей.

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

До сжатия файл имел размер 162 КБ. Попробуем его уменьшить. Для этого воспользуемся программой Adobe Photoshop.Неоптимизированное изображение

Откроем файл и выполним команды Изображение → Коррекция → Постеризация.Постеризация

Здесь мы можем выбрать количество уровней от 4 до 255. Перемещая ползунок, увеличиваем это число до такого значения, при котором видимые изменения становятся малозаметными. Обычно это значение около 40.Количество уровней

После этого сохраняем это изображение обычным способом Файл → Сохранить для Web.

В моем случае размер файла стал 104 КБ. Как видите, все очень просто.Результат оптимизации изображения

Но это еще не все. Есть еще один метод сжатия графических файлов. Для этого можно использовать сервис PunyPNG.сервис PunyPNG

Зайдем на этот сервис, загрузим наш файл и дождемся результатов оптимизации. Как видно, размер файла уменьшился еще на 31% и стал равен 72,1 КБ. Таким образом, этими двумя приемами мы уменьшили размер файла в 2,2 раза.Результат оптимизации изображеия

Оптимизация изображения

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

Исходное изображение Первая оптимизация Вторая оптимизация

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

Я надеюсь, что эта статья оказалась полезной для вас. Напишите об этом в комментариях, поделитесь информацией в социальных сетях.

А пока предлагаю посмотреть любопытное интервью с разработчиком сайтов.

Адаптивная, SEO подготовленная WordPress тема
Очень плохоПлохоСреднеХорошоОтлично (голосов: 1 в среднем: 5,00 из 5)
Загрузка...
Понравилась статья? Поделиться с друзьями:
Комментарии: 4
  1. Serj

    Вообще-то Puny не по феншую сжимает картинки. Портит он их. Незначительно, но… если там есть прозрачность — всё, сливай воду. Для сравнения, загрузил пример в Color Quantizer ( http://kherson.myftp.biz/cq/ ), оригинальная картинка без потерь — 145 Кб (у «пунек» 148), а при конвертация в 256 цветов (да, это потери, но визуально ни не заметны) — 48 Кб; у «пунек» 60 кб, но сравнить качество не вышло — они теперь за режим с потерями хотят денег. (((

  2. aleksandr

    Программа Voralent Antelope лучше всех оптимизирует изображения формата PNG. Только что проверил на вашем изображении, можете убедится сами.

    1. Владимир (автор)

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

    2. Светлана Бобринская

      Спасибо и от меня :)
      С этими картинками прямо беда, пока загрузишь их на сайт — намучаешься.

Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: