Картинка последний размер – Про разрешение и размеры изображений

Содержание

Про разрешение и размеры изображений

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

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

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

Помимо измерения в пикселях или абсолютного размера также его можно характеризовать физическими размерами. Стоит различать эти два понятия. В то время как абсолютным размером можно измерить только общее количество пикселей изображения, которые составляют изображение по вертикали и горизонтали, а физические размеры измеряются с учетом размера данных пикселей, которые в свою очередь характеризуются «Разрешением» изображения (Разрешение — Это величина, которая измеряется в пикселях на дюйм (12см) она отражает количество пикселей на одном линейном дюйме, таким образом определяя их размер.

Например если изображение с разрешением 150 пикселей, то это не означает что на каждый его дюйм (квадратный) приходится 150 пикселей. Но на самом деле 150 пх располагаются последовательно в отрезке который длиною один дюйм. А квадратный дюйм естественно содержит 150х150 = 22500 пикселей. Три неразрывно связанных понятия это — «размер изображения в пикселях, его разрешение и его физические размеры. При фиксации количества пикселей из которых состоит изображение при изменении его разрешения меняется и его физические размеры. Увеличение разрешения сопровождается увеличением или уменьшением размеров изображения. При изменении же разрешения когда отсутствует фиксация абсолютного размера ведет к изменению количества пикселей составляющих его, а увеличение наоборот, но физические размеры остаются неизменны.

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

В мониторе разрешение зависит от геометрических размеров экрана и его разрешающей способности. Разрешающая способность экрана измеряемая в пикселях по горизонтали и вертикали т.е. те которые он может отобразить. В основном у мониторов, в зависимости от размера диагонали экрана, она составляет 640х480 пикселей (четырнадцать дюймов), 800х600 пикселей (Пятнадцать дюймов) и 1024х768 пикселей (семнадцать дюймов), рабочее разрешение составляет 72ppi именно поэтому графика для веб сайтов создается именно по этому 72ppi разрешению. В новых моделях мониторов это разрешение достигает 80-85ppi. при отображении изображения каждому экранному пикселю ставится пиксель изображения, размер изображения, а точнее его области определяется абсолютным размером изображения, геометрическими размерами экрана монитора и рабочим разрешением монитора.

Изображение фиксированного размера, к примеру, 150х100 пикселей с разрешением на экране 72ppi займет 2х1,4 дюйма что равно 5х3,5см (150 пикселей/72 ppi = 2,08 дюйма, 100 пикселей/72ppi =1,39 дюйма, 1 дюйм равен 2,54см).

С разрешением экрана в 85ppi такое же изображение займет 1,7х1,18 дюйма равно 4,5х3см (150 пикселей/85ppi = 1,76 дюйма, 100 пикселей/85ppi = 1,18 дюйма).

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

При этом выбор необходимого разрешения осуществляется с учетом устройства вывода.

При печати изображения выбирается разрешение с учетом линиатур растра печатного устройства (принтера).

pixelbox.ru

Форматы и размеры фото для печати.

Нас часто спрашивают: — «Можно ли у вас распечатать фотографии А4?».

Конечно, мы можем напечатать фотографии почти любых размеров, но этот вопрос требует разъяснений.

Форматы фотобумаги отличаются от международных форматов ISO, но чаще всего в быту мы оперируем именно привычными для нас терминами и размерами, такими как — А4, ватман и т.д. Хотя форматы фотобумаги и обычные форматы достаточно близки, они все же отличаются друг от друга.

Основные фотоформаты имеют соотношение сторон, аналогичное матрицам современных цифровых камер 1: 1,5 (2/3) или 1: 1,33 (3/4). Стандартные международные форматы бумаги имеют соотношение сторон 1: 1,4142, то есть они не совпадают по пропорциям. При печати на минилабах Noritsu используются именно фотостандарты. Также фотостандартам соответствуют и такие знакомые нам фоторамки и фотоальбомы для хранения фотографий.

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

Фотоформат, который мы печатаем	Размер фото в px	Размер фото в мм	Соотношение сторон	Стандарт ISO	Размер ISO в мм
10х15	1217×1807	103×153	2:3	≈А6	105х148
15×21	1807×2492	153×211	3:4	≈А5	148х210
20х30	2409×3614	204×306	2:3	≈А4	210×297
30х40	3614×4972	306×421	3:4	≈А3	297х420
30х45	3614х5410	306х458	2:3	≈А3	297х420
30х60	3614×7217	306х611	1:2	≈А2	420х594

Теперь разберемся подробно с каждым из фотоформатов. Популярный формат 10х15 по одной из сторон на 2 мм меньше, чем стандартный А6, по другой на 5 мм больше. Поэтому, если нужен именно А6, стоит заказать фото 15х21 и обрезать лишнее вручную.

Ниже вы видите как соотносится формат 10х15 с известным А4.

Фотография 15х21 будет чуть больше, чем лист А5. По одной из сторон на 5 мм, по другой — на 1 мм. Поэтому, если нужен именно А5, смело заказывайте фото 15х21, лишнее обрежете.

Ниже вы видите соотношение 15х21 к А4.

Формат 20х30 это почти А4, но фото по одной стороне на 6 мм меньше, а по другой больше на 9 мм, чем А4. 20х30 и А4 — несоразмерны.

Ниже приведено соотношение фото 20х30 к А4.

Если необходимо А3, тогда выбирайте фото 30х40. 30х40 на 9 мм с одной стороны и на 1 мм с другой больше чем А3. Спокойно заказываем и обрезаем самостоятельно =).

