Уменьшение размера фото с сохранением резкости

Все мы знаем, что для загрузки изображений на сайт (или просто в интернет) необходимо уменьшать их размер, и наверняка у каждого есть свой привычный и проверенный способ для этого. В Фотошопе с этой целью применяется команда Файл (File) => Сохранить для Web (Save for Web) (Alt+Shift+Ctrl+S), где можно выбрать оптимальные для конкретного случая настройки. Однако, бывают ситуации, когда изображение требуется уменьшить кардинально, скажем, в 10-12 раз, и этот способ может привести к недопустимой потере качества и резкости картинки. Как быть?

Скажем, я хочу уменьшить файл с размерами 4288х2859 пикс до размера 350 пикс по максимальной стороне, то есть по ширине. Изменение размера изображения иногда называют ресайз либо ресайзинг (англ. resize), а уменьшение линейных размеров (т.е. ширины и высоты) — даунсайз (даунсемплинг — пересчет  файла с уменьшением размера) (англ. downsize). Понятно, что любое уменьшение линейных размеров предполагает исключение части пикселей изображения, и чем меньше требуемый результат, тем больше пикселей придется «выбросить», а это значит, если мы попытаемся увеличить готовый результат, он весь будет состоять из «кубиков» — оставшихся немногочисленных пикселей.

Тот, кто делал фавикон для сайта,уменьшение размера изображения в Фотошоп наверняка сталкивался с ужасным размытием при уменьшении картинки до размера 16х16. Типа такого)… Это был мой фавикон). Впрочем, картинку не для того уменьшали настолько, чтобы затем ее увеличивать — и мы попытаемся  лишь визуально сохранить  резкость уменьшаемого изображения.

Способ 1. Двухэтапное уменьшение размера изображения.

Итак, откроем Изображение => Размер изображения (Image => Image Size).

уменьшение изображения: интерполяция

Самый нижний параметр — интерполяция (Resample Image) — по умолчанию выставлен на «Бикубическая автоматическая». Меняем значение на «Бикубическая, четче» (Bicubic Sharper) (так и написано, наилучшая для уменьшения). Затем в верхнем блоке Размерность (Pixel Dimensions) выставляем значение требуемого размера картинки по максимальной стороне (в моем случае 350), умноженное на 2, т.е. 700 пикс. Значение второго параметра (высоты) уменьшится пропорционально. Нажимаем ОК.

как сохранить резкость при уменьшении размеров изображения с помощью Фотошоп

После этого второй раз открываем Изображение => Размер изображения (Image => Image Size), снова выбираем значение интерполяции Бикубическая, четче (Bicubic Sharper) и выставляем окончательный требуемый размер: ширина 350 пикс. Жмем ОК и сохраняем наш файл под другим именем, чтобы не уничтожить первоначальное большое изображение. Файл (File) => Сохранить как… (Save as…) (Shift+Ctrl+S) и в открывшемся окне выбираем наилучшее качество.

сохранение уменьшенного изображения

Давайте сравним результат сохранения:

двухэтапное уменьшение размера изображения  с бикубической интерполяцией "Четче"

Второе изображение заметно четче, и, если сравнить вес полученных файлов, то второй файл немного больше (80 Кб по сравнению с первым — 66 Кб), то есть и качество должно быть повыше.

Во многих источниках рекомендуется дополнительно повысить резкость картинки прежде, чем ее уменьшать. Усложняем задачу и рассмотрим…

Способ 2. Двухэтапное уменьшение размера изображения с предварительным повышением резкости.

К исходному файлу применяем команду Фильтр (Filter) => Усиление резкости (Sharpen) => Контурная резкость (Unsharp Mask) (в некоторых версиях переводится буквально как Нерезкая маска). 

фильтр контурная резкость

В открывшемся окне настроек фильтра выставляем такие параметры:

фильтр контурная резкость для сохранения резкости при уменьшении размера изображения

Эффект (Amount) — 500%, Радиус (Radius) — 0,2 пикс, Изогелия (Threshold) (иногда переводится как Порог) — 3 ур. Нажимаем ОК.

