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

Как правильно сжимать фото для сайта

JPEG vs WebP, какое качество выбрать, когда включать lazy-loading.

JPEG, PNG, WebP — что выбрать

  • JPEG — фотографии. Сжатие с потерями, маленький размер. Не подходит для логотипов и прозрачности.
  • PNG — логотипы, скриншоты, прозрачный фон. Без потерь, но размер больше.
  • WebP — современный формат от Google. На 25-35% меньше JPEG при том же качестве. Поддерживают все браузеры с 2020.

Качество JPEG

85% — незаметная разница от оригинала. 70-75% — разумный компромисс для веба. 50% — уже заметные артефакты, но размер в 4-5 раз меньше. Ниже 40% — только для превью.

Инструменты

Сжать фото сделает меньше размер, ресайз уменьшит разрешение, формат переведёт между PNG/JPG/WebP.

Инструменты по теме