Зміна розміру зображень

Що таке інструмент зміни розміру зображень?

Інструмент зміни розміру зображень змінює розміри (ширину та висоту) зображення. Поширені причини зміни розміру: підготовка зображень для соціальних мереж (кожна платформа має конкретні розміри), зменшення розміру файлу для завантаження email або на веб, створення мініатюр та вписування зображень у конкретні макети. Цей інструмент змінює розмір зображень у вашому браузері — жодного завантаження на сервер.

Зміна розміру може масштабувати зображення пропорційно (зберігаючи співвідношення сторін) або розтягувати його до точних розмірів. Зменшення масштабу (зменшення розміру) добре зберігає якість, оскільки пікселі об'єднуються. Збільшення масштабу (збільшення розміру) може знизити якість, оскільки нові пікселі потрібно інтерполювати — зображення може виглядати розмитим при надмірному збільшенні.

Як користуватися цим інструментом

Завантажте зображення, введіть бажану ширину та висоту (або лише один розмір із заблокованим співвідношенням сторін) та завантажте результат зміненого розміру. Інструмент показує оригінальні та нові розміри та розмір файлу. Для швидкого вибору доступні попередньо встановлені розміри для поширених платформ соціальних мереж.

Пікселі та відсотки: два способи задати новий розмір

Більшість редакторів зображень — включно з цим — дозволяють задати цільовий розмір як абсолютне значення в пікселях (наприклад, 1200 пікс. завширшки) або як відсоток від оригіналу (наприклад, 50%). Обидва підходи дають однакові результати, коли математика зводиться до тих самих чисел, але кожен підходить для різних робочих процесів. Використовуйте розміри в пікселях, коли є суворі вимоги платформи (наприклад, фотографія профілю обмежена 400 × 400 пікс.). Використовуйте відсотки, коли хочете рівномірно зменшити пакет зображень і точний вихідний розмір важливий менше, ніж коефіцієнт зменшення.

Співвідношення сторін: фіксоване та вільне масштабування

Співвідношення сторін — це пропорційне співвідношення між шириною та висотою зображення, яке виражається у вигляді такого співвідношення, як 16:9, 4:3 або 1:1 (квадрат). Фіксація співвідношення сторін означає, що інструмент автоматично перераховує другий вимір: змініть ширину — висота підлаштується, зберігаючи вихідні пропорції. Розблокування співвідношення сторін дозволяє вводити обидва виміри незалежно, що розтягує або стискає зображення, щоб точно заповнити новий кадр. Спотворення майже завжди небажане — портретна фотографія, розтягнута в квадрат, виглядає перекошеною — тому залишайте співвідношення зафіксованим, якщо немає конкретної причини для спотворення.

Якщо платформа вимагає точних розмірів, що відрізняються від рідного співвідношення вашого зображення (скажімо, 1200 × 628 для зображення Open Graph), правильний підхід — спочатку кадрувати, потім змінити розмір, а не підганяти силоміць, розблокувавши співвідношення.

Зменшення та збільшення: що насправді відбувається з пікселями

Коли ви зменшуєте зображення, алгоритм масштабування об'єднує кілька вихідних пікселів в кожен вихідний піксель. Оскільки реальні колірні дані поєднуються, результат залишається чітким і ясним. Ви можете безпечно зменшити зображення до будь-якої частки його початкового розміру — результат виглядатиме чисто навіть за дуже малих розмірів.

Збільшення працює навпаки: алгоритм має винаходити нові пікселі для заповнення додаткового простору. Він робить це за допомогою інтерполяції — вибіркового зчитування кольорів сусідніх пікселів і обчислення зваженого середнього для кожного нового пікселя. Білінійна інтерполяція (найпоширеніший браузерний метод) дає результат, який виглядає більш гладким, ніж оригінал при невеликих збільшеннях, але помітно м'якшим або розмитим при великих. Фундаментальне обмеження: збільшення не може відновити деталі, яких не було зафіксовано в оригінальному зображенні. Мініатюра 200 × 200 пікс., збільшена до 1600 × 1600, виглядатиме розмитою, незалежно від алгоритму. Якщо потрібне зображення з високою роздільною здатністю, починайте з джерела вищої роздільної здатності.

Поширені цільові розміри для вебу та електронної пошти

Різні контексти мають різний бюджет пікселів. Ось широко вживані орієнтири:

• Фотографії профілю та аватари: 400 × 400 пікс. — безпечний максимум; більшість платформ відображають їх у 96–200 пікс., але зберігають більшу версію.
• Головні зображення блогів та статей: 1200 × 630 пікс. підходять для більшості макетів і водночас слугують зображенням попереднього перегляду Open Graph для публікацій у соціальних мережах.
• Вбудовані зображення в електронних листах: тримайте ширину зображень до 600 пікс., а загальну вагу листа до 1 МБ, щоб уникнути обрізання Gmail.
• Зображення товарів для інтернет-магазинів: від 800 × 800 до 1200 × 1200 пікс. — достатньо деталей для функції масштабування без сповільнення завантаження сторінки.
• Шпалери для робочого столу: 1920 × 1080 пікс. (Full HD) або 2560 × 1440 пікс. (QHD) для сучасних дисплеїв.

Розміри зображень для соціальних мереж

• Публікація Instagram: 1080 x 1080 пікселів (квадрат) або 1080 x 1350 (вертикальний).
• Обкладинка Facebook: 820 x 312 пікселів.
• Шапка Twitter/X: 1500 x 500 пікселів.
• Банер LinkedIn: 1584 x 396 пікселів.
• Мініатюра YouTube: 1280 x 720 пікселів.