(Картинка в окне просмотра фильтра другая, поскольку экспериментировала над разными изображениями))

Вслед за применением фильтра Контурная резкость выполняем первый этап уменьшения размера изображения (до 700 пикс по большей стороне), описанный в Способе 1.

Выполнив первый этап уменьшения, снова переходим в Фильтр (Filter) => Усиление резкости (Sharpen) => Контурная резкость (Unsharp Mask), однако настройки Эффекта делаем в два раза меньше:

как сохранить резкость при уменьшении размеров изображения с помощью Фотошоп

И, как можно уже догадаться, после второго применения фильтра проводим второй этап уменьшения размера изображения (до 350 пикс по большей стороне). Сохраняем файл под другим именем с максимальным качеством.

И сравниваем.

двухэтапное уменьшение изображения с усилением резкости

На моем мониторе видно, что третье изображение наиболее четкое. Если вас устраивает такой результат, можно радоваться и с облегчением попить чайку.

Однако я разыскала еще и третий способ (впрочем, их намного больше), самый неожиданный для меня, и не испробовать его я просто не смогла. Итак,

Способ 3. Двухэтапное уменьшение размера изображения с предварительным применением фильтра Мозаика.

Надеюсь, у вас еще сохранилось исходное изображение после всех перипетий по уменьшению. Откроем исходное изображение. Переходим в Фильтр (Filter) => Оформление (Pixelate) => Мозаика (Mosaic).

фильтр Мозаика для усиления резкости изображения при его уменьшении

Настройки фильтра незамысловаты:

параметры фильтра Мозаика

Параметр Размер ячейки (Cell Size) ставим равным 2 квадрата.

После применения фильтра выполняем первый этап уменьшения размера изображения (до 700 пикс по большей стороне), описанный в Способе 1. Однако затем наши действия несколько иные: для второго этапа сохранения переходим в Изображение (Image) => Размер изображения (Image Size) и в окне интерполяции (Resample Image) выбираем значение По соседним пикселям (Nearest Neighbor).

второй этап уменьшения изображения с интерполяцией по соседним пикселам

Выставляем окончательный требуемый размер: ширина 350 пикс. Жмем ОК и сохраняем наш файл под другим именем.

Сравниваем…

уменьшение изображения с применением фильтра мозаика

На третьем изображении стала четче просматриваться структура ткани в сеточку, да и в общем картинка выглядит немного резче.

Пытаясь увидеть разницу в результатах, можно увеличить полученные изображения и сравнить. Смотреть, конечно, приятнее всего на оригинал).

как сохранить резкость при уменьшении размеров изображения с помощью Фотошоп

2-этапное уменьшение изображения

Впрочем, обратите внимание: применение фильтра Контурная резкость вызывает появление белых ореолов на краях предметов, особенно хорошо их видно вокруг колец.

2-хэтапное уменьшение изображения с применением фильтра контурная резкость

2-хэтапное уменьшение изображения с применением фильтра Мозаика

Многое зависит от исходного изображения, насколько плавные или резкие на нем переходы цвета и контраста, есть ли мелкие детали. Возможно, в каком-то случае ни один из этих способов не пригодится. А для кого-то непременно один из них окажется полезным. Для фото с кольцами неплохой результат дал Способ 3. Когда же я применила все три способа к картинке с тюльпанами на фоне синего неба, как ни старалась, особых различий не заметила.

Пожалуйста, поделитесь со мной вашими наблюдениями в этой сфере)

После уменьшения никто не запретит нам попытаться еще раз повысить резкость изображения. И здесь лучше воспользоваться другим фильтром, он называется Цветовой контраст (High Pass). О нем подробно рассказано здесь.

усиление резкости фото после уменьшения

Почему именно Мозаика?..

Фильтр Мозаика группирует соседние пиксели в квадратные блоки одного цвета. Размер блоков указан в настройках — у нас это 2 квадрата. Учитывая, что в дальнейшем мы применяем уменьшение размера с интерполяцией По соседним пикселям, смею предположить, что соседние пиксели одного цвета дают более четкие края предметов на картинке, чем расплывчатые переходы цветов.

