Как перенести изображение в фотошопе без потери качества

Обновлено: 03.07.2024

Каждое изображение имеет три основных параметра, о которых вам необходимо знать, особенно при загрузке в сеть Интернет, это может быть сайт, социальная сеть или отправка изображения по электронной почте. Как правильно работать с данными параметрами при подготовке изображения для веб или печати, мы расскажем в данной статье…

Три основных параметра изображения

  • Размер файла, который измеряется в байтах (килобайтах, мегабайтах и ​​т. д.)
  • Размер, который представляет собой ширину и высоту в любых единицах измерения (пиксели для экранов, дюймы или сантиметры для печати)
  • Разрешение, которое измеряется в точках на дюйм для печати (DPI) или в пикселях на дюйм (PPI) для цифрового представления или экранов

Веб-сайты предъявляют различные требования и ограничения в отношении этих трех функций изображения. В идеале вам необходимо внести изменения в свои изображения в соответствии с этими требованиями перед их загрузкой. Хотя многие веб-сайты изменяют размеры изображений автоматически, но этот автоматизированный процесс может ухудшить качество изображения как в разрешении, так и в цвете и это непременно скажется на внешнем виде изображения. Загрузка с указанием точного размера гарантирует, что ваши изображения будут минимально изменены или не изменены совсем и, следовательно, не искажены. Наилучшим образом для изменения размера изображений подходит программа Adobe Photoshop.

Изменение размера в Фотошопе может означать одно из двух: уменьшение размера файла изображения и изменение размеров изображения. Они идут рука об руку, но в этой статье мы обсудим, как изменить размеры изображения.

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

Если это сбивает с толку, просто помните:

  • Больше пикселей на дюйм = лучшее разрешение
  • Меньше пикселей на дюйм = меньшее разрешение

Как преобразовать дюймы в пиксели

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

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

Чтобы преобразовать пиксели в дюймы, разделите размеры в пикселях на разрешение. Например, изображение размером 1000 x 500 пикселей с разрешением 72 DPI имеет высоту 13,89 x 6,95 дюйма.

Чтобы найти разрешение или DPI изображения, вам нужно знать ширину в пикселях и дюймах. Разделите размеры в пикселях на размеры в дюймах. Например, изображение шириной 1000 пикселей и шириной 13,89 дюйма имеет разрешение 72 DPI.

Чтобы преобразовать дюймы в пиксели, умножьте ширину изображения в дюймах на разрешение или DPI. Например, 13,89 дюйма при 72 пикселях на дюйм имеют ширину 1000 пикселей.

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

Как перевести из дюймов в пиксели

Как изменить размеры изображений на необходимые в Photoshop

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

В цифровом изображении количество пикселей представлено DPI (или PPI) и размерами ширины и высоты. Например, изображение размером 2000 x 2000 пикселей с разрешением 72 DPI имеет общее количество пикселей 4 000 000. Чтобы уменьшить изображение, скажем, до 1000 x 1000 пикселей, вы можете просто уменьшить его по размеру, и оно сохранит тот же уровень детализации, только в уменьшенном изображении.

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

Изменение размера изображения без потери качества в Фотошоп

Откройте изображение в Photoshop. Пройдите в пункт меню Изображение и далее Размер Изображения. Перед вами откроется окно с настройками размеров и разрешения вашего изображения.

Как изменить размер изображения в фотошопе

Измените разрешение вашего изображения

  • Изображения, которые вы планируете использовать в Интернете, переведите в пиксели.
  • Изображения, которые вы собираетесь печатать, переведите в дюймы или сантиметры.

В окне находятся рад выпадающих списков с выбором необходимых параметров и настроек изображения:

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

Единицы измерения в фотошопе

Выбор размера и разрешения на основании шаблона

Выбор размерных пресетов

Выбор единиц измерения и разрешения для web или для печати

Выбор разрешения изображения

  • Для веб-изображений выберите 72 DPI (пикселей на дюйм)
  • На изображениях с более низким разрешением выберите 150 DPI
  • Для печати изображений с высоким разрешением выберите 300 DPI

Изменение размера изображения для вашего сайта или социальной сети

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

Ниже приведены размеры изображения для популярных социальных сетей

  • Размер изображения Facebook: 1200 х 1200 пикселей
  • Размер обложки Facebook: 1702 x 630 пикселей
  • Размер поста в Instagram: 1080 x 1080 пикселей
  • Размер истории в Instagram: 1080 x 1920 пикселей
  • Размер поста в Twitter: 1024 x 512 пикселей
  • Размер поста Pinterest: 736 x 1128 пикселей

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

