Какая опция изображения сохраняет соотношение сторон картинки
Обновлено: 07.07.2024
Сохранение соотношения сторон предотвращает искажение изображений из-за растяжения или сжатия. Работая с CSS, вы, вероятно, рано или поздно попадете в ситуацию, когда вам будет нужно сохранить исходное соотношение сторон изображения. Очень часто для решения этой проблемы используется CSS-свойство background-image. Есть и более современный подход – это свойство object-fit.
В этом руководстве мы поговорим о таких значениях object-fit, как fill, cover, contain, none и scale-down. Мы обсудим, как они влияют на изображение в целом, а также как с их помощью можно обрезать и масштабировать изображения. Кроме того, вы изучите свойство object-position и увидите, как оно может смещать изображения.
Требования
- Чтобы выполнить этот мануал, вам нужно знать, что такое свойства и значения CSS.
- Вы должны уметь использовать декларации CSS, встроенные в свойство style.
- Редактор кода.
- Современный веб-браузер, поддерживающий object-fit and object-position.
Стандартное поведение изображений
В этом руководстве мы рассмотрим следующий код:
В результате он выдает:
Исходная ширина этого изображения – 1200 пикселей, высота – 674 пикселей. С помощью атрибута img этим параметрам были присвоены значения 600 и 337 – это половина исходных размеров с сохранением соотношения сторон.
Давайте теперь предположим, что у нас есть макет, который ожидает, что изображения будут иметь ширину в 300 пикселей и высоту в 337 пикселей:
В браузере этот код покажет следующий результат:
Полученное изображение больше не сохраняет исходное соотношение сторон и кажется визуально сжатым.
Как работает object-fit: fill
fill – это начальное значение object-fit. Оно не сохраняет исходное соотношение сторон.
Этот код выдаст в браузере следующий результат:
Поскольку это исходное значение для движков рендеринга в браузерах, внешний вид масштабированного изображения не меняется. Полученное изображение по-прежнему выглядит сжатым.
Как работает object-fit: cover
Значение cover сохраняет исходное соотношение сторон изображения, но изображение занимает все доступное пространство.
Данный код покажет в браузере такой результат:
В определенных ситуациях object-fit: cover может обрезать изображение. В этом примере некоторые части исходного изображения (слева и справа) не отображаются, потому что они не умещаются в пределах заявленной ширины.
Как работает object-fit: contain
Значение contain сохраняет исходное соотношение сторон, но при этом изображение не может выходить за пределы доступного пространства.
Этот код выдаст в браузере следующий результат:
В некоторых ситуациях object-fit: contain приводит к тому, что изображение не может заполнить все доступное пространство. Как вы видите в данном примере, над и под изображением есть пустое горизонтальное пространство, потому что заявленная доступная высота больше, чем высота масштабированного изображения.
Как работает object-fit: none
Значение none вообще никак не изменяет размер изображения.
Этот код выдаст в браузере следующий результат:
Если изображение больше доступного места, оно будет обрезано. В нашем примере некоторые части исходного изображения слева, справа, сверху и снизу не отображаются, потому что они не помещаются в границах заявленных ширины и высоты.
Как работает object-fit: scale-down
Этот код выдаст в браузере следующий результат:
В этом примере изображение было уменьшено по принципу contain.
Как работают свойства object-fit и object-position
Если в результате object-fit выдает обрезанное изображение, оно по умолчанию будет центрировано. Для изменения точки фокуса можно использовать свойство object-position.
Вернемся к примеру object-fit: cover.
Теперь давайте изменим положение видимой части изображения по оси X, чтобы показать правый край изображения:
Этот код покажет следующий результат:
В этом примере фрагмент изображения с черепахой вырезан.
А теперь давайте посмотрим, что произойдет, если указать позицию за пределами доступного пространства:
В результате получится:
В этом примере изображение сдвинуто так, что мы видим только его левую часть. Кроме того, слева мы видим интервал, который составляет 20% доступного пространства.
Заключение
В этой статье мы рассмотрели доступные значения свойств object-fit и object-position.
Прежде чем использовать свойство object-fit в своем проекте, убедитесь, что ваша целевая аудитория пользуется браузерами, которые его поддерживают.
Пропорция определяет отношение ширины к высоте. Кадры видео и фотоснимков обладают пропорцией кадра (формат кадра), а пикселы, составляющие кадр, — попиксельной пропорцией (иногда называемой PAR). В различных стандартах видеозаписи используются разные пропорции. Например, видео для телевидения записывается с пропорцией кадра (форматом кадра) 4:3 или 16:9. Дополнительную информацию см. в разделе Пропорция кадра.
Пропорции кадра и попиксельные пропорции задаются при создании проекта в Premiere Pro. После создания пропорций для проекта их изменение невозможно. Однако пропорцию эпизода можно изменить. В проекте можно использовать ресурсы, созданные с другими пропорциями.
Premiere Pro автоматически пытается компенсировать пропорции пиксела для исходных файлов. Если ресурс по-прежнему выглядит искаженным, можно вручную задать его пропорции пиксела. Перед согласованием пропорций кадра сначала необходимо согласовать попиксельные пропорции, так как ошибочные пропорции кадра могут привести к неправильной интерпретации попиксельных пропорций.
Типы пропорций
Часто используемые пропорции:
Широкий экран (16:9)
Это стандартная пропорция, широко используемая в веб-видео, документальных и художественных фильмах. Она позволяет получить большие объемы данных с подробностями.
Вертикальная (9:16)
Видео, записанного на телефоне.
Полный экран (4:3)
Эта пропорция использовалась в телевидении, до появления широких экранов. Она позволяет одномоментно сфокусироваться на определенном элементе.
Квадрат (1:1)
Это точная квадратная пропорция, которая широко используется в Instagram.
Анаморфная (2.40:1)
Это широкоэкранная пропорция часто используется в фильмах. Она похожа на 16:9, но при этом верхняя и нижняя части обрезаны. Этот эффект дает ощущение кинематографичности.
Чтобы задать пропорцию эпизода:
Создайте новый эпизод. Выберите Файл > Создать > Эпизод.
Дополнительные сведения см. в разделе Создание и изменение эпизодов.
Перейдите на вкладку «Настройки» диалогового окна «Создать эпизод».
Перейдите на вкладку «Настройки».
В разделе «Видео» введите размер кадра по высоте и по горизонтали (ширина). Premiere Pro автоматически создает пропорцию.
Заполните соответствующие поля, назовите эпизод и нажмите кнопку ОК.
Пропорция эпизода задана.
Пропорции кадра задают отношение ширины к высоте в размерах изображения. Кадры видео и фотоснимков обладают пропорцией кадра.
Например, DV NTSC использует пропорции кадра 4:3 (ширина 4,0 к высоте 3,0). Типичный широкоэкранный кадр обладает пропорциями 16:9. Многие камеры, поддерживающие широкоэкранный режим, могут вести запись с пропорциями кадра 16:9. Многие пленки были отсняты даже с еще более широкими пропорциями кадра.
В Premiere Pro можно реализовать леттербоксинг или метод панорамирования и сканирования, используя свойства эффекта «Движение», такие как «Положение» и «Масштаб».
Леттербоксинг
При импорте клипов, снятых с одними пропорциями кадра, в проект, использующий другие пропорции кадра, нужно выбрать способ согласования разных значений. В этом случае над и под кадром фильма отображаются черные полосы, что называется почтовым ящиком (леттербоксинг).
Например, для показа фильма 16:9 на стандартном телевизоре 4:3 используются два типичных метода. Можно поместить кадр фильма 16:9 в кадр телевизора 4:3 по всей ширине.
Панорамирование и сканирование
Панорамирование и сканирование — это альтернативный способ использования проекта с другой пропорцией. Сохраняется только часть кадра, а все остальное теряется.
Например, еще один способ показа фильма с пропорцией 16:9 на стандартном телевизоре 4:3 — заполнить кадр 4:3 по вертикали кадром 16:9 так, чтобы их высоты совпадали. Затем, кадр 16:9 панорамируется по горизонтали в более узком кадре 4:3 так, чтобы важные действия всегда оказывались в кадре 4:3.
Попиксельная пропорция определяет отношение ширины к высоте для одного пиксела кадра. Пикселы, составляющие кадр, обладают попиксельной пропорцией (иногда называемой PAR). Попиксельные пропорции могут меняться, так как разные видеосистемы делают собственные предположения о числе пикселов, необходимых для заполнения кадра.
Например, во многих компьютерных видеостандартах кадр с пропорцией 4:3 определен как 640 пикселов в ширину на 480 пикселов в высоту, что приводит к квадратному пикселу. Пикселы компьютерного видео имеют попиксельную пропорцию 1:1 (квадратную). В таких видеостандартах, как DV NTSC, кадр с пропорцией 4:3 определяется как кадр размером 720x480 пикселей, что приводит к более узким, прямоугольным пикселам. Пикселы DV NTSC имеют пропорцию пиксела 0,91 (неквадратная). Пикселы DV, всегда прямоугольные, ориентированы вертикально в системах, создающих видео NTSC, и горизонтально в системах, создающих видео PAL. Premiere Pro отображает пропорции пиксела клипа рядом с его миниатюрой на панели «Проект».
A. Изображение 4:3 с квадратными пикселами, выведенное на монитор 4:3 (компьютерном) с квадратными пикселами B. Изображение 4:3 с квадратными пикселами, правильно интерпретированное для отображения на мониторе 4:3 (ТВ) с неквадратными пикселами C. Изображение 4:3 с квадратными пикселами, неправильно интерпретированное для отображения на мониторе 4:3 (ТВ) с неквадратными пикселами
Чистая диафрагма — часть изображения, свободная от артефактов и искажений, появляющихся на краях изображения. Производственная диафрагма представляет собой все изображение.
Искаженные изображения
Если без изменений отобразить прямоугольные пикселы на мониторе с квадратными пикселами, изображения будут выглядеть искаженными, например, круги превратятся в овалы. Но при отображении на контрольном видеомониторе пропорции изображений выглядят правильно, поскольку на контрольных видеомониторах используются прямоугольные пикселы. Premiere Pro может без искажений отображать и выводить клипы с разными пропорциями пиксела. Premiere Pro пытается автоматически согласовать их с попиксельной пропорцией проекта.
При импорте ресурса Premiere Pro пытается сохранить пропорции кадров, попиксельные пропорции и размеры кадров, чтобы ресурс не отображался обрезанным или искаженным.
Для ресурсов с метаданными такие вычисления выполняются автоматически и точно. Например:
- При съемке или импорте видеоряда NTSC с размером кадра ATSC 704x480, размером кадра D1 720x486 или размером кадра DV 720x480 попиксельные пропорции задаются как отношение D1/DV NTSC (0,91).
- При съемке или импорте видеоряда высокой четкости с размером кадра 1440x1080 задается попиксельная пропорция HD 1080 Анаморфная (1,33).
- При съемке или импорте материала PAL с разрешением D1 или DV 720x576 попиксельные пропорции задаются как отношение D1/DV PAL (1,094).
Для ресурсов без метаданных требуется набор правил интерпретации попиксельной пропорции. Для других размеров кадра Premiere Pro предполагает, что ресурс был разработан с квадратными пикселами, и изменяет попиксельные пропорции и размер кадра так, чтобы сохранить для пропорции изображения. Если импортированный ресурс искажен, можно задать попиксельные пропорции вручную.
Ресурсы в эпизоде
Если перетащить ресурс в эпизод, ресурс по умолчанию размещается в центре кадра программы. В зависимости от размера кадра получившееся изображение может быть слишком мало или слишком сильно обрезано для потребностей проекта. Premiere Pro может изменить его масштаб автоматически при перетаскивании ресурса на эпизод или его можно изменить вручную.
Это всегда важно для правильной интерпретации файлов. Размеры кадра и пропорции пиксела для ресурса можно узнать рядом с миниатюрой предпросмотра и в столбце «Данные видео» на панели «Проект». Эти данные также можно найти в диалоговом окне «Свойства» ресурса, в диалоговом окне «Интерпретировать материал» и на панели «Информация».
Искажение пропорций в эпизоде
Шаблон настроек эпизода, выбранный при его создании, определяет для эпизода пропорции кадра и попиксельные пропорции. После создания эпизода пропорции изменить нельзя, но можно изменить попиксельные пропорции, предполагаемые в Premiere Pro для отдельных ресурсов.
Сохраняйте соотношение сторон вложенного элемента при изменении размера родительского элемента.
До появления Figma Auto Layout наши дни были мрачными и полными ужасов. Чтобы отобразить разные состояния одного и того же элемента, нам приходилось создавать массу компонентов. С Auto Layout 2.0 все изменилось. Стало намного проще изменять кнопки, списки и карточки. Но, едва поставив последнее обновление, мы уже жаждем новых функций…
Хотели бы вы добавить в Auto Layout следующие функции?
И сегодня, мы добавим хотя бы одну из них…
Проблема соотношения сторон
99% практики, реальные задачи от крупных компаний страны и шанс попасть на работу мечты.Типичный пример – компонент карточки с изображением обложки, которое должно растягиваться, сохраняя соотношение сторон при изменении ширины карточки, например:
Но мы знаем, что с обычным вертикальным Auto Layout это невозможно – обложка будет просто растягиваться по горизонтали, сохраняя фиксированную высоту:
Интерес читателей, в виде лайков и комментариев, к этому треду в Spectrum говорит о том, что людям нужна эта функция, но ответа не последовало, и канал был заархивирован.
Я так устал управлять компонентами карточки в нашем основном проекте. Приходилось создавать новые варианты для всех карточек, чтобы поддерживать все 5 точек останова. И все это только, чтобы иметь обложку с фиксированным соотношением сторон… Затем мы начали новый проект, и возникла та же проблема… А потом она повторилась в моем личном проекте!
Решение
Я снова начал новый тред, описывающий эту проблему, и 4 месяца спустя Mr.Biscuit предложил невероятную идею диагонального ресайзера (посмотрите также его Figma Challenge и результаты, достигнутые его участниками – это просто потрясающе!).
Позже я обнаружил аналогичную концепцию в сообществе Figma, опубликованную намного раньше.
Тем не менее, это было не совсем то, чего я хотел. Когда я растягиваю карточку изнутри, то контролирую только эту карточку. Но представьте себе изменение размера многоколоночной сетки с большим количеством карточек внутри. Редактирование всех карточек будет выматывающим занятием… Мне нужно было обычное поведение – карточка с гибкой шириной, которая при изменении содержимого растягивалась и сжималась, сохраняя соотношение сторон.
Однако концепция была настолько интересной, что посеяла семена надежды. И я немного поэкспериментировал с ней.
Как это работает
Я придумал, как добиться нужного результата, но, честно говоря, не до конца понял, как это работает…
Концепция заключается в следующем:
- Вы переносите два объекта с разрешением 0 пикселей в Auto Layout.Секрет в том, что вFigma001pxстановится 0px.
Этот приём мне показал Роман Назаренко, а затем мы сделали многие компоненты с такими 0-пиксельными фреймами, чтобы «хакнуть» AutoLayout.
То же самое мы видим в концепции Mr.Biscuit. - Этот фрейм поворачивается и превращается в вертикальный Auto Layout с 0 отступами.
- Вуаля!
Проблемы:
- Вертикальный размер содержит субпиксели: фрейм 160x100pxстановится 162x25px – но давайте не будем учитывать это.
- Вертикальный размер пропорции ограничен. Чтобы добиться фиксированного соотношения 1: 1, между ними нужно добавить еще один Auto Layout. Чтобы создать более высокий компонент, например, с соотношением сторон 3: 4, нужен еще один:
Вы можете заметить, что углы и направления Auto Layout хаотичны. Какой угол применить и какой макет выбрать, горизонтальный или вертикальный? Ответ: я не знаю. Результат выше был получен после нескольких часов экспериментов, когда я настраивал углы и менял направление десятки раз.
Для каждого нового соотношения я добавил новый компонент обложки (cover component) и разместил его экземпляры на трех карточках разной ширины. Поверх них я разместил полупрозрачные прямоугольники соответствующей ширины и нужного соотношения сторон. Затем поворачивал диагональный ресайзер в компоненте обложки по одному градусу, а затем по 0,1º и даже 0,01º для достижения необходимого результата (здесь пригодилась опция «Show Outline» и масштабирование, чтобы подогнать края с максимальной точностью). Это может показаться слегка безумным, но это было не так уж и сложно:
На данный момент мной создано 12 компонентов обложки с разными соотношениями сторон, и можно легко добавить гораздо больше:
Они могут немного глючить при изменении размера, но конечный результат соответствует ожиданиям, даже в сетках с несколькими столбцами:
Что дальше?
Однако мы продолжим улучшать функциональность до Auto Layout 3.0 и даже после его релиза, потому что это часть нашей повседневной творческой рутины!
Автор: Сергей Бунин. Дата публикации: 15 апреля 2017 . Категория: Обработка фотографий в фотошопе.
Приветствую Вас, любители фотоискусства!
С приходом эпохи цифровой фотографии, взаимоотношения фотографа с фотоаппаратом кардинально изменились, и сколько бы ни было споров, но любому фотографу все равно приходится в той или иной степени обращаться к графическим редакторам.
Снимок цифровой фотокамеры не является чем-то завершенным, законченным, и поэтому даже самые элементарные вопросы, такие как кадрирование или необходимая конвертация изображения из RAW файла в файл пригодный для отображения на сторонних электронных устройствах или размещения в интернете, решаются через обработку в различных программах: Photoshop, Lightroom, Capture One или других.
Важным элементом подготовки для отображения или печати является установка размера и разрешения изображения, поэтому в этом материале Вам предлагается разобраться с этими параметрами.
В этом понятии пиксель – это наименьший логический элемент двумерного цифрового изображения.
Есть еще понятие пикселя как элемента экрана, формирующего изображение на мониторах.
Вот, наверное, из-за такой двойственности определения пикселя некоторые начинающие фотолюбители путают понятия размера изображения и его разрешения.
Разобраться в этом нам поможет фотография, сделанная моей хорошей знакомой – фотографом Оксаной Ермихиной.
Размер изображения в пикселях – это их количество по ширине и высоте, равно как измерять эти величины можно и в других единицах.
В нашем случае видно, что изображение вписывается в размер 1200 пикселей по ширине и 706 пикселей по высоте.
Ниже строки «Размеры» находится строка функции «Подогнать под:». Нажав на стрелку в правой части текстового поля, получим перечень возможных размеров, в которые программа автоматически способна перевести изображение.
Изменение размеров изображения в пикселях влияет не только на его размер, на экране, но и на качество отображения и качество при печати.
При изменении размера изображения можно выбрать вариант сохранения пропорции соотношения между высотой и шириной, либо изменения каждой величины можно осуществлять по отдельности. Для этого в поле «Размер изображения» между строками «Ширина» и «Высота» находится функциональная кнопка с изображением звена цепочки.В нажатом состоянии этой кнопки, когда отображается линия, соединяющая между собой строки Ширина и Высота, изменение размера происходит пропорционально.
Если щелкнуть по изображению звена цепочки левой кнопкой мышки, соединительная линия пропадает, и изменение размеров осуществляться независимо друг от друга.
Будьте аккуратнее, так как при этом могут нарушиться пропорции изображения.
Единицы измерения Ширины и Высоты также можно поменять, выбрав требуемый параметр в выпадающем списке.
Еще эта возможность удобна тем, что существует возможность одновременно оценивать размер изображения в разных единицах.
Если Вы что-то накрутили в размерах невероятное, то всегда можно восстановить исходные значения изображения. Для этого необходимо нажать клавишу «Alt» и удерживать ее, при этом название кнопки «Отмена» поменяется на «Сбросить», щелкните по ней и размеры вернуться к первоначальным значениям.
Теперь немного о размере экрана в пикселях.
Как мы уже с Вами говорили выше, существует понятие пикселя как элемента монитора, который формирует изображение. Поэтому размер экрана мониторов также характеризуют соотношением количества пикселей по ширине и высоте, и этот параметр называется разрешением монитора.
Если размер экрана монитора в пикселях примерно совпадает с размером Вашего изображения также в пикселях, то изображение будет демонстрироваться почти на весь экран, а если размер изображения меньше, то на мониторе останутся свободные, не заполненные области.
И капельку про разрешение принтера.
Разрешение принтера измеряется в точках на дюйм, dpi. Как правило, чем больше точек на дюйм, тем лучше качество печатного изображения.
Разрешение принтера отличается от разрешения изображения, но связано с ним. Чтобы напечатать высококачественную фотографию, к примеру, на струйном принтере, необходимо, чтобы разрешение изображения было равно 300 ppi.
Теперь поговорим о разрешении изображения.
Разрешение является мерой четкости деталей растрового изображения и исчисляется в пикселях на дюйм (ppi). Чем больше пикселей в дюйме, тем выше разрешение и соответственно качественнее отображение.
Для примера представлю часть изображения одного размера 200 х 200 пикселей, но с разным разрешением в 300 ppi и 72 ppi.
В целом изображение с более высоким разрешением позволяет получить более высокое качество и при печати.
Когда же мы работаем в графических редакторах, то изменение разрешения изображения, как и изменение его размера не так принципиально, потому что программа автоматически сама сохраняет объем изображения, который в свою очередь определяется размерами и разрешением картинки.
Как это происходит?
Если не устанавливать галочку «Ресамплинг» (ниже мы поговорим об этом параметре), то при изменении разрешения файла его высота и ширина изменяются так, чтобы объем данных изображения оставался прежним.
Пример: при разрешении изображения в 300 ppi физический размер при печати по ширине и высоте составит 10,16 см и 5,98 см соответственно. При этом размер изображения в пикселях находится в соотношении 1200 х 706, обратите на это внимание.
Если мы решим изменить разрешение и уменьшим его до 72 ppi, то увидим, что визуально в программе отображение изображения совершенно не изменяется и его размеры в пикселях остаются неизменными: 1200 х 706 пикселей. Но для сохранения объема данных произошел автоматический пересчет размера картинки в сантиметрах! То есть при таком разрешении мы сможем физически напечатать фотографию размером 42,33 см на 24,91 см.
Оборотная сторона этого процесса такова, что при увеличении физического размера изображения, к примеру, в два раза, соответственно уменьшается вдвое его разрешение. Это говорит о том, что в один дюйм теперь будет вписано вдвое меньше пикселей, которые будут стоять дальше друг от друга, а это отрицательно влияет на качество печати.
Важно понимать, что размеры в пикселях регулируют объем данных, а разрешение и физический размер используются только для печати.
Что будет происходить, если будет активирована функция «Ресамплинг»?
Ресамплинг изменяет объем данных изображения при изменении его размеров в пикселях либо разрешения.
Вот часть изображения с нормальным размером в пикселях 60 х 60, разрешение 300 пикселей на дюйм, масштаб отображения 100%. 
При уменьшении числа пикселей или разрешения (даунсамплинг) изображение теряет часть информации. Размер 20 х 20 пикселей, разрешение 100 пикселей на дюйм, масштаб отображения 100%.
При увеличении числа пикселей или разрешения (ресамплинг) добавляются новые пиксели. Размер 120 х 120 пикселей, разрешение 600 пикселей на дюйм, масштаб отображения 100%
Применение ресамплинга до большого размера в пикселях может привести к снижению качества изображения – уменьшению его детализации и резкости.
Если при уменьшении количества пикселей программа легко справляется с этой задачей, то при повышении количества пикселей ей приходится «угадывать», т.е. высчитывать какие пиксели необходимо добавить.
Изменение одного из значений влияет на другое.
- Изменение размеров в пикселях влияет на физический размер и объем файла, но не изменяет разрешения;
- Изменение разрешения влияет на размер в пикселях и объем файла, но не изменяет физического размера;
- Изменение физического размера влияет на размеры в пикселях и объем файла, но не изменяет разрешения.
В итоге, при использовании функции «Ресамплинг» можно изменить любое значение в диалоговом окне «Размер изображения»: размеры в пикселях, физический размер или разрешение.
Программа Photoshop предлагает несколько алгоритмов работы функции «Ресамплинг», поэтому в случае необходимости Вы можете подобрать для себя наиболее приемлемый из них:
- Автоматический – метод, основанный на выборе типа документа и увеличения либо уменьшения его масштаба отображения;
- Сохранить детали (с увеличением) – метод при котором становится доступным регулятор «Снижение шума» для сглаживания шума при масштабировании изображения;
- Бикубический (с увеличением) – метод для увеличения изображений на основе бикубической интерполяции, разработанный специально для получения более гладких результатов;
- Бикубический (с уменьшением) – метод для уменьшения на основе бикубической интерполяции с повышенной резкостью;
- Бикубический (более плавные градиенты) – метод медленный, но более точный, основанный на анализе значений цвета окружающих пикселей. Дает более плавные цветовые переходы.
- По соседним пикселям (четкие края) – быстрый, но менее точный метод. Он сохраняет четкие края, однако может сделать их зубчатыми;
- Билинейный – метод, который добавляет новые пиксели, рассчитывая среднее значение цвета окружающих пикселей.
Чтобы избежать применения функции «Ресамплинг» заранее создавайте изображения или сканируйте их с достаточно высоким разрешением.
Как это все выглядит на практике?
Уже отмечалось, что при просмотре изображений на экране мониторов разрешение картинки особо не влияют на качество. Почему? Все очень просто средний размер изображения полученного с матрицы современных зеркальных фотоаппаратов, составляет примерно 5184 х 3456 пикселей. А разрешение мониторов среднего класса 1280 х 720 пикселей. Поэтому при отображении происходит программный подгон физических размеров изображения под размер экрана (происходит сжатие и уменьшение размеров пикселя), что в свою очередь приводит к повышению четкости картинки.
В свое время для мониторов (правда, еще для ЭЛТ) было принято значение разрешения картинки равным 72 пикселям на дюйм, современные ЖК мониторы для ПК в основном имеют разрешение 96 пикселей на дюйм. При этом программа Photoshop и другие редакторы демонстрируют изображение в режиме отображения реального пикселя фото в соответствии с пикселем монитора.
Если же распечатать в таком разрешении эту картинку, то получим нечто следующее:
Видно, что снимок потерял былую четкость.
Для печати в фотолаборатории мы можем самостоятельно указать физический размер снимка в сантиметрах и разрешение 300 пикселей на дюйм. Это тоже общепринятая величина для получения максимально качественной печати, так как фотолаборатории обычно производят печать с разрешением 256 dpi. В этом случае Вы получите реальную четкость, резкость и цвет своего снимка.
Единственная неприятность это то, что при пересчете разрешения изображения Вы потеряете физический размер картинки.
Чтобы избежать этого включите функцию «Ресамплинг» и с необходимым для Вас алгоритмом повторите изменение разрешения, но уже с сохранением физического размера.
Как видно физический размер картинки остался неизменным увеличился размер изображения в пикселях и соответственно вырос объем файла, но качество изображения не отличается от исходника и вполне соответствует требуемым параметрам для печати.
Сейчас современные интернет ресурсы сами отлично справляются с задачей даунсамплинга, в частности с уменьшением разрешения изображений. В связи с этим, чтобы не менять каждый раз разрешение изображений, рекомендую сразу в настройках управления экспортом файлов Ваших конверторов и графических редакторов установить параметр «Разрешение» равным 300 пикселей на дюйм.
Вот в принципе и все общие понятия изменения размера и разрешения изображения. Надеюсь, что хоть немного помог Вам разобраться в этом.
Приятных творческих успехов!
Если Вы не хотите пропустить интересные уроки по обработке фотографий - подпишитесь на рассылку.
Форма для подписки находится ниже.
Читайте также: