Что такое Progressive jpeg и зачем он нужен сайту

Но можно значительно уменьшить их вес, если предварительно сжать изображения. Чем сильнее сжата картинка, тем быстрее она будет загружаться и тем быстрее будет загружаться сайт в целом. Но важно соблюдать баланс, ведь чем больше сжатие, тем хуже становится качество изображений, на практике сжатие без видимых ухудшений в качестве изображений достигается при качестве 80 из 100. В статье, говоря о Progressive jpeg, мы подразумеваем его использование совокупно со сжатием с качеством 80.

Что такое Progressive jpeg

Самый популярный в Интернете формат изображений — JPEG. Для сжатия картинок в этом формате есть несколько режимов сжатия. Один из них — Прогрессивный (Progressive jpeg или просто PJPEG).

При использовании режима Progressive JPEG сжатые данные записываются в выходной поток в виде набора сканов. Каждый последующий скан описывает изображение с большей степенью детализации.

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

Чем отличается Прогрессивный режим сжатия изображений от базового

Базовый последовательный (baseline) режим сжатия картинок в формате jpeg кодирует и декодирует изображение сверху вниз. Если у пользователя медленное соединение, то сначала он увидит верхнюю часть картинки, потом еще часть ниже и так далее, пока не загрузится вся картинка целиком.

Прогрессивный режим (progressive) работает иначе. Он загружает изображение в несколько проходов. Первый показывает размытую картинку, а все последующие проходы увеличивают четкость и уровень детализации. В итоге создается изображение в полном качестве.

Преимущества Progressive jpeg

В отличие от базового режима сжатия изображений, у прогрессивного есть ряд преимуществ:

• Удобство. Посетители сайта сразу видят все изображение целиком и могут принять решение дожидаться окончания полной загрузки или перейти далее. Особенно это актуально на сайтах интернет-магазинов, когда посетитель ищет конкретный товар.
• Меньший вес файла. Progressive jpeg, совместно с обычным сжатием,  может уменьшить размер файла в 2 и более раза.
• Корректное отображение размеров. При базовом режиме сжатия верстка страницы может нарушаться, когда картинка грузится по частям. С прогрессивным сжатием такого не происходит, т.к. изображение сразу занимает положенное ему место.
• Привлекательность. Психологически прогрессивный режим воспринимается лучше, т.к. посетителям кажется, что изображение загружается быстрее, чем в базовом режиме.

Недостатки Progressive jpeg

У режима сжатия Progressive jpeg есть и свои недостатки. Хотя их не много, но все же следует учитывать при подготовке изображений для сайта.

• Скорость загрузки. Декодирование Progressive jpeg обычно происходит немного медленнее, чем у картинок, сохраненных в базовом режиме сжатия. Это особенно актуально для мобильных устройств с ограниченными ресурсами, но это перекрывается приемуществами прогрессивного сжатия.
• Размер изображения. Не всегда размер картинок, сжатых в прогрессивном режиме, меньше. Например, прогрессивное сжатие очень маленьких изображений (миниатюр) может наоборот увеличить их размер по сравнению с базовым сжатием.

Как сжимать изображения в Progressive jpeg

Большинство графических редакторов по-умолчанию сохраняют jpeg изображения с базовым сжатием. Это легко можно исправить, если нужно сохранить картинку с прогрессивным сжатием.

Например, в программе Photoshop следует выбрать команду Файл – Сохранить для веб, и перед сохранением указать формат Progressive JPEG. Также в сети есть множество сервисов, которые позволяют привести изображения к формату Progressive jpeg.

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