Adobe Photoshop позволяет легко изменить размер изображения в пикселях, на размер изображения в дюймах. Если вы хотите переключить единицы измерения, просто выберите новую единицу измерения в раскрывающемся списке и посмотрите, как Фотошоп преобразует единицы измерения.

Как уменьшить размер фотографий
без потери качества

4.3 Оценок: 19 (Ваша: )

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

Интересно, что почти 80% из этих мегабайт можно попросту выбросить без ущерба для снимка! Главное – знать, какой инструмент для этого использовать. Читайте статью и вы узнаете, как уменьшить размер фото, сохранив безупречное качество.

Как уменьшить размер фото

Программа ФотоМАСТЕР уменьшила размер фото почти в 100 раз!

Изменения размера в пикселях

Мы разберем три варианта, как можно поменять значения для ширины и высоты снимка. Учтите, что при этом поменяется и вес изображения. Поэтому, если вас беспокоит как размер, так и вес, то выбранным способом можно решить сразу две проблемы.

Загрузка фото в Фотошоп

Через вкладку Изображение

Теперь начнем изменять размер самого фото в Фотошоп. Для этого или перейдите на вкладку «Image» ( «Изображение» ) – «Image Size» ( «Размер изображения» ), или воспользуйтесь комбинацией клавиш Alt+Ctrl+I .

Вкладка Изображение

Откроется окно для изменения размера (1). В нем нужно указать подходящее значение для ширины и высоты в пикселях: «Width» (2) и «Height» (3) соответственно. Замочек напротив этих полей (4) означает, что пропорции будут сохранены (меняете значение высоты и автоматически оно изменяется для ширины). Если вам это не подходит, тогда уберите галочку в поле «Сохранение пропорций» ( «Constrain Proportions» ) (5). Также обращайте внимание на самое верхнее поле (6), в нем указывается размер фотографии. Когда все будет готово, сохраняйте изменения кнопкой «ОК» (7).

Что получилось в итоге: размер изменился с 2448х3264 до 1000х1333, а вес стал 3,81 МБ вместо 22,9 МБ.

Окно для изменения рразмера

Через Свободное трансформирование

Теперь давайте применим к снимку «Свободное трансформирование>» или «Free Transform» . Находится нужный нам пункт на вкладке «Edit» ( «Редактирование» ). Ему соответствует сочетание клавиш Ctrl+T .

Вкладка Редактирование

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

Поскольку в таком режиме лист остается в неизменном виде, то картинку нужно обрезать. Поэтому переходите к следующему пункту.

Как у меня изменились значения (после обрезки): с 2448х3264 до 1000х1333, а размер стал 3,81 МБ. То есть, все также, как и в предыдущем способе.

Изменение размера путем трансформирования

Обрезка картинки

Если вам не нужна фотография целиком, а только какой-то ее фрагмент, то лучше воспользоваться обрезкой. Находится он на «Панели инструментов» и называется «Рамка» ( «Crop Tool» ). Кликайте по инструменту и выделяйте нужную область на фото. При этом в углу в окне можно смотреть, как изменяются значения.

Инструмент Рамка

Если вам нужны определенные значения для высоты и ширины, то выделите область и укажите точные числа в верхних полях. После этого можете перемещать изображение мышкой, чтобы в рамке осталась нужная его часть. Когда закончите, нажмите «Enter» .

Точные значения для обрезки фото

Как преобразовать дюймы в пиксели

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

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

Чтобы преобразовать пиксели в дюймы, разделите размеры в пикселях на разрешение. Например, изображение размером 1000 x 500 пикселей с разрешением 72 DPI имеет высоту 13,89 x 6,95 дюйма.

Чтобы найти разрешение или DPI изображения, вам нужно знать ширину в пикселях и дюймах. Разделите размеры в пикселях на размеры в дюймах. Например, изображение шириной 1000 пикселей и шириной 13,89 дюйма имеет разрешение 72 DPI.

Чтобы преобразовать дюймы в пиксели, умножьте ширину изображения в дюймах на разрешение или DPI. Например, 13,89 дюйма при 72 пикселях на дюйм имеют ширину 1000 пикселей.

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

Как перевести из дюймов в пиксели

Качество

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

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

Как мы видели, размеры 800px и 700px совсем не отличаются по тому, как они выглядят на сайте. Поэтому, я предлагаю двигать качество на размере 600px.

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

Качество 80% у нас уже было, поэтому давайте уменьшим до 70%, и посмотрим что у нас получится. В программе это будет выглядеть вот так:

