Почему изменение размера — обычно первое средство от тяжёлого изображения
Современные камеры выдают гораздо больше пикселей, чем нужно для большинства задач. Фото с 12-мегапиксельного телефона — это примерно 4000×3000 px, 48-мегапиксельная матрица даёт около 8000×6000. Экран ноутбука показывает порядка 1920×1080, колонка блога обычно шириной от 800 до 1200 px, а превью в письме ещё меньше.
Размер файла растёт вместе с количеством пикселей, а не только с шириной. Если уменьшить обе стороны вдвое, пикселей останется в четыре раза меньше, поэтому JPG на 4 МБ с разрешением 4000×3000 при 2000×1500 обычно весит около 1 МБ — и на обычном экране разницы не видно. Именно поэтому уменьшение разрешения, как правило, помогает лучше любых настроек сжатия, когда форма пишет «файл слишком большой» или страница медленно грузится.
Типичные причины менять размер: лимиты на загрузку на сайтах вакансий и госпорталах, картинки на сайте, где фото шириной 4000 px стоит в блоке на 800 px, ограничения на вложения в почте и шаблоны, которым нужен точный размер, например фон слайда 1920×1080.
Как интерпретируется введённый размер
Есть два режима, а замок пропорций меняет поведение значений в пикселях.
Пиксели с включённым замком
Если заполнены и ширина, и высота, изображение масштабируется так, чтобы поместиться внутрь этой рамки с сохранением пропорций. Результат упирается в одну сторону рамки и меньше по другой.
- Горизонтальное фото 4000×3000 с пресетом Full HD 1920×1080 становится 1440×1080, потому что ограничивает сторона 1080 px.
- Вертикальное фото 3000×4000 с тем же пресетом становится 810×1080.
- Фото 4:3 с пресетом «Instagram квадрат 1080×1080» становится 1080×810, а не квадратом.
Если важна только одна сторона, очистите второе поле. Ширина 1200 при пустой высоте даёт ровно 1200 px в ширину и ту высоту, которая сохраняет пропорции.
Пиксели с выключенным замком
Изображение растягивается ровно до введённых ширины и высоты. Фото 4:3, принудительно приведённое к 1080×1080, будет выглядеть сплющенным по горизонтали. Используйте этот режим, только когда пропорции уже совпадают или небольшое искажение не важно. Если нужна точная форма без искажений, сначала обрежьте изображение до нужного соотношения сторон, а потом меняйте размер.
Проценты
Ползунок от 1% до 200% масштабирует обе стороны с одинаковым коэффициентом. 50% превращают 4000×3000 в 2000×1500.
Все пресеты включают замок, поэтому всегда работают в режиме «вписать».
Что происходит с качеством и форматом
Изменение размера выполняется в браузере через Canvas API — в фоновом воркере, если браузер это поддерживает, чтобы страница не подвисала при больших пакетах. Результат сохраняется в формате исходника:
- JPG перекодируется с качеством 0.92. Этого достаточно, чтобы артефакты повторного сжатия не были заметны при обычном просмотре.
- WebP тоже кодируется с качеством 0.92 и сохраняет прозрачность.
- PNG остаётся без потерь и сохраняет альфа-канал. Фотографии в PNG остаются тяжёлыми даже после уменьшения; для них стоит подумать о конвертации в JPG.
Поскольку изображение перерисовывается и кодируется заново, встроенные метаданные — данные камеры в EXIF и GPS-координаты — в результат не переносятся. Это приятный бонус, если вы публикуете фото, снятые на телефон.
Увеличение больше 100% разрешено, но новых деталей оно не создаёт. Переход с 800 на 1600 px даёт более мягкую картинку: та же информация просто распределяется по большему числу пикселей. Умеренное увеличение на 120–150% для экрана обычно приемлемо; дальше края становятся размытыми.
Практичные размеры и советы
Несколько размеров, которые хорошо работают на практике:
- Изображение в контенте сайта: от 1200 до 1600 px по длинной стороне покрывают большинство макетов, включая экраны высокой плотности при умеренной ширине.
- Полноэкранный фон или слайд: 1920×1080 или 3840×2160 для 4K-дисплеев.
- Вложение в письмо или мессенджер: 1600 px по длинной стороне сохраняют фото чётким и в большинстве случаев укладываются заметно меньше чем в 1 МБ.
Несколько советов:
- Сначала меняйте размер, потом сжимайте. Если результат всё ещё тяжёлый, пропустите его через сжатие JPG с более низким качеством — вместе два шага дают самые лёгкие файлы.
- Всегда работайте с оригиналом. Если снова увеличивать уже уменьшенную копию, теряются детали, которые не вернуть.
- В пакете ко всем файлам применяется одна настройка. Чтобы смешанный набор горизонтальных и вертикальных снимков получил одинаковую длинную сторону, введите одно и то же число в оба поля при включённом замке: при 1600×1600 у каждого изображения длинная сторона станет 1600 px. Учтите, что изображения меньше рамки будут увеличены до её размера.
- Принимаются файлы до 50 МБ каждый, и ничего не загружается на сервер: изображения не покидают ваше устройство.