У вас никогда не возникало вопроса почему в разрешении файла мы должны ставить именно 72 dpi, а не 70, или 50, или 42, если уж на то пошло?
И должны ли?
И что вообще означает dpi?
Давайте разбираться.
Начнём с того, что аббревиатура dpi расшифровывается как dots per inch - точки на дюйм.
Но про какие точки идёт речь, если при создании файла тот же фотошоп вообще ни о каком dpi не спрашивает. Всё что он предлагает касаемо размера файла, это выбрать его высоту, ширину и разрешение (width, height, resolution). Где разрешение измеряется в pixels/inch или pixels/centimeter.
На самом деле dpi - это типографское понятие и означает количество типографских точек при печати на один дюйм бумаги (dots per inch).
В то время, как pixel/inch или pixel per inch (он же ppi) - понятие связанное именно с пикселями на мониторе. Поэтому:
dpi - разрешение печати
ppi - разрешение монитора
спросите вы.
И будете абсолютно правы) По сути мы говорим об одном и том же - о разрешении картинки, и плотности точек-пикселей из которых эта картинка состоит. Но для пущей ясности нужно прояснить разницу между dpi и ppi.
Теперь, если вас в типографии попросят прислать файл с разрешением сколько-то там dpi, можете смело отвечать:
"Дипиай, это у тебя в принтере. Я работаю с пипиай"
(это шутка, если что)
Так откуда взялось 72?
Для того чтобы во всём разобраться, нам придётся немного погрузиться в историю печати.
Когда-то давным-давно не было принтеров, айпадов, вакомов и геймдева. Картины писали художники живописцы и преимущественно в единственном экземпляре.
В то же время книги писали специально обученные писари, но при этом относительно большими тиражами. Делать это вручную, согласитесь, увлекательно, но утомительно.
И логичной оптимизацией процесса стало изобретение печатных станков, на которых в первую очередь печатались (внимание!) ... буквы.
Текст в таких станках набирался из отдельных металлических букв - литер. И довольно быстро печатники пришли к мысли о стандартизации размеров этих литер для удобства их использования, производства и вообще.
(фото взято отсюда)
Обратите внимание, что ни о каком разрешении, пикселях или точках речи пока не идёт. Только прямой перенос краски с оттиска, только хардкор.
И тут главный прикол в том, что изобретатели всей этой печатной индустрии пользовались не метрической системой измерения длин, а дюймами, футами и прочим беспределом.
Стандартом размера шрифта, выбрали шрифт, которым было набрано первое издание трудов Цицерона. Кстати этот шрифт так и назвали - Цицеро.
Его размер притянули за уши, как 1/72 фута. И эту единицу назвали типографской пайкой (или пикой). Которую в свою очередь поделили ещё на 12 частей (поскольку в Европе тогда использовалась двенадцатиричная система счисления), что б делать шрифты поменьше и побольше. И назвали эти части типографскими пунктами.
И вуаля, у нас есть стандартный шрифт, размером в 12 пунктов (12 pt) и который привязан к дюймово-футовой системе измерений.
Причём эта традиция так и закрепилась вплоть до наших дней, как 12 шрифт - "стандартный шрифт".
Но пока рано забегать в наши дни. Вернёмся обратно в историю, а точнее в 80-е прошлого столетия, когда только-только изобретаются струйные принтеры и появляются первые персональные компьютеры.
Одним из которых был Apple Macintosh, в котором использовался так называемый принцип WYSIWYG (What You See Is What You Get - что видишь, то и получишь).
Суть принципа заключалась в том, чтобы выводимый на экран текст был точно такого же размера, как и напечатанный в газете или книге текст, такого же шрифта и размера.
Для этого один пиксель экрана физически был равен одному типографскому пункту (которым соответствовали типографские шрифты). И соответственно шрифт 12 pt был 12 здоровенных пикселей в высоту.
А теперь внимательно следим за руками:
как мы выяснили, 1 фут = 72 пайки
при этом 1 фут = 12 дюймов
значит 1 дюйм = 72 пайки/12 = 6 пайк
1 пайка = 12 пунктов
значит 1 дюйм = 12 пунктов*6 = 72 пункта
Спокуха! В виде схемы это будет немного нагляднее и проще)
Так вот... напомню, что на тот момент 1 пункт по размеру равнялся одному пикселю экрана макинтоша.
А это значит, что разрешение экрана было 72 пикселя на 1 дюйм.
72 ppi
Дело раскрыто!
...но не до конца.
Именно так, из-за всей этой свистопляски с дюймами и шрифтами разрешение изображений на мониторах с WYSIWYG было 72 ppi. Но в скором времени компьютеры Microsoft начали наступать на пятки макам и придумывать свои стандарты.
Так например была выдвинута идея, что газету или книгу мы держим перед собой на едва вытянутой руке, в то время, как монитор компьютера находится немного дальше, а значит и шрифт на мониторе для компенсации должен быть тоже немножечко больше.
И исходя из этих соображений, приблизительных расчётов и научного тыка, с лёгкой руки разработчиков на винде разрешение стало (барабанная дробь)
96 ppi
Со временем физические размеры пикселей на экране становились всё меньше, стали появляться мониторы всевозможных размеров и разрешений, но заложенные стандарты 72 и 96 и их соотношение с типографскими пунктами и размерами шрифтов так и остались. Хотя физический размер пикселя экрана уже давно не привязан ни к дюймам, ни к футам.
Например экран ноутбука имеет 1920 пикселей по ширине и 1080 по высоте, как и экран среднестатистического смартфона. Но при этом очевидно, что пиксели экрана монитора значительно крупнее чем на том же смартфоне.
Кстати. Если вы счастливый обладатель Windows, вы можете самостоятельно убедиться, что винда использует разрешение 96 .
Пишем текст в любом текстовом редакторе, размер шрифта ставим, например 100 pt.
И тем же самым шрифтом и размером пишем текст в PSD файле с разрешением 72 и 96
Так почему же в итоге мы используем 72?
Дело в том, что исторически компания Apple всегда уделяла большое внимание визуальной составляющей графических интерфейсов и отображаемым шрифтам. Известный факт, что Стив Джобс увлекался шрифтами. И именно эти стандарты ушли в разработку веб страниц, став стандартным разрешением в веб пространстве.
Но по большому счёту нет особой разницы какое разрешение вы поставите у своей картинки, которую планируете выложить в инстаграм. Тут важнее сколько в ней пикселей по высоте и ширине, ведь изображение строится не относительно дюймов экрана, а относительно пикселей экрана, поскольку страничка в соцсетях, или приложение просмотра фото понятия не имеет сколько дюймов в длину ваш экран в данный момент. Зато все они прекрасно знают сколько в них пикселей.
Разрешение 72 пикселя на дюйм важно указывать в psd файлах, с макетами сайтов, где используются шрифты, чтобы размер шрифта в макете соответствовал размеру шрифта на веб странице.
А ещё очень важно использовать одинаковое разрешение при работе над одним проектом разными людьми.
Дело в том, что если я открою файл с разрешением 72 ppi и перенесу в него графику из файла с разрешением 96 ppi, то с картинкой ничего не произойдёт - сколько пикселей по высоте и ширине было, столько и останется.
Но!
Если в файл с разрешением 72 ppi кинуть psd, png или jpg сохранённые с разрешением 96, произойдёт вот что:
Когда закидываешь картинку в открытую рабочую область фотошопа, он превращает эту картинку в смарт-объект и, не обращая внимание на количество пикселей, считает - раз уж тут разное разрешение, то и размер картинок разный. И услужливо пересчитает количество пикселей подогнав их под общее разрешение. Причём внутри смарта картинка будет своего исходного размера.
Звучит сложно и не интуитивно, поэтому очень легко можно случайно накосячить с размерами арта и заметить это только в самый последний момент. Кроме этого, большинство проектов (особенно игровых) так или иначе связано с графическим интерфейсом, и в конечном счёте это коснётся и шрифтов, а как мы выяснили - кегль(размер) шрифта особенно чувствителен к разрешению.
Поэтому во время работы рекомендуется следить за тем, чтобы разрешение было 72 pixels/inch
Но если вдруг оказалось, что разрешение не 72, а больше (или даже меньше) - ничего страшного, на число пикселей вашего арта это не повлияло. Картинка не стала "более мыльной" или "менее чёткой".
Но желательно исправить значение resolution на 72, сохранив при этом размеры по ширине и высоте в пикселях.
Обратите внимание, что меняя разрешение, фотошоп пересчитывает количество пикселей, уменьшая или увеличивая картинку. Но вам важно сохранить исходное количество пикселей.
Что же касается печати.
тут всё проще - для печати важен размер в сантиметрах, а разрешение просто даёт более детальную или менее чёткую картинку.
Соответственно чем больше разрешение, тем больше в ней точек, и тем чётче картинка.
Казалось бы, ставишь размер в сантиметрах, жмыхаешь разрешение миллион dpi для пущей чёткости, и вперёд!
Но это значит в psd файле будет миллион на миллион пикселей, и скорее всего фотошоп впадёт в ступор (как лось в свете фар на ночной трассе), а принтер просто физически не напечатает такие микроскопические точки.
Поэтому для фотопечати принято использовать 300 dpi - это и не слишком накладно для компьютера, и принтер вполне потянет. Есть, кстати лютые принтеры которые могут печатать до 600 точек на дюйм.
А вот в интерьерной печати используется разрешение 150 dpi, этого хватает для небольших баннеров или плакатов, которые не предполагается рассматривать вблизи. А билборды печатают и того с разрешением 50 dpi для экономии возможностей компьютеров и тех литров краски, которые понадобились бы для заливки баннера размером 3 на 6 метров. Всё равно их будут наблюдать только с большого расстояния.
Резюмируя:
● для веб проектов нам важен размер в пикселях, и желательно не забывать про 72 ppi
● для печатной продукции нужно знать размер в сантиметрах (или других физических единицах длины), а разрешение выставлять в зависимости от требований печати.
Вот такое оно, разрешение изображений. Надеюсь статья не слишком утомила и не запутала окончательно. Если остались вопросы, обязательно пиши в комментариях.
Ставь лайки, подписывайся на канал, и до новых встреч!