Как уменьшить изображение в фотошопе без потери качества10

Смотрим сколько у нас теперь весит картинка? Только 71Кб! Это очень хороший результат для сжатия изображения. И что же мы будем видеть на сайте с такими параметрами? А вот что!

Как уменьшить изображение в фотошопе без потери качества11

Тут уже на любителя, и кто как видит. Для меня, это не очень хорошая фотка, а для вас — смотрите сами. Давайте я еще уменьшу на 10% качество, раз уже мы двигаемся в эту сторону и посмотрим что будет происходить. Ставим параметр 60% на 600px. Окно программы будет вот такое:

Как уменьшить изображение в фотошопе без потери качества12

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

Как уменьшить изображение в фотошопе без потери качества13

Тут важно показать направление для экспериментов и подбора нужных значений. И я его показал. А дальше можно делать все что вам захочется.

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

Изменение размера изображений без потери качества с помощью Photoshop Smart Objects


Узнайте, как масштабировать и изменять размеры изображений в Photoshop, не теряя при этом качество, используя умные объекты! Вы узнаете разницу между изменением размера обычного изображения и изменением размера смарт-объекта и почему смарт-объекты всегда выглядят лучше.

Умные объекты предлагают много преимуществ, но одно из самых больших заключается в том, что они позволяют нам изменять размер изображения без разрушения . Обычно, когда мы масштабируем изображение, чтобы уменьшить его, Photoshop уменьшает его, выбрасывая пиксели. И как только эти пиксели исчезнут, их уже не вернуть. Это называется деструктивным редактированием, поскольку оно вносит постоянные изменения в исходное изображение. В этом случае мы потеряли пиксели.

Позже, если мы попытаемся увеличить изображение или даже вернуться к его первоначальному размеру, результат будет выглядеть не так хорошо. Это потому, что, отбрасывая пиксели, мы потеряли детали на изображении, и Photoshop не может волшебным образом воссоздать детали, которых больше нет. Все, что он может сделать, это взять оставшиеся детали и сделать их больше. И в зависимости от того, насколько больше вы его сделаете, вы можете получить блочный или размытый беспорядок.

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

Эта статья, расскажет как соблюдая некоторые постулаты, я добиваюсь лучшего качества картинки, не совершая много лишней работы над этим.


Подопытная картина от Thomas Le Corre, посмотреть проект на Behance

Принцип просчета трансформации

Разберемся как работает просчет трансформации:
Уменьшая изображение, программа берет ближайшие пиксели и сливая их выдает усредненный цвет, для новосозданного, а при увеличении, информация наоборот берется из соседних пикселей, для создания новых. Грубый перерасчет в лучшем случае сохранит качество картинки, если масштабирование было незначительным (например, ±10%)


Разница между оригиналом и масштабированием иллюстрации с последующим восстановлением размера.

При любой трансформации, изначальное качество иллюстрации теряется. Неважно — масштабировали, искажали или поворачивали картинку. Действует принцип «Больше манипуляций — хуже результат».

Чего стоит избегать

В масштабировании

Избегаем «некорректные» значения размеров. Размеры «читаем» по процентам. Корректными размерами считаются все те, что кратны 5 или на худой конец 2.
Топ возглавляют: 25, 50 и 75%;
За ними идут: 10 и 90%, 20 и 80%, 40 и 60%.
Затем все кратное 5, но не озвученное ранее, а закрывают список удачных — кратные 2.

Масштаб просчитается корректнее, если картинка будет уменьшена не до 73,91%, а до нормальных целых 75%. Если размер нужен именнно с цифрой выше, а не округленной нами до 75%, снисхожу до округления целых 73%.
Нужно помнить, что нет понятия «половины пикселя». Есть пиксель — это наименьшая единица. Все что меньше, это тоже пиксель, но уже с прозрачностью, плотность которой считается исходя из размера «недопикселя».

В повороте

Избегаю нескольких ротаций, когда можно обойтись одной: Вместо двух по 15°, делаю один раз на 30°.
Исключением служат повороты, кратные 90°. Пиксель не претерпевает перерасчета, так как остается прежним, изменяя свое местонахождение.

Убийственными являются повороты, кратные 45°. Они дробят пиксели сильнее всего и мы получаем фигню.


Плохое качество видно невооруженым глазом. Иллюстрация повернута 8 раз на 45° (сделала оборот 360°)

Сложные манипуляции

Программа не позволяет корректно рендерить при сложном трансформировании и потому, нужно проводить операции поэтапно.

