Обрезка и изменение размера фото

Как обрезать фотографию и изменить её размер

Рамка выделяет растение на большой фотографии, рядом находится уменьшенный квадратный кадр

Чтобы получить нужный фрагмент фотографии, выделите прямоугольник на изображении, задайте ширину готового файла в пикселях и скачайте PNG или JPEG. Высота пересчитается пропорционально, поэтому лицо не станет шире, а круг не превратится в овал. Фотография обрабатывается в браузере на вашем устройстве. Для пробы можно открыть встроенный рисунок, не выбирая личный файл.

Обрезка и изменение размера решают разные задачи. Обрезка убирает края: из общего снимка комнаты остаётся только стол. Масштабирование делает выбранный стол крупнее или мельче в пикселях. Здесь эти действия идут последовательно: сначала выбирается область исходника, затем она целиком помещается в новый файл. Скрытые затемнением края в результат не попадут.

Что означают координаты кадра

Начало отсчёта находится в левом верхнем углу изображения. Значение «Слева» показывает, сколько пикселей нужно отступить вправо, «Сверху» задаёт отступ вниз. У самого первого пикселя координаты 0 и 0. Ширина и высота кадра определяют размер прямоугольника в исходной фотографии, а не его размер на экране телефона.

Для фотографии шириной 1200 px кадр с отступом 200 px и шириной 1000 px заканчивается точно у правого края: 200 + 1000 = 1200. Если поставить отступ 201 px, прямоугольник уже выйдет за изображение. Инструмент покажет ошибку и заблокирует скачивание. Это полезнее, чем молча добавить пустую полосу или незаметно изменить введённый размер.

Рамку можно нарисовать мышью или пальцем в любом направлении. При этом числовые поля сразу показывают выбранные границы. Для точного результата поправьте их степперами или вручную: увеличить ширину на один пиксель с клавиатуры проще, чем попасть пальцем в край. Координаты относятся к открытой ориентации фотографии, которую показывает браузер.

Как сохраняются пропорции

Высота готового файла вычисляется по отношению сторон выбранного кадра. Если он в полтора раза шире своей высоты, после уменьшения это отношение сохранится. Нужна квадратная аватарка? Сначала поставьте одинаковую ширину и высоту кадра, затем выберите выходную ширину. Простое изменение ширины всего горизонтального снимка не сделает его квадратным.

Высота файла = ширина файла × высота кадра ÷ ширина кадра

Размеры округляются до целых пикселей, а высота результата всегда составляет хотя бы 1 px. Например, у кадра 1000 × 667 px при выходной ширине 300 px получается высота 200 px после округления 200,1. Незначительное отличие отношения сторон здесь связано с тем, что половину пикселя в размер файла записать нельзя. Для очень узкой полосы этот эффект заметнее.

Если нужно заранее подобрать пропорции без загрузки фотографии, используйте калькулятор масштабирования. Для печати пригодится расчёт размера фотографии: пиксели сами по себе не задают сантиметры, пока не выбрана плотность печати.

Аватарка, баннер и небольшой фрагмент

Квадрат из горизонтального снимка. У фотографии 4000 × 3000 px выберите отступ слева 500 px, сверху 0 px, ширину и высоту кадра по 3000 px. Так с каждой боковой стороны уйдёт по 500 px, а центр сохранится. Выходная ширина 1000 px даст файл 1000 × 1000 px. Такой способ подходит, когда нужный человек находится в середине кадра.

Уменьшение без обрезки. Для изображения 1200 × 800 px оставьте отступы по нулю и кадр целиком. Введите выходную ширину 600 px. Получится 600 × 400 px: каждая сторона уменьшится в 2 раза, количество пикселей сократится с 960 000 до 240 000, то есть в 4 раза. Размер файла в байтах при этом не обязан уменьшиться ровно вчетверо.

Горизонтальный баннер. Из исходника 2400 × 1600 px возьмите кадр с отступами 0 и 400 px размером 2400 × 800 px. Его отношение сторон составляет 3:1. При ширине файла 1200 px получится высота 400 px. Перед сохранением проверьте рамку: при таком кадрировании верхняя и нижняя части фотографии будут удалены, даже если там находится важная надпись.

Небольшая деталь в исходном масштабе. На снимке 1000 × 700 px нужная область начинается на 120 px справа от левого края и на 80 px ниже верхнего. Задайте кадр 300 × 200 px и выходную ширину 300 px. Результат останется 300 × 200 px, без увеличения и уменьшения. В PNG это удобный способ вырезать часть скриншота и сохранить прозрачность, если она была в исходнике.

Увеличение маленького фрагмента. Выберите область 200 × 100 px и задайте выходную ширину 800 px. Получится 800 × 400 px, увеличение каждой стороны в 4 раза. Однако новых деталей в лице или надписи не появится: браузер вычислит промежуточные цвета. Для более чёткой картинки лучше взять исходник крупнее, а не многократно увеличивать маленькую копию.