Ниже вы видите соотношение 30х40 и А3.

Фото 30х45 больше, чем А3. Это видно на картинке ниже.

Фото 30х60 трудно сравнивать с обычной бумагой. 30х60 значительно меньше, чем А2 (ватман) и значительно больше, чем А3. Но это не мешает снимкам 30х60 быть популярными среди фотохудожников.

Ниже вы видите соотношение фото 30х60 к А3.

Ниже приведено соотношение фотоформатов между собой.

Команда pro.cyfrolab

pro.cyfrolab.com

Пиксели, разрешение и печать цифровых изображений

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

Растровое изображение, а именно с таким видом графики работает фотошоп, состоит из крошечных элементов —

пикселей, как любой предмет из мельчайших частиц — атомов.

Пиксели — это крошечные элементы, квадратной формы, которые содержат в себе информацию о цвете, яркости и прозрачности. Термин происходит от скрещивания двух английских слов – picture (изображение) и element (элемент).

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

Обратите внимание на палитру «Навигатор». Красной рамочкой отмечена видимая часть изображения. Я увеличил до 1200% район, где изображен нос и рот панды. Как видите, изображение состоит из набора цветных квадратиков. В увеличенном виде это похоже на лоскутное одеяло из квадратных фрагментов.

Внимательно приглядевшись, можно понять основные принципы построения изображения:

1. Пиксели квадратной формы и выстраиваются в изображении в виде сетки (вспомните тетрадный лист в клеточку).

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

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

Разрешение изображения

Понятие разрешение изображения неразрывно связано с пикселями.

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

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

Кстати, если перемножить эти два числа — 1920×1280 (в моем примере получится 2 457 600 пикселей), то получим общее количество «лоскутков», из которых состоит конкретное изображение. Это число можно сократить и записать как 2,5 мегапикселя (МП). С такими сокращениями вы сталкивались, когда знакомились с характеристиками цифрового фотоаппарата или, еще к примеру, камерой в смартфоне. Производители техники указывают предельную величину, на которую способен их продукт. Значит, чем выше число МП, тем больше может быть разрешение будущих снимков.

Итак, чем больше разрешение, тем меньше пиксели, а значит возрастает качество и детализация снимка. Но фотография с большим разрешением будет и больше весить — такова цена качества. Поскольку каждый пиксель хранит в себе определенную информацию, с увеличением их количества, требуется больше количества памяти компьютера, а значит и растет их вес. Например, фото с медведями вверху статьи с разрешением 655×510 весит 58 КБ, а фото с разрешением 5184×3456 займет 6 МБ.

Размеры пикселя и печать

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

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

Примечание

Обратите внимание, когда вы создаете новый документ в фотошопе, то программа по умолчанию предлагает вам именно это значение:

Просматривая на компьютере большие фотографии размером, например, 5184×3456, чувствуется насколько она детально прорисована, нет зернистости и никаких дефектов, она яркая и четкая. Но поверьте, такая фотография опять же 72 точки на дюйм. Откроем ради интереса свойства изображения:

Большая фотография будет классно смотреться на компьютере благодаря масштабу. Какое у вас стоит разрешение экрана? Явно не 5184×3456, а меньше. Так значит компьютер должен уменьшить такую фотографию, чтобы она уместилась целиком на экране компьютера. Происходит сжимание пикселей и уменьшение их размеров, а значит вот оно классное качество снимка. Если бы вы просматривали такую фотографию в исходном размере, то могли бы с легкостью разглядеть размытость и потускнение изображения, а также резкие края контрастных деталей.

О размерах пикселя в большинстве случаев вспоминают, когда дело касается печати фотографии. Здесь 72 точек может не хватить.

Для примера я создал документ размерами 655×400 пикселей с разрешением 72 точки. Посмотрите в графу размер печатного оттиска:

Фотошоп вычислил, что изображение размером 655×400 и разрешением 72 точки можно будет распечатать на бумаге размером 9,097×5,556 дюймов (в сантиметрах это 23,11×14,11)

Как посчитать самому

655 пикселей в ширину, разделенные на 72 пикселей на дюйм = 9,097 дюймов ширины
400 пикселей делится на 72 пикселей на дюйм = 5,556 дюймов высоты

Казалось бы, «Вау! На каком большом листе можно распечатать!». Но по факту фотография будет примерно такой:

Размытая фотография, нет резкости и четкости.

Принтеры считаются устройствами высокого разрешения, поэтому, чтобы фотографии были красиво напечатаны, требуется либо печатать фотографии изначально большого размера, как у меня 5184×3456, либо менять количество точек на дюйм в диапазоне от 200 до 300.

Вновь возьму тоже изображение 655×400, но изменю количество точек на 200, вот что пишет фотошоп:

Уменьшился размер печатного оттиска почти в три раза. Теперь у нашего изображения печатается 200 пикселей на 1 дюйм бумаги.

Что же получается, изображение будет маленьким, едва ли уберется на стандартную фотографию 10 на 15, но зато оно будет качественным, четким и детально прорисованным.

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

Какого размера должно быть изображение, чтобы его красиво распечатать

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

Пример 1

Итак, как правило, в фотоальбом идут фоточки размером 10×15 см (в дюймах это составляет 3,937×5,906). Сейчас узнаем какой должен быть минимальный размер фотографии, чтобы все красиво распечаталось. Для расчетов берем разрешение 200 точек на дюйм.

200 пикселей на дюйм х 3,937 дюйма в ширину = 787 пикселей;
200 пикселей на дюйм х 5,906 дюймов в высоту = 1181 пикселей.

То есть фотография 10×15 см = 787×1181 пикселей, минимум (!)

А узнав общее количество пикселей в таком разрешении (787 × 1181 = 929447 пикселей), округлив до миллионов, получим 1МП (мегапиксель). Я уже писал, что количество мегапикселей эта наиважнейшая характеристика современных фотоаппаратов. Среднее количество МП в фотоаппаратах и смартфонах достигает примерно 8 МП.

Значит нынешняя техника легко позволит делать фотографии, пригодных сразу для печати снимков в 10×15 см.

Пример 2

Теперь разберем случай, когда вы выбрали фотографию и хотите повесить ее на стену в рамку размером, допустим, 30×40 см (я взял размер рамки из каталога магазина IKEA), сразу переведу в дюймы: 11,811×15,748. Для такого размера фотографии я бы взял максимальный размер разрешения: 300 точек на дюйм, это уже считается профессиональной и самой качественной печатью (как раз то что надо для большой картины в рамке). А теперь расчеты:

300 пикселей на дюйм х 11,811 дюйма в ширину = 3543 пикселей;
300 пикселей на дюйм х 15,748 дюймов в высоту = 4724 пикселей.

Таким образом, ваше фото должно быть минимум 3543×4724 пикселей. Перемножаем значения и получаем 16.737.132 пикселя или 17 МП!

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

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

Дано: У нас имеется цифровое изображение известных нам размеров, например, 3264 на 2448 пикселей, и набор стандартных форматов, предлагаемых сервисами фотопечати. Формат определяет линейные размеры фотографии, например, фотография формата 10х15 имеет размеры 102 на 152 миллиметра.