Результат, при одновременном масштабировании и повороте будет хуже, чем если бы сначала объект претерпел поворот, а затем масштабирование. При этом разница в качестве заметна даже неопытному пользователю.



Обратите внимание на «волны» и «лесенки» у края монитора, черной кнопки, края изображения и линии изгиба ноутбука, которые появились от непоследовательной трансформации (Уменьшение масштаба до 68% и поворот на 27°)

Правильно масштабируем

Трансформация в live режиме значительно хуже финальной, когда в диалоговом окне программа позволяет изменить размер при сохранении результата на компьютере.

Для простого, единичного масштабирования достаточно кнопки Save as. или Save for web с выпадающим диалоговым окном, в котором можно указать формат файла и его необходимые размеры.


Именно в диалоговом окне сохранения рекомендуется выставлять финальные размеры для сохранения макета. Размеры можно выставлять и в процентах.

А далее вставляем нашу картинку в макет и располагаем в нужном месте.
Это занимает лишние 15 секунд, а результат радует максимально допустимым качеством.

Наилучшая последовательность всех видов трансформаций

Напоследок, опишу наиболее удачную последовательность действий, которая сохраняет качество в лучшем состоянии.

При уменьшении

В первую очередь всегда делается искажение, следом за этим делаем поворот. И лишь после этого уменьшаем объект.

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

При увеличении

Приоритет нужно отдать масштабированию, после которого действовать можно уже по желанию — как будет удобнее.

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

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

В начале

Обычно перед тем, как выложить статью на блоге, я все изображения загружаю в фотошоп, и там их уменьшаю. Делаю я это через функцию «Сохранить для веб», или горячими клавишами Shift+Ctrl+Alt+S.

С виду много клавиш, которые нужно зажать, но на практике получается очень удобно, если поставить большой палец на Alt, мизинец на Ctrl, безымянный на Shift, ну и указательный на S. Получилось? Видите, как просто.

Недавно я выкладывал статью про самые дорогие мотоциклы в мире, и вот у меня так было в фотошопе:

Как уменьшить изображение в фотошопе без потери качества1

Если вы обратите внимание, то весит эта фотография самого мотоцикла 2,15 Мб.

Как уменьшить изображение в фотошопе без потери качества2

Понятно, что в таком виде на сайт выкладывать ее совершенно не нужно. Это огромный вес для интернета. Нажимаем наши волшебные клавиши Shift+Ctrl+Alt+S, и у нас открывается вот такое окошко.

Как уменьшить изображение в фотошопе без потери качества3

Параметры сохранения

Давайте разбираться, где какие параметры, и на что нужно обратить внимание, чтобы сохранить картинку в хорошем качестве, и при этом уменьшить ее размер.

  1. Формат изображения. Как я заметил по опыту иногда можно сохранять в jpeg, иногда можно сохранять в png. Ниже расскажу про особенности применения обоих.
  2. Качество изображения. Тут тоже можно играть настройками. Иногда можно поставить 90%, иногда можно поставить и 80. Бывали случаи, когда я ставил и 55 и 60%. Все зависит еще и от других параметров.
  3. Размер изображения. Тут вы должны понять какой размер нужен вам на вашем сайте или блоге. Больше 1000 px думаю ставить не стоит, потому что ширина контентной части блога где-то 700-800px.
  4. И наконец, самая главная величина, на которую вы будете постоянно ориентироваться — вес самой фотографии.

Как вы видите, фотошоп уже сжал фото с 2,15 Мб до 300 Кб. И это уже очень хорошо. Но обычно я не использую в своем блоге изображений весом больше 200 кб.

И то это редкий случай, когда нужно показать красивую фотографию в полном размере, как например, фотографии в пресетах Лайтрум, где нужно показать красоту обработки фильтра.

А в обычных статьях блога сейчас стал делать фотки где-то в районе 100кб плюс минус 20-30кб. Раньше, в первых статьях старался вообще делать где-то 50-70кб, но это сильно искажало картинку, и теперь стараюсь делать побольше.

Формат

Давайте теперь более подробно разбираться в тонкостях этих настроек, и начнем мы с формата. Как я уже сказал, где-то можно сохранить в jpeg, где-то в png.

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

Как уменьшить изображение в фотошопе без потери качества4

Мы делаем формат jpeg, качество 80, ширину убавляем до 800, и видим, что наше фото уменьшилось в весе, и стало 146 кб. Это для вас приемлемо? На сайте она будет выглядеть вот таким образом, т.е. полностью в ширину контекстной части.

Как уменьшить изображение в фотошопе без потери качества5

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

