Прогрессивный формат в фотошопе. Сохраняем изображение в формате JPEG гибко. Форматы для сохранения фото

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

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

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

Обратите внимание, что в настройках размера есть два поля – это Размерность и Размер печатного оттиска . В чем же разница между ними? Размер печатного оттиска отображает ширину и высоту печатаемого документа, то есть при отправке на принтер, мы получим, в данном случае, изображение на бумаге, размером 20,11 х 14,66 см с разрешением 72 пикс/дюйм. Но что будет, если мы поменяем разрешение на 300 пикс/дюйм? В этом случае размер печатного оттиска не изменится, а поменяется Размерность . Теперь она составляет 2375 х 1708 пикс.

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

Понятное дело, качество рисунка от этого не улучшится, то есть изображение станет мутноватым. Но по сравнению, скажем, с Paint, Photoshop гораздо лучше справляется с этой задачей – пиксели сглаживаются. На рисунке слева – иконка, увеличенная в 10 раз при помощи Paint, справа – при помощи Photoshop.

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

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

К примеру, у нас есть вот такое изображение, размером 120 х 80 пикс.

Из него мы хотим получить иконку, размером 64 х 64 пикс. Воспользуемся инструментом Размер холста . Для этого выбираем в меню Изображение пункт Размер холста .

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

В итоге получаем иконку нужного нам размера.

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

Кроме самого изображения,в Photoshop существует понятие холста. Представьте себе ситуацию: при работе с изображением у Вас возникла необходимость добавить что-то не на изображение, а рядом с ним (справа, слева, вверху, внизу), а у Вас нет под это места. В таком случае пригодится умение настраивать холст. Холст - это основа, на которую Вы наносите свой монтаж, рабочая поверхность, мольберт художника и пр.

Photoshop даёт возможность изменять размеры холста, не затрагивая размера исходного изображения. К картинке с указанной Вами стороны добавляется кусок холста фонового цвета. Если Вам все ещё непонятно, рассмотрим пример. Откройте документ с утёнком. Выберите в меню Image (Изображение) команду Canvas Size (Размер холста). Она открывает следующее диалоговое окно.

В области Current Size (Текущий размер) диалогового окна находится информация о текущем размере изображения в пикселах и занимаемой им памяти. В области New Size (Новый размер) задается новый размер изображения. Разрешение изображения при этом остается прежним. Сразу после открытия диалогового окна в полях Width (Ширина) и Height (Высота) находятся текущие ширина и высота изображения в единицах, выбранных в списках справа от полей ввода. Переключатель Anchor (Якорь) задает расположение исходного изображения на увеличившемся в размерах холсте. Он состоит из девяти кнопок. Представьте себе, что переключатель представляет собой уже увеличенный холст. Тогда нажатая кнопка показывает положение изображения на этом холсте. Если нажата центральная кнопка, то изображение окажется в центре, окруженное полями со всех четырех сторон. Если же нажата, например, левая верхняя кнопка, то изображение окажется в левом верхнем углу, а поля добавятся только справа и снизу. Флажок Relative (Относительно) позволяет вводить в поля Width и Height непосредственно приращения ширины и высоты (а не прибавлять их в уме к текущим размерам изображения). То есть при включеноом флажке Relative (Относительно) поля Width и Height имеют изначально нулевые значения.

Если ввести в поля Width (Ширина) и Height (Высота) размеры меньшие, чем исходные (или отрицательные в режиме Relative), то часть изображения будет обрезана. Какая это будет часть, опять-таки определяется положением переключателя Anchor (Якорь). Если снова вернуться к сравнению переключателя с холстом, то на этот раз его следует ассоциировать с исходным размером. Положение нажатой кнопки переключателя соответствует сохраняющейся части изображения. Та его часть, что соответствует ненажатым кнопкам, будет обрезана. Например, при нажатой центральной кнопке изображение будет обрезано со всех четырех сторон. Если нажата левая верхняя кнопка, будут обрезаны правая и нижняя стороны изображения. Введите новые размеры холста меньше исходных.