Единственное специальное знание, которым нужно обладать для нахождения ответа, это знание того, что качественная печать цифрового изображения требует разрешения не менее 300 точек (пикселей) на дюйм (300 dpi), а более-менее приемлемая печать возможна при разрешении не менее 150 точек на дюйм (150 dpi). Все остальное — простые математические действия.

Логика поиска ответа проста — линейные размеры каждого формата переводятся в дюймы, а затем в пиксели, исходя из того, что в одном дюйме 300 (150) пикселей. Далее полученное число сравнивается с размером изображения (там есть определенные нюансы, связанные с отношением высоты и ширины, но об этом во второй части). Если размер формата в пикселях больше, чем размер нашего изображения (на рисунке — формат справа от фотографии), то он уже не подойдет, ибо фотографию придется растягивать, и мы получим разрешение хуже 300 (150) dpi. Если размер формата меньше, чем размер нашего изображения (на рисунке — формат справа от фотографии), то он подойдет — фотографию придется сжимать, и мы получим разрешение лучше 300 (150) dpi.
Из всех подходящих форматов калькулятор выбирает формат максимального размера (с печатью изображений меньшего размера проблем нет — насколько я понимаю, печатать можно и с разрешением 1200 dpi).
Подбор формата фотографии по размеру изображения в пикселях
Рекомендованный формат для печати с разрешением 300 dpi

Размер формата в пикселях для разрешения 300 dpi

Рекомендованный формат для печати с разрешением 150 dpi

Размер формата в пикселях для разрешения 150 dpi

save Сохранить share Поделиться extension Виджет
Второй калькулятор по размерам уже напечатанного снимка и размерам исходного изображения помогает определить получившееся разрешение снимка и обрезанную при масштабировании часть. Сформулируем задачу.
Дано: Изображение известных размеров напечатано на снимке известных размеров. Поскольку значение соотношения высоты и ширины снимка и значение соотношения высоты и ширины цифрового изображения, как правило, не совпадают, то при печати происходит масштабирование снимка, очевидно, с сохранением пропорций. Графически это отображено на рисунке ниже.
При масштабировании, как видно, возможны два варианта:
первый — масштабирование с потерей части изображения,
второй — масштабирование с сохранением всего изображения, но с возникновением пустого места на снимке.
Как эстет, для расчетов я выбрал первый вариант.
Таким образом, первое, что требуется: найти получившееся разрешение снимка и часть изображения, которая не попала на снимок. Второе, соответственно, это будет разница между использованной шириной (высотой) и исходной шириной (высотой) изображения.
Чисто пикселей на дюйм
Ширина напечатанного изображения, см
Высота напечатанного изображения, см
Ширина изображения в пикселях
Высота изображения в пикселях
Соотношение высоты к ширине при печати

Соотношение высоты к ширине в пикселях

Используемая ширина при сохранении пропорций, пикселей

Используемая высота при сохранении пропорций, пикселей

Разрешение при печати, в пикселях на дюйм