Если для вас это много по весу, давайте попробуем сделать меньше размер, не 800px, а сделаем 700px, смотрим что у нас получается в самой программе.

Как уменьшить изображение в фотошопе без потери качества6

Вы уже видите, что вес уменьшился, и стал уже 117 кб. Длину фото мы сделали 700px. Вот как эта фотография будет выглядеть у вас в блоге в контексте записи:

Как уменьшить изображение в фотошопе без потери качества7

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

Кстати, разница по ширине в статье совсем не заметна. Я тоже для себя кое-что вынесу из этого урока! Будем еще меньше делать фото? Давайте сделаем в настройках 600px. Мне кажется это вполне еще приемлемо. Вот так будет в программе:

Как уменьшить изображение в фотошопе без потери качества8

И мы уже видим, что при размере в 600px, вес стал 91кб. Совсем не много, мне кажется, для любого сайта. И вот как эта фотка будет выглядеть в вашей заметке:

Как уменьшить изображение в фотошопе без потери качества9

Я больше не буду уменьшать, вы сами это можете сделать и понять какой вариант размера вам больше подходит для вашего ресурса.

Давайте перейдем к другому параметру, и посмотрим как он отражается на самой фотографии, и на сколько можно уменьшать эти настройки.

Качество

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

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

Как мы видели, размеры 800px и 700px совсем не отличаются по тому, как они выглядят на сайте. Поэтому, я предлагаю двигать качество на размере 600px.

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

Качество 80% у нас уже было, поэтому давайте уменьшим до 70%, и посмотрим что у нас получится. В программе это будет выглядеть вот так:

Как уменьшить изображение в фотошопе без потери качества10

Смотрим сколько у нас теперь весит картинка? Только 71Кб! Это очень хороший результат для сжатия изображения. И что же мы будем видеть на сайте с такими параметрами? А вот что!

Как уменьшить изображение в фотошопе без потери качества11

Тут уже на любителя, и кто как видит. Для меня, это не очень хорошая фотка, а для вас — смотрите сами. Давайте я еще уменьшу на 10% качество, раз уже мы двигаемся в эту сторону и посмотрим что будет происходить. Ставим параметр 60% на 600px. Окно программы будет вот такое:

Как уменьшить изображение в фотошопе без потери качества12

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

Как уменьшить изображение в фотошопе без потери качества13

Тут важно показать направление для экспериментов и подбора нужных значений. И я его показал. А дальше можно делать все что вам захочется.

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

Jpeg или png

И остался у нас один вопрос, о котором хотел бы рассказать в данной статье. Когда использовать jpeg, а когда png. Даже в рамках этой статьи, я использовал и тот и другой формат.

А секрет вот в чем, я уже говорил о нем. Если вам нужно показать картинку, то вы делаете jpeg, если вам нужно показать цифры, или скриншот программы, то вы делаете png.

Именно так и я делал выше. Если вы внимательно поглядите на сам мотоцикл в скриншотах программы, где стоят настройки, то вы увидите очень грубые градиенты перехода цвета. К примеру на зеленых деталях мотоцикла. Посмотрите внимательно!

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

Но если сделать png для самой картинки, то я могу показать что будет. Давайте сравним как будет выглядеть png и jpeg с одними и теми же настройками всего остального. Вот глядите, ставим в программе 600px и ставим формат png:

Как уменьшить изображение в фотошопе без потери качества14

Как видим такое изображение будет весить 108 Кб. Это примерно 700px формата jpeg c 80% качества. И что теперь мы будем видеть на сайте:

Как уменьшить изображение в фотошопе без потери качества15

Вполне себе рабочий вариант, и можно так делать. Но в данном случае, лучше будет сделать jpeg, потому что он будет весить меньше и качество будет лучше.

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

Как уменьшить изображение в фотошопе без потери качества16

Т.е. вы видите размер у меня тут на этой картинке 1135 px, и так видно хорошо все цифры и все параметры. Весит 137Кб такая картинка, но если сделать меньше, то будет все очень плохо видно.

В заключении

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

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

Нужно немного практики, пробуйте разные варианты. Все еще зависит от самой фотки и её качества. Бывают качественные картинки приходится сжимать, а бывает и плохое качество. Тогда тоже нужно опытным путем подобрать настройки и выбрать наиболее приемлемые для вас.

Я постарался все вам рассказать как сам делаю. И поделился всеми своими секретами. Успехов в ваших начинаниях. А если вы хотите изучить фотошоп серьезно и глубоко, то держите обалденный курс ! Ну вот и все на этом.

Читайте также: