JPEG и PNG — в чём разница форматов?

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

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

PNG 24 — это формат изображений, который работает с полноцветными изображениями, использует сжатие без потерь и позволяет сохранять прозрачность. Настроить качество сохранения в PNG 24 невозможно, однако, можно адаптировать сохраняемое изображение для достижения минимального размера файла: для этого можно снизить количество цветов в изображении. PNG 24 оптимален для изображений с небольшим количеством цветов (например, для иконок, схем и рисунков). PNG 8 — это более компактный формат, но применимый только для изображений с ограниченных количеством цветов (256 — это максимум).

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

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

Сжатие изображений — это один из способов ускорения загрузки сайта. Сделать изображения более «легкими» можно как уменьшив их физический размер в пикселях, так и путём оптимизации параметров сохранения.

На «широких» каналах размер изображений на сайте на скорость загрузки сайта влияет не очень сильно, но для пользователей, просматривающих сайт через мобильный интернет (EDGE или 3G), большие изображения могут быть проблемой. На посещаемых сайтах также могут быть сложности с загрузкой канала сервера — неоптимизированные изображения могут существенно сказываться на объёме трафика (это проблема, если он платный) или просто «забивать» канал.

Узнать больше →

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