save Сохранить share Поделиться extension Виджет
planetcalc.ru
Cтандартные размеры фотографий
Стандартные размеры фотографий нам нужны, например, когда мы хотим напечатать свою фотографию в фотолабораториях. Современные фотокамеры дают нам возможность получать снимки в очень больших разрешениях, но при редактировании в фото редакторах и кадрировании, мы получаем кадры произвольного размера. Чтобы не получать при печати совсем не то, что вам нужно, сохраните себе таблицу, где указаны размеры фотографии в см. Возможно, вы не пользуетесь, или просто не особо знакомы с редактором фотошоп, тогда вам пригодятся вот эти файлы. Вот тут полная версия, а тут для стандартных размеров. В готовые PSD файлы вставляете свою фотографию, сохраняете и отправляете на печать. Все PSD файлы в разрешении 300 dpi (300 точек на дюйм), это сделано для того, чтобы качество фотографии было на высоком уровне.
Стандартные размеры фотографий обычно используются вот такие: 10×15, 15×20, 20×30. Чтобы вы могли себе представить сразу, запомните: 20×30 — это лист размера А4, 15×20 — это половинка А4, называется А5.
Если вам нужен более подробный список размеров, то смотрите ниже в таблице.
Размер фотографии в дюймах
Стандарт Размер в дюймах
9×13 3,543 x 5,117
10×15 3,937 x 5,907
13×18 5,117 x 7,087
15×20 5,907 x 7,873
15×21 5,907 x 8,267
15×22 5,907 x 8,66
15×30 5,907 x 11,81
15×38 5,907 x 14,96
15×45 5,907 x 17,717
18×24 7,087 x 9,45
18×25 7,087 x 9,843
20×25 7,873 x 9,843
20×30 7,873 x 11,81
25×38 9,843 x 14,96
30×40 11,81 x 15,747
30×45 11,81 x 17,717
30×90 11,81 x 35,433
Готовые шаблоны
1. Сохраните картинку с нужным размером: кликните на картинку левой кнопкой мыши — нажмите сохранить изображение/картинку.
2. Откройте скачанную картинку в любом фоторедакторе (например, Photoshop или Paint) и вставьте свою фотографию поверх.
3. Готово! Можно нести в печать.
София Розановская
100secrets.ru
Идеальный размер изображений ⋆ Разработка сайтов и SEO Продвижение
Обучение Web Design от “Web Studio Andreyanka”
1. Какой размер картинки должен быть на сайте?
Одним из самых распространенных вопросов: “какой размер картинки должен быть?” Это всегда сложный вопрос, чтобы ответить, потому что это действительно зависит от того, как вы планируете использовать свою новостную фото-ленту. И вот некоторая информация, которая может помочь вам решить, какой размер лучше сделать:
Очень большие изображения = большой размер файла = время загрузки. Сохраняйте ваши изображения в формате“веб”
Это означает, что изображения размером менее 1920 × 1200, нужно «Сохранить для Интернета» в Photoshop, чтобы максимально уменьшить размер файла, при этом не жертвуя качеством изображения.
Или можно скачать и установить программу, наподобие Image Resizer. Программа, которая будут сжимать вес изображения, но качество их не будет теряться.
2. Не используйте изображения больше, чем они должны быть.
Это значит что не надо вставлять изображения , которое будет выходить за границы вашего сайта, если в разметке страницы у вас стоит ширина 1200px, то изображение должно быть не более 1200px.
3. Изображения всегда будут масштабироваться, основываясь на соотношении «Размер сетки»
Ширина Изображения = Ширина Слайдера
Высота Изображения = Высота Сетки (Ширина Слайдера / Ширина Сетки)
Если вы начнёте пользоваться этими простыми инструкциями, то вам никогда больше не придётся задавать себе такие вопросы как: “Почему картинку не полностью видно?” или “Почему надо обрезать фото?”
Друзья заходите к нам на сайт. Следите за новостями. Мы работаем для Вас. Нам просто приятно и радостно, что то делать для другого, ничего не получая взамен. Посмотрите наши другие проекты. Например : Дарильня или Работа в Радость
С Любовью и Уважением к Вам АндреЯнка.
pabota.space
Оптимальный размер фото для сайтов: пошаговая инструкция с фото
И снова здравствуйте, дорогие мои читатели. С вами на связи, Тимур Мустаев. Сегодня хочу отойти от основной темы и рассказать вам, про оптимальный размер фото для сайтов. Многие совершают грубейшие ошибки, когда публикуют фотографии, взятые сразу из фотоаппарата. Сегодня вы узнаете, как правильно подготавливать фотографии, для публикации на сайтах.
С чего все начинается?
Изображения, получаемые цифровой камерой, преобразуются в формат JPEG прямо в самом фотоаппарате. Там для этого есть аппаратный кодек.
Исходный формат RAW имеет слишком большой объем данных, хотя он и хранит максимум информации об изображении, о снятом кадре. Можно сказать, что это копия матрицы камеры на момент съемки.
Но в таком “сыром” виде его использовать нельзя. Поэтому RAW используют профессионалы, как отправную точку для дальнейшей обработки, – либо очень уж крутые фотохудожники, либо эксперты: в области науки, техники, криминалистики, или медицины. В тех случаях, когда надо вытянуть максимум качества из отдельного фрагмента изображения.
Большинство репортеров и даже художников довольствуются JPEG, настраивая камеру под свои цели. (Любой фотограф вам скажет – дайте мне светосилу, а зерно во вторую очередь. Поэтому огромный объектив с просветленной оптикой ценится больше, чем матрица с огромным разрешением.)
Но и в этом виде, фотографии весят очень прилично в мегабайтах. Производители камер ставят на первое место качество изображения, и оно кодируется у них в JPEG практически без сжатия, но с определенной обработкой, относящейся к конкретной модели камеры.
Делать веб-страницы с такими фотками, при всем их качестве, – дело неблагодарное. Они медленно грузятся.
Скорость загрузки является одним из самых-самых важных параметров сайта, особенно коммерческого. Да и простые блоги быстро разочаруют своих поклонников, если появления какого-то интересного или интригующего фотосета придется ждать несколько десятков секунд или даже несколько минут. Так что тут важно, и что предпочесть, и как это сделать?
Давайте разберем по порядку.
Оптимальный размер изображения
Во-первых, не только текст, но и изображения индексируются поисковыми системами, которые предпочитают большие картинки маленьким. Значит, размер картинки целесообразно брать побольше. Но до каких пор?
Очевидно, что до размеров экрана устройства в пикселях. Это максимум, а еще на странице может быть использован двух- или даже трехколоночный макет. Много чего еще зависит от атрибутов тега img. Загруженное изображение может масштабироваться самим браузером, если это предписано в разметке страницы.
Во-вторых, разрешающая способность экрана на большинстве устройств 72 пикселя на дюйм или 96. Совершенно незачем пытаться отображать на таких экранах изображения с 300 пикселей на дюйм. Лишние пиксели будут просто усреднены и будет взята их проекция на один.
А если мы попытаемся изобразить фото в масштабе 1:1 то получим огромное изображение с полосами прокрутки, то есть, сможем наблюдать только часть изображения одновременно.
Выходит, что зря грузилось много мегабайт? Выходит. Вот тут и открывается резерв для сжатия.
Процесс обработки
Есть много программ для работы с изображениями, в том числе и бесплатных. Но лучше, если мы сейчас возьмем какой-либо стандартный, общепризнанный редактор изображений. Например, Adobe Photoshop.
Фотошоп той или иной версии есть практически у всех, кто занимается сайтами, их созданием, поддержкой и продвижением и так далее.
Посмотрим на конкретном примере, как делается оптимизация фотографии, полученной с цифровой камеры, в редакторе Photoshop. В моей случае, я буду пользоваться Adobe Photoshop CS6 русской версией. Для тех шагов, которые мы с вами выполним, подойдет Photoshop любой версии. И так начнем.
1. Открываем фотографию в редакторе
Файл – Открыть. В появившемся окне выбираем нужную фотографию.
На рисунке мы берем фото, имеющее размер около 4,5 Мб. Этот файл у нас в формате JPEG, полученную с зеркальной фотокамеры.
2. Уменьшаем размер фотографии
Изображение – Размер изображения
Здесь выбираем:
Разрешение, ставим 72 пикселя на дюйм, нам больше и не надо.
Размер. Ширину ставим 800 пикселей, он автоматически назначит высоту, в данном случае, он поставил 533 пикселей, согласно пропорций фотографии.
Важно! Ставим все галочки, картинки. Это:
Масштабировать стили;
Сохранить пропорции;
Интерполяция: Бикубическая автоматическая