Теперь  мы с вами изучили столь непростое уменьшение размера фото с сохранением резкости!

Успешной работы!

36 комментарий на «Уменьшение размера фото с сохранением резкости»

    • Пожалуйста) Эти способы тоже не гарантия качества — оно неминуемо упадет, но кое-что можно спасти)

  1. Для меня уменьшение фотографий очень актуальная проблема, так как приходится много фото для своего сайта «адаптировать». Убрала статью в закладки и буду ее изучать- спасибо!

    • Возможно, для сайта не все картинки придется так сильно уменьшать, но я надеюсь, что статья Вам все равно пригодится!

  2. Уменьшить фото нужно бывает достаточно часто и теперь я знаю, как это сделать сохранив резкость. Статья очень понятная и подробная. Спасибо, Эмили.

    • Конечно, кому как удобно. Не зря столько программ разных выдумали)
      О, поздравляю, нужно посмотреть!

  3. Вот спасибо! Как раз то, что мне было надо. А надо именно уменьшить без потери качества. Кстати, к прошлой статье про резкость не могу ответить на комментарий, какую-то ошибку выдает.

    • Надеюсь, что информация будет полезной. А с комментариями тоже заметила ошибку, спасибо, исправлю.

  4. Очень понятно и доступно вы рассказали нам о том, как можно уменьшить фото и не потерять качество картинки. Спасибо.

  5. Сделал, что хотел. По способу «Двухэтапное уменьшение с предварительным повышением резкости». Дальше не пробовал, результат устроил. Спасибо, за урок! Я теперь мастер Фотошопа :-) .

    • Супер)
      Поздравляю! А я, типа, учительница)
      Как здорово, что результат положительный. Я очень рада!

  6. Очень интересно! Первый раз слышу, что есть разные способы уменьшения изображений. Я привычно уменьшаю размеры и сохраняю их как веб. Спасибо, Эмили, пригодится «двухэтапное уменьшение размера изображения»

    • Пожалуйста! Для обычного уменьшения как раз вполне достаточно сохранения для веб — оно позволяет широко варьировать качество картинки на свой вкус. А вышеописанные действия рекомендованы для совсем «экстремального» уменьшения размера.

  7. А уменьшать по-любому приходится. А то потом плохо открываются, особенно, если у людей медленный интернет. Да я и свои сайты с трудом открываю в тех местах, где плохо тянет.

    • У меня вообще проблемы со скоростью загрузки сайта, что-то я не так делаю. А в самом начале по неопытности загружала огромные фотки…

  8. Если бы не этот урок, то я бы так и оставил с плохой резкостью. Совершенно не дружу с Фотошопом. Спасибо!

  9. Спасибо за урок!
    А еще как способ сохранения качества при уменьшении размера изображения- это специальная программа. Называется она -PhotoScape. В ней много интересных функций,. среди из которых: возможность без потерь качества уменьшить любое изображение, сразу его подкорректировать и уменьшить вес изображения.

    • Благодарю за подсказку, Лора, очень полезный совет! Обязательно посмотрю эту программу, не знала о ней.

  10. Ух ты, сколько способов интересных! С мозайкой и вправду очень необычно получается (эх, отстала я в последнее время от фотошопа). Бывает иногда, надо сделать коллаж, а фотки разного размера, вот тут как раз такое уменьшение можно применить (правда, мне чаще наоборот увеличение надо было делать :) )

    • Елена, думаю, для коллажа можно просто изменить размер изображения, установив режим «бикубическая, четче»… иначе будет бросаться в глаза разное качество элементов коллажа. Теоретически, для коллажа нужно подбирать фото примерно одинакового качества, но в реальности не всегда это возможно)
      А способ применения «мозаики» очень удивил меня)

    • Конечно! Но если нужно сделать серию различных действий с изображениями и Фотошоп уже запущен — я именно им и воспользуюсь.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

*

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>