1. Щелкните на кнопке ОК (Да).
2. Photoshop выдаст предупреждение о том, что введенные размеры холста меньше, чем исходные, и часть изображения будет утрачена. Подтвердите свою решимость щелчком на кнопке ОК (Да). Изображение будет обрезано.

Такой способ обрезки изображений часто применяется, если задан результирующий размер изображения. Тогда вам достаточно ввести его в диалоговое окно Canvas Size (Размер холста). Теперь увеличим размер холста. После увеличения размера холста вокруг изображения появится пустое поле. Оно будет иметь тот цвет, который вы установили текущим фоновым.

1. Установите текущим фоновым цветом черный. Быстрее всего это можно сделать, нажав клавишу D (установка основного и фонового цветов по умолчанию), а затем Х (поменять местами основной и фоновый цвета).
2. Откройте диалоговое окно Canvas Size (Размер холста) одноименной командой Canvas Size из меню Image (Изображение).
3. В поля Width (Ширина) и Height (Высота) введите размеры по 700 пикселов.
4. В переключателе Anchor (Якорь) щелкните на средней кнопке.
5. Щелкните на кнопке ОК (Да). Вокруг изображения появится черная рамка шириной 100 пикселов.

Изменение размеров холста не влияет на качество изображения. Оно либо обрезается, либо дополняется пикселями, не имеющими к нему отношения. Увеличение холста можно иллюстрировать следующими примерами:

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

Это могут быть, например, памятные фотографии с праздника или отдыха, которые мы хотим хранить на диске самого компьютера или съёмных носителях (флэш-накопители, жёсткие внешние диски).

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

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

Итак, изображение в Фотошоп готово к сохранению в формате отличном от формата Фотошоп, то есть оптимизации. Если во вкладке «Файл» верхнего меню мы выберем опцию «Сохранить», то, допустим это наше творение, сохранится в формате PSD, то есть файл будет «фотошоповским». Но выбрав другую опцию, которая присутствует в подавляющем большинстве компьютерных программ и именуется «Сохранить как», то в этом случае у нас появляется возможность выбора, - каким типом файла быть нашему творению за пределами Фотошоп:

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

Это окошко откроется перед нами с уже установленными самим Фотошоп настройками. Мы можем, ничего не предпринимая, с ними согласиться нажатием кнопки «Ок». И при таких наших действиях мы можем «спать спокойно» (юмор), процедура оптимизации прошла успешно. А можем в процессе оптимизации и поучаствовать. Давайте увеличим масштаб видимости до 200%, закрыв предварительно открытое окошко регулировки уровня сжатия:

(Расположение кнопки выбора масштаба для версий CS4, CS5).

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

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

Итак, окно настроек перед глазами и мы можем преступать к сжатию изображения:

Для того чтобы видеть как меняется объём файла (изображения) нам нужно, щелчком левой кнопки мыши, поставить галочку в пустом квадратике рядом с надписью «Просмотр». После чего, всё теми же щелчками мыши, выбирать поочерёдно то одну то другую разновидность формата (Базовый стандартный, Базовый оптимизированный, Прогрессивный), дополнительно изменяя и количество шагов (3,4,5):

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

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

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

Следя за изменениями изображения и объёма файла, в то время, когда меняем параметры изображения и разновидность формата, мы прекращаем регулировку в тот момент, когда сочтём нужным. То есть тогда, когда по нашему мнению и объём файла достаточно уменьшился и видимой потери качества картинки не произошло. Ну и далее жмём кнопку «Ок», в этом же окошке.

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

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

Например, мы сжали (оптимизировали) изображение и его объём в Фотошоп таков:

Оптимизированный файл JPG (изображение) я сохраню на рабочем столе компьютера. При наведении курсора на значок файла ОС Windows покажет несколько другое значение.