3. Правильное сохранение
Здесь, мы будем сохранять, специально для веб публикаций. Для этого заходим, Файл – Сохранить для Web.
4. Выставляем качество
Но у нас остался еще вопрос качества. Какой размер фото считать разумным для загрузки? Ну, например, в пределах 200 Кбайт. Такие изображения являются вполне приемлемым компромиссом между качеством и размером.
Выбираем «Высокое» качество 60%. У нас получилось в этом примере 193.5 Кбайт при качестве 60%. Ну и ладно. На вид обработанное изображение почти неотличимо от оригинала. Вот в таком самом виде его и сохраняем. Готово!
5. Проверим в браузере
И наконец, проверим, как будет выглядеть картинка в интернете. Для этого совсем не обязательно грузить ее на хостинг или даже прописывать в html-коде локальной странички. Достаточно просто открыть ее вашим браузером, как это показано на последнем рисунке.
На этом и все. Теперь вы можете выкладывать фотографию куда угодно, веб-сайт, социальные сети и так далее.
На этом я буду заканчивать. Теперь вы знаете, секрет правильного оптимального размера фотографии для веб-страниц. Надеюсь статья вам понравилась, и было бы здорово, если вы поделились в социальных сетях со статьей. Это лучший ваш подарок для меня.
Всех вам благ, Тимур Мустаев.
fotorika.ru