Изменить размер изображения

Что делает этот инструмент

Перетащите изображения — первое появится на холсте с пунктирной рамкой поверх: эта рамка и есть результат. Введите ширину или высоту; при включённом замке пропорций (по умолчанию) второе число подстраивается, а рамка сжимается или растёт вместе с ним. Быстрые кнопки задают длинную сторону 1920, 1280, 800 или 400 — значения, которые нужны большинству веб-страниц, блогов и миниатюр. Переключите единицу на %, чтобы масштабировать по коэффициенту. Можно также взять рамку за угол и потянуть: числа меняются во время перетаскивания, и то, что вы видите, — это ровно тот файл, который получится.

В каждой строке видны исходные и новые размеры в пикселях рядом с весом файлов, а имя результата несёт новые габариты (photo-1280x853.jpg), поэтому пачка остаётся упорядоченной. Уменьшение идёт многошаговым ресемплингом — изображение несколько раз делится пополам перед финальным проходом, — что избавляет от зубцов и муара, которые даёт одношаговое масштабирование при сильном уменьшении. Всё работает в браузере: без загрузки, без очереди, без лимитов.

Как пользоваться

Задайте размер и нажмите «Изменить размер». Для пакета ширина × высота — это рамка, в которую вписывается каждое изображение: горизонтальные ограничивает ширина, вертикальные — высота, и ничто не выходит за рамку, так что одна настройка подходит для смешанной папки. Щёлкните любую строку списка, чтобы увидеть это изображение на холсте. «Не увеличивать» (включено по умолчанию) оставляет нетронутыми изображения, которые уже меньше рамки. Снимайте замок пропорций только когда платформа требует точный размер: тогда изображение растягивается до рамки, и под холстом об этом сказано. Настройки запоминаются на этом устройстве.

Когда пачка готова, скачивайте файлы по одному или ZIP-архивом либо кнопками «Продолжить с…» отправьте уменьшенные картинки в сжатие для финального уменьшения веса или в конвертер для другого формата. Три инструмента делят один список, поэтому привычный веб-порядок — уменьшить до размера показа, перевести в WebP, сжать до нужного веса — это три нажатия и один выбор файлов. Лежащие набок или перевёрнутые фотографии сначала прогоните через поворот изображения; снимки товаров, которым нужен чистый фон, — через удаление фона.

Частые сложности

Увеличение никогда не добавляет деталей. Растягивание изображения с 400 пикселей до 2000 даёт мягкую, размытую картинку, потому что недостающие пиксели интерполируются, а не восстанавливаются; если нужно изображение больше, вернитесь к оригиналу или векторному источнику. Снятый замок пропорций намеренно игнорирует соотношение сторон и сплющит вертикальное фото в горизонтальную рамку — делайте это только когда платформа действительно требует фиксированный размер, и сначала обрежьте, если пропорции различаются.

Уменьшение скриншота PNG с мелким текстом делает текст нечётким; по возможности оставляйте скриншоты в исходном размере и позвольте странице масштабировать их через CSS. Единица % относится к размеру каждого изображения, поэтому смешанный пакет получится разного размера — используйте пиксели, если нужен единый результат. И как во всех инструментах на canvas, метаданные EXIF (включая флаг ориентации) отбрасываются; браузер применяет ориентацию до масштабирования, так что фото выходят прямо, но данные камеры не сохраняются.

Как устроено масштабирование

Уменьшить изображение — значит решить, какого цвета будет каждый новый пиксель, исходя из нескольких исходных, которые он заменяет. Метод ближайшего соседа берёт один и выглядит зубчато; билинейный усредняет четыре ближайших; бикубический и Ланцоша учитывают более широкую окрестность и дают более гладкий и резкий результат. В браузерах есть режим качественного рисования на canvas, но при сильном уменьшении — скажем, с 6000 пикселей до 600 — один проход всё равно выбирает слишком мало исходных пикселей, и появляется алиасинг. Стандартное лекарство, применённое здесь, — несколько раз уполовинить изображение, пока оно не окажется в пределах двукратной разницы с целью, и только потом сделать финальный ресемплинг.

Цифровые камеры и телефоны сегодня дают снимки на 12–50 мегапикселей, что намного больше любого экрана: монитор 4K — это всего 8 мегапикселей, а экран телефона около 3. Отдавать изображение больше, чем размер его показа, значит впустую тратить трафик, память и время декодирования — именно поэтому существуют адаптивные картинки (атрибут srcset) и image-CDN. Локальное уменьшение перед отправкой даёт тот же результат безо всякой инфраструктуры, а поскольку работа идёт в браузере, фотографии не покидают устройство.

Где это нужно

Больше всего — в веб-публикации: подогнать главную картинку под её ширину в CSS, сделать версии 2× для экранов Retina, подготовить несколько размеров для srcset. Социальные площадки требуют конкретных габаритов — 1200×630 для превью ссылок, 1080×1080 для квадратных постов, 1500×500 для шапок. Подписям в письмах и рассылкам нужны маленькие изображения фиксированной ширины. Загрузка фото на документы и в анкеты на государственных, университетских и кадровых сайтах часто ограничена пикселями (600×600) или весом (2 МБ). Магазины приложений требуют скриншоты в точном разрешении устройств, а типографии просят минимальное число пикселей под физический размер.

Пакетное уменьшение перед архивированием или отправкой отпускного альбома, подгонка фотографий товара под сетку магазина, набор значков 16/32/64/128 пикселей из одного исходного PNG, уменьшение сканов до почтового размера — всё это повседневные задачи. Сочетайте с конвертером форматов для вывода в WebP и со сжатием, чтобы попасть в нужный вес; уменьшенный PNG с QR-кодом стоит оставить в PNG, чтобы модули остались резкими. Страницы, выгруженные через PDF в изображения, можно уменьшить здесь перед тем, как класть их на слайд или на сайт.

Частые вопросы