Як стиснути зображення для сайту
Зображення зазвичай найважча частина сторінки. Ось як зробити їх легкими.
1. Зменште до розміру показу
Фото завширшки 4000 px, показане в 800 px, марнує 96% пікселів. Зменшуйте зображення щонайбільше до подвійної ширини показу — цього досить для чіткості на retina-екранах.
2. Оберіть сучасний формат
WebP підтримується всіма сучасними браузерами й зазвичай на 25–35% легший за JPG. AVIF для фото ще легший. PNG залиште лише для графіки, якій потрібне стиснення без втрат.
3. Підберіть якість
Якість 75–82 для більшості фото візуально не відрізняється від оригіналу. Порівнюйте «до» і «після», щоб знайти мінімальне значення, за якого все ще виглядає добре.
4. Видаліть метадані
Дані EXIF додають до кожного зображення десятки кілобайтів і можуть розкрити особисту інформацію. Видаляйте їх перед публікацією.
5. Автоматизуйте
Для наявних бібліотек використовуйте пакетну обробку, а для нових завантажень — API або плагін CMS, щоб кожне зображення оптимізувалося автоматично.