Предельный маленький кадр. У изображения 640 × 400 px можно выбрать отступы 639 и 399 px, размеры кадра 1 × 1 px и ширину файла 1 px. Результатом станет один пиксель из правого нижнего угла. При увеличении до 100 px получится квадрат 100 × 100 px одного цвета. Такой опыт наглядно показывает, откуда берутся детали: увеличение копирует информацию, которая уже есть.

PNG или JPEG

PNG сохраняет прозрачность и подходит для схем, элементов интерфейса и текста на однотонном фоне. JPEG удобен для фотографий, но при кодировании может менять цвета и мелкие детали. Здесь JPEG сохраняется с параметром качества 0,92. Это настройка кодирования, а не обещание сохранить 92% информации или уменьшить вес на 8%. Фактический размер зависит от сюжета и браузера.

У JPEG нет прозрачного фона: перед сохранением прозрачные участки заполняются белым. Если вырезаете логотип для размещения на тёмной странице, выбирайте PNG, иначе вокруг рисунка появится белый прямоугольник. Шахматная подложка в рабочей области помогает увидеть прозрачность, в файл она не добавляется.

После изменения размеров изображение пересоздаётся из пикселей. Это не редактирование исходного JPEG без перекодирования: даже при прежней ширине JPEG сохраняется заново. Для повторных правок лучше каждый раз открывать оригинал. Цепочка из нескольких сохранений JPEG может постепенно испортить тонкие контуры и текст.

Что проверить перед отправкой

Посмотрите на результат при масштабе 100%, особенно на глаза, текст и тонкие линии. Большая фотография может выглядеть резкой в маленьком предпросмотре и оказаться размытой после увеличения. Уменьшенный на экране холст помогает выбрать композицию, но не заменяет проверку скачанного файла в его настоящем размере.

Принимаются JPEG, PNG и WebP до 20 МБ, с площадью до 16 миллионов пикселей и стороной до 8192 px. Для готового файла действуют те же пределы площади и длины стороны. Площадь считается умножением ширины на высоту: 4000 × 4000 px содержит 16 миллионов пикселей. Ограничения защищают вкладку от чрезмерного расхода памяти, но на слабом устройстве даже допустимый большой файл может обрабатываться медленно.

Новая картинка сбрасывает старую рамку, а после перезагрузки файл нужно выбрать снова. Имя фотографии, координаты и её содержимое не сохраняются в адресе или хранилище страницы. Для анимированного WebP инструмент создаёт статичное изображение, сохранения анимации здесь нет. Если задача состоит только в уменьшении веса, а композиция уже подходит, используйте сжатие изображения.

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

Выбор кадра определяет содержимое фотографии, а размер и формат влияют на детализацию, прозрачность и совместимость готового файла.

Как обрезать фото в квадрат?

Задайте одинаковые ширину и высоту кадра. Передвигайте его координатами слева и сверху, пока объект не окажется внутри рамки. Выходная ширина, например 500 px, даст квадрат 500 × 500 px.

Почему меняется высота, когда я ввожу ширину?

Высота вычисляется по пропорциям выбранного кадра. Это защищает изображение от растяжения. Чтобы получить другое отношение сторон, измените ширину или высоту самого кадра, а затем задайте размер файла.

Можно ли увеличить фотографию без потери качества?

Увеличение добавляет вычисленные пиксели, но не восстанавливает отсутствующие детали. Для печати или чтения мелкого текста лучше использовать исходник с большим разрешением. Простое увеличение числа пикселей не делает размытый текст резким.

Как получить фото строго 600 × 400 px?

Сначала выберите кадр с отношением сторон 3:2, например 1200 × 800 px. Затем задайте ширину файла 600 px. Высота автоматически станет 400 px. Для произвольного кадра такая пара размеров без обрезки или искажения может быть недостижима.

Почему прозрачный фон стал белым?

JPEG не поддерживает прозрачность. Здесь она заменяется белым фоном перед сохранением. Для прозрачного результата выберите PNG; белые пиксели, которые уже были в исходнике, автоматически прозрачными не станут.

Задаёт ли размер в пикселях размер фотографии в сантиметрах?

Для сантиметров нужна ещё плотность печати. Например, 1200 px при 300 пикселях на дюйм соответствуют 4 дюймам, то есть 10,16 см. Одинаковый файл можно напечатать крупнее или мельче с разной детализацией.

Можно ли вернуть обрезанные края в скачанном файле?

В готовом PNG или JPEG остаётся только выбранная область. Для другого кадрирования снова откройте исходную фотографию. Сохраняйте оригинал отдельно, если планируете менять композицию позже.

Сохраняются ли настройки камеры и геометка?

Исходный файл не копируется: браузер создаёт новый файл из видимых пикселей. Исходные поля EXIF здесь специально не переносятся. При этом адрес, лицо или номер автомобиля на самой фотографии остаются видимыми; изменение формата их не скрывает.

Есть что добавить?

Напишите своё мнение, комментарий или предложение.