Роздільна здатність, розміри та розмір файлу

Розмір файлу приблизно пропорційний загальній кількості пікселів — ширина помножена на висоту. Зменшення обох вимірів удвічі скорочує кількість пікселів до 25% від оригіналу (0,5 × 0,5 = 0,25), тому фотографія 4 МБ, змінена з 4000 × 3000 пікс. до 2000 × 1500 пікс., важитиме близько 1 МБ залежно від формату та стискання. Ця залежність робить зміну розміру одним з найефективніших способів зменшити розмір файлу перед завантаженням на сайт або надсиланням електронною поштою. Зверніть увагу, що «роздільна здатність» (точки на дюйм, або DPI) — це поняття для друку, яке не впливає на відображення зображення на екрані — для цифрового використання важливі лише розміри в пікселях.

Ваші зображення ніколи не покидають ваш пристрій

Цей інструмент обробляє зображення повністю у вашому браузері за допомогою API HTML5 Canvas. Жодні дані не надсилаються на сервер. Байти зображення залишаються на вашому комп'ютері від моменту скидання файлу до моменту завантаження результату. Це важливо при зміні розміру конфіденційних фотографій — особистих документів, медичних знімків, приватних портретів — оскільки немає етапу завантаження і сервер ніколи не торкається ваших файлів.

Аспекти форматів: JPEG та PNG

Цей інструмент зберігає вхідний формат: файли JPEG дають вивід JPEG, а всі інші формати за замовчуванням дають JPEG, крім PNG, який залишається PNG. Кожен формат має різні характеристики після зміни розміру:

• JPEG (фотографії, складні зображення): JPEG — формат із втратами — кожне збереження перекодовує зображення і вносить невелику втрату якості. Зміна розміру JPEG у цьому інструменті виконується з якістю 92, що дуже високо і практично невідрізнянно від оригіналу при звичайному перегляді. Уникайте багаторазової зміни розміру та збереження одного й того самого JPEG, оскільки втрати накопичуються.
• PNG (скриншоти, графіка, логотипи): PNG — формат без втрат — дані пікселів зберігаються точно. Зміна розміру PNG через цей інструмент зберігає кодування без втрат. Файли PNG більші, ніж еквівалентні JPEG для фотографій, але кращі для зображень із чіткими краями, текстом або прозорим тлом.

Питання якості

При зменшенні розмірів зображення алгоритм зміни розміру об'єднує кілька пікселів в один, даючи чіткий результат. При збільшенні алгоритм повинен створювати нові пікселі шляхом усереднення сусідніх (білінійна або бікубічна інтерполяція), що спричиняє розмиття. Як загальне правило, можна безпечно зменшувати зображення до будь-якого розміру, але слід уникати збільшення понад 150–200% від оригіналу.

Типові помилки, яких слід уникати

• Ігнорування співвідношення сторін: розблокування співвідношення та введення невідповідних розмірів спотворює зображення. Завжди тримайте співвідношення зафіксованим, якщо навмисне спотворення не є метою.
• Очікування, що збільшення відновить деталі: збільшення зображення не виявляє прихованих деталей — воно лише розподіляє наявні пікселі на більший простір, роблячи зображення м'якшим.
• Зміна розміру замість кадрування: якщо платформа вимагає певного співвідношення сторін (наприклад, квадратна фотографія профілю з горизонтального джерела), спочатку кадруйте до правильного співвідношення, потім змінюйте розмір. Зміна розміру горизонтального зображення до квадратних розмірів без кадрування стискає зображення.
• Збільшення розміру для виконання мінімального розміру файлу: деякі платформи відхиляють зображення нижче певного розміру файлу. Збільшення розмірів у пікселях лише для досягнення мінімуму не додає візуальної якості та витрачає пропускну здатність.

Часті запитання

Що таке співвідношення сторін і чому його слід зберігати?

Співвідношення сторін — це пропорційне співвідношення між шириною та висотою (наприклад, 16:9, 4:3, 1:1). Збереження співвідношення сторін означає, що якщо ви змінюєте ширину, висота налаштовується пропорційно (і навпаки). Це запобігає розтягуванню або стисненню зображення. Більшість інструментів зміни розміру за замовчуванням блокують співвідношення сторін.

Як зміна розміру впливає на розмір файлу?

Зменшення розмірів значно зменшує розмір файлу, оскільки менша кількість пікселів вимагає менше даних. Зменшення обох розмірів вдвічі зменшує кількість пікселів до 25% від оригіналу (1/2 ширини помножена на 1/2 висоти = 1/4 пікселів). Точний розмір файлу залежить від формату та налаштувань стиснення, але очікуйте приблизно пропорційного зменшення.

Чи можна змінити розмір PNG без втрати прозорості?

Так. Коли ви завантажуєте PNG, цей інструмент виводить PNG, який підтримує прозорість. API Canvas зберігає альфа-канал під час зміни розміру. Якщо ви зміните вивід на JPEG (завантаживши файл не PNG), прозорість втрачається, оскільки JPEG не має альфа-каналу — прозорі ділянки стають білими.

Чи змінює значення DPI (точки на дюйм) розміри зображення?

Ні. DPI (або PPI — пікселі на дюйм) — це значення метаданих для друку, яке вказує принтеру, наскільки щільно розміщувати пікселі на папері. Воно не впливає на відображення зображення на екрані. Зміна DPI без зміни розмірів у пікселях не змінює файл зображення будь-яким значущим чином для цифрового використання. Якщо вам потрібен більший розмір друку, потрібно більше пікселів — збільшуйте розміри, а не тільки DPI.