Разрешение изображения менее 96 точек на дюйм. Относительные пикселы или в чем задавать размер шрифта. Отказ от DPI виртуализации для отдельных приложений

Что такое DPI? Не все знают ответ на этот вопрос. И данная статья поможет.

DPI (Dots Per Inch) - количество точек на дюйм. Оно применяется для определения разрешающей способности экрана. Но некоторые путают DPI монитора с PPI (Pixels Per Inch). Последнее обозначает количество пикселей на дюйм.

Для примера: для квадрата в один дюйм необходимо вывести на с разрешающей способностью 96 dpi картинку, где каждая сторона будет содержать 96 пикселей; для печати на бумаге необходимы 600 пикселей на сторону, когда разрешение DPI 600.

Для сравнения: говорят о большом разрешении фотографий (например 3000х1500, где ширина изображения в пикселях 3000, а высота - 1500). Извлечь из этого можно то, что картинка достаточно большая при просмотре на экране. А что будет, если вывести ее на печать? Для этого и существует термин DPI, который определяет количество точек, которые нанесет принтер на дюйм бумаги.

Историческая ремарка: DPI монитора

Старенькие VGA мониторы начала 80-ых имели разрешение DPI от 70 до 74, когда аналогичные продукты Apple (мониторы Macintosh) имели разрешающую способность в 72 DPI, в которых один пиксель соответствовал реальному типографическому показателю в 1/72 дюйма.

Исследования показали, что расстояние человеческого глаза до экрана монитора в три раза больше, чем расстояние до бумажного носителя (газета, книга), тем самым изображение на мониторе заметно меньше. Для комфортной работы и соответствия действительным размерам изображения было принято решение программно устанавливать разрешающую способность в 96 DPI. Но в действительности мониторов была 70 - 74 DPI.

Только позже компания IBM выпустила монитор с разрешением 96 DPI. Сразу после этого была сделана программная поддержка в 120 DPI. Это свело на нет привязку к действительному типографическому показателю в 72 DPI.

Что такое DPI: изменение разрешающей способности монитора

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

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

Есть несколько рекомендаций для разработчиков и любителей кастомного ПО. Лучше создавать программы или презентации по шаблонам, что исключит несоответствие показателей DPI. Любой такой интерфейс будет правильно отображаться на любых мониторах с различной разрешающей способностью. При использовании стоит подготовить два рисунка с различным показателем DPI (96 и 120). И при разном разрешении монитора картинка будет выбираться соответствующая.

Что такое DPI: вывод

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

Для полноты картины еще раз объясним, что такое DPI на простом примере. Физические размеры монитора остаются неизменными при любом раскладе, а при изменении разрешения с 1024х768 на 1280х1024 меняется и DPI. Визуально уменьшается экран и появляется много свободного места, но все элементы рабочего стола и шрифт остались прежними. Сами пиксели уменьшились, чтобы уместиться на той же площади экрана, при том же размере.

16.12.2009

Для начала предлагаю вам провести небольшой эксперимент. Создайте или откройте в любой программе документ с размерами страницы по умолчанию. Обычно он будет формата А4 - 210297 мм. Теперь убедитесь, что масштаб отображения равен 100%, что ориентация портретная и что вид соответствует будущей распечатке (для OpenOffice это «ВидРазметка печати»). Сделали?

Для начала предлагаю вам провести небольшой эксперимент. Создайте или откройте в любой программе документ с размерами страницы по умолчанию. Обычно он будет формата А4 - 210×297 мм. Теперь убедитесь, что масштаб отображения равен 100%, что ориентация портретная и что вид соответствует будущей распечатке (для OpenOffice это «Вид Разметка печати»). Сделали? Затем возьмите лист формата А4 и попробуйте совместить его контур с экранным. С вероятностью 99,9% их размеры не совпадут, причем разница окажется отнюдь не 0,01%, а гораздо более существенной.

Получившееся расхождение обусловлено моделью пользовательского интерфейса, реализованной создателями операционных систем и приложений. Ведь для того чтобы отобразить что-либо на экране, сохранив натуральную величину документа, нужно учитывать не только размеры дисплея, но и его разрешение - сколько пикселов помещается на единице длины по вертикали и по горизонтали. Думали-думали разработчики, потом, видать, послали младшего лаборанта (а может, самого Билла Гейтса - молодого и энергичного) определить размеры типичного экрана. Вернулся он с цифрами. Разделили длину на количество пикселов и получили 96 точек на дюйм (дело-то в Америке было, где дюймы в ходу, а 1 дюйм = 25,4 мм). И кто-то сказал, что это хорошо. И назвал магическое число «логическим разрешением».

А теперь внимание! Правильный ответ (цитирую документ с сайта Microsoft из раздела для разработчиков - http://msdn.microsoft.com/ru-ru/library/aa970067.aspx): «По умолчанию параметр точек на дюйм равен 96. Это означает, что 96 точек занимают ширину или высоту одного воображаемого дюйма. Точный размер «дюйма» зависит от размера и физического разрешения монитора. Например, если монитор имеет ширину 12 дюймов и горизонтальное разрешение 1280 точек, то горизонтальная линия в 96 точек расширяется до длины около 9/10 дюйма». Ключевое слово здесь - «воображаемый». Следовательно, наш дюйм получается эластичный - тянется или сжимается в зависимости от физических размеров и разрешения конкретного монитора.

Надо заметить, что значение 96 тнд долгие годы заметно превышало реальные возможности мониторов. Типичное физическое разрешение большинства моделей составляло 72 тнд (оно и до сих пор остается логическим разрешением в Mac OS), за ним даже закрепилось словосочетание «экранное разрешение». Именно оно задано для экранных шрифтов, а также для стандартных картинок с низким разрешением, отображаемых в программах верстки вместо «прилинкованных хайрезов». С такой же дискретностью делают и графику для Сети.

Кроме того, даже после установки драйверов из комплекта поставки монитора компьютер не мог точно узнать реальные размеры области изображения, ведь на ЭЛТ-мониторах она настраиваемая и обычно не растягивается на весь экран без полей, поскольку именно на краях дисплея искажения геометрии и сведения получались максимальными. Видеть такое никому не хотелось - лучше уж оставлять небольшие черные поля. Значит, если верстальщик или дизайнер желал вывести на экран изображение именно того размера, какого оно позже будет напечатано, такой простой вариант, как задать 100%, не подходил. Увы, не годится он и сейчас.

Между тем после появления ЖК-мониторов у рассматриваемой нами задачи стало возможно простое решение. Поскольку плоскопанельные экраны обладают врожденной идеальной геометрией, их пикселы выровнены раз и навсегда. Физическое разрешение, при котором картинка оптимальна (именно его следует выбирать тем, кто занимается версткой или дизайном), только одно. Его значение, а также размеры области отображения с высокой точностью известны компьютеру. Но тогда почему же «Масштаб 100%» все еще не работает так, как должен? Видимо, потому, что никто над этим пока специально не задумался.

Полагаю, надо было бы где-то среди параметров добавить маленькую кнопку «Привести масштаб экрана в соответствие с масштабом печати». Да, длинное получилось название. А может, - «Уравнять размеры на экране и при печати»? Так, пожалуй, звучит уже получше.

И что же именно эта кнопка должна делать? Ответ прост: всего лишь пересчитывать отношение между логическим (96 тнд) и физическим разрешением экрана, а затем задавать соответствующий коэффициент масштабирования для пользовательского интерфейса.

Такова теория. Но критерий истины - практика! Поэтому, взяв в руки линейку, я измерил ширину экрана своего ноутбука. Получилось 284 мм, или 11,18 дюйма, - почти как в примере у Microsoft. Горизонтальное разрешение - 1280 точек. В точках на дюйм это будет 114,5. Следовательно, мне нужно заменить имеющийся масштаб отображения на 119,27% (т.е. 114,5 умножить на 100 и разделить на 96). В ноутбуке установлена ОС Vista. Выбираю «Панель управления Персонализация Изменить размер шрифта» (на самом деле изменятся величины всех элементов пользовательского интерфейса и поддерживающих это приложений). Щелкаю на «Особый масштаб» и задаю «119%» (увы, дробного масштаба ввести нельзя). Возвращаюсь - появилась новая строка «114 dpi». Теперь остается перегрузить ноутбук и проверить… Получилось!

P. S. Один из пользователей, обсуждавших этот способ в ЖЖ предложил просто... запомнить, при каком масштабе размеры листа соответствуют реальным.

Как вы все прекрасно знаете, консорциум W3C в стандарте CSS 2.1 дает нам для задания размеров, в частности шрифтов, абсолютные и относительные единицы измерения.

К абсолютным причислены:

• in — inches , дюймы. 1 дюйм = 2.54 сантиметра
• cm — сантиметры
• mm — миллиметры
• pt — points , пункты. 1 пункт = 1/72 дюйма. То что находится в выпадающем списке Ворда при выборе размера шрифта и есть пункты
• pc — picas , пики. 1 пика = 12 пунктам

К относительным:

• em — font-size , высота соответствующего шрифта (). Так же встречалось определение em — как ширины символа m .
• ex — x-height , высота символа x соответствующего шрифта
• px — пикселы

Вы заметили?
Пикселы — относительные еденицы измерения!
Как, а вы не знали? :)

Мануал CSS 2.1 поясняет:

Пикселы относительны к разрешению устройства просмотра, т.е. чаще всего — дисплея компьютера. Если плотность пикселов выводного устройства сильно отличается от плотности типичного компьютерного дисплея, ПА должен перемасштабировать пикселные значения. Рекомендуется, чтобы пиксел в качестве точки отсчёта был визуальным углом одного пиксела на устройстве с плотностью пикселов 90dpi на расстоянии вытянутой руки от читателя.

Это теория.

А теперь немного практики.

Открываем наш любимый Windows на Панели управления. В свойствах «Экрана» заглядываем на закладку Настройка -> Дополнительно -> Общие:

96 точек на дюйм (dots per inch). Это — типичная плотность (dpi) для мониторов с разрешением 1024×768 и около того.
Для чего же нам этот параметр? 96 dpi означает, что на один дюйм вашего монитора приходится 96 пикселов. Нет, не нужно тянуться к линейке, реальная величина зависит от монитора, можете верить на слово. Этот параметр необходим для пересчета физических размеров матрицы монитора (дюймы, сантиметры, миллиметры) в пикселы и обратно.

А теперь о том, с чего начался этот пост.

Измените разрешение с 96 dpi (Мелкий шрифт) на 120 dpi (Крупный шрифт) и посмотрите во что превратится ваш любимый интернет. И это не говоря уже о программах, написанных под разрешение 96 dpi.
Вся проблема в том, что размеры фиксированных элементов, таких как например картинки, размеры окон и областей, заданы в пикселах , а размеры шрифтов, как правило, в пунктах .

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

Учитывая широкое распространение мониторов с диагональю более 17″, все чаще пользователи вместо того чтобы увеличивать размер шрифта по умолчанию, увеличивают плотность, отказываясь от стандартной в 96 dpi.

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

Например, при стандартной плотности 96 dpi , шрифт 14 pt имеет высоту:

H = 14*96/72 = 18.666 px ~ 19 px

А при плотности 120 dpi , шрифт 14 pt имеет уже высоту:

H = 14*120/72 = 23.333 px ~ 23 px

Пересчет из пунктов (pt) в пикселы (px) делается из соотношения 1 pt = 1/72 дюйма:

Вот такие вот относительные пикселы:)

P.S. Пока ребята из W3C теоретизируют, давно уже надо было передавать в cgi запросе, наряду с User agent, такие параметры как разрешение экрана, размеры отображаемой области браузера, dpi и глубину цвета. А на стороне сервера просто выбирать нужный шаблон. Ведь не в 20-м веке живем.

Актуальность: 2016

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

Приведем простой пример задачи. Вам нужно сделать фотографию на документы. Можно пойти двумя путями - сходить в фотоателье и сфотографироваться там, отдав за 4 маленьких фотографии, напечатанных на листе 10*15 см рублей 150. Второй вариант - сфотографироваться дома, подготовить к печати лист А4, на который втиснуть столько своих фотографий разных размеров, что хватит на несколько лет вперед. Потом идете в фотоателье и печатаете свое творение на листе А4 рублей за 30. Вроде бы с одного заказа выгода смехотворная, но если нужно распечатать фотографии сразу для нескольких человек (например, когда вся семья фотографируется на визу перед путешествием в другую странц), то можно сэкономить более существенную сумму. И это лишь один из примеров. Другой вопрос - как соблюсти размеры фотографий, чтобы на отпечатке они были ровно 4*5 см (или каким-то другим размером). Для того, чтобы подогнать размер отпечатка к требуемому, нужно разобраться в связи сантиметров , пикселей и точек на дюйм .

Пиксели

Пиксель - это одна точка, из которых состоит изображение. Также пикселем называется ячейка изображения на мониторе или жк-телевизоре. Рассмотрите монитор вблизи и вы увидите едва заметную сеточку, одна ячейка этой сетки - и есть пиксель. Фотография, которую вы скачали с фотоаппарата имеет разрешение несколько мегапикселей, то есть, например, 6000 пикселей в ширину и 4000 пикселей в высоту - это 6.000 * 4.000 = 24.000.000 пикселей или 24 мегапикселя. При просмотре на мониторе картинка автоматически масштабируется до разрешения монитора (около 2 мегапикселей). Если мы пытаемся увеличить масштаб (растягиваем фотографию), то до какой-то степени картинка растягивается без видимой потери качества, но потом на ней появляются характерные квадратики. Это происходит, когда реальное разрешение фотографии меньше того, что мы хотим видеть - размер пикселя на фотографии стал больше размера пикселя на мониторе.

Сантиметры

Что такое "сантиметр", я думаю, объяснять не нужно. В нашем случае в сантиметрах измеряется размер отпечатков фотографии. Обычно фотографии печатаются размером 10*15 см, но иногда используются более крупные форматы - 20*30 см (примерно соответствует формату А4), 30*45 см (А3) и больше. Вероятно, вы сталкивались с проблемой - вы нашли на каком-то сайте красивую фотографию и решили ее распечатать ее крупным форматом (например, 20*30 см), но распечатав, заметили, что качество отпечатка не слишком хорошее - конткры объектов получились немного размытыми. Что самое печальное - никакой обработкой эту фотографию не исправить. И все потому, что разрешение фотографии на сайте составляет, к примеру, 900*600 пикселей. То есть, на 1 пиксель на отпечатке будет иметь размер примерно 0.33 миллиметра - при этом сложно рассчитывать на "звенящую" резкость! И здесь появляется еще один параметр качества изображения, при помощи которого можно оценить качество отпечатка - DPI

DPI

DPI сокращение английской фразы Dots per Inch, что на русский переводится как точки на дюйм. Эта величина как раз показывает, сколько пикселей изображения приходится на один "погонный" дюйм при печати (дюйм равен 2.54 см). Еще есть величина DPC (точек на сантиметр), но она используется реже - как ни крути, все эти технологии печати пришли к нам оттуда, где в ходу дюймы, футы, фунты и т.д. Итак, вернемся к нашему примеру - картинке 900*600 пикселей, которую мы решили напечатать форматом 30*20 см. Переведем для удобства сантиметры в дюймы - получаем 11.8 * 8.9". Если поделить 900 пикселей на 11.8", то получаем разрешение печати 76 DPI . Это примерно соответствует разрешающей способности монитора с его "крупными" пикселями, поэтому картинка на экране смотрится хорошо. Но чтобы получить отпечаток приемлемого качества, нужно разрешение печати как минимум 150 DPI, а если хотим совсем хорошую детализацию, не менее 300 DPI. Чтобы обеспечить такое разрешение при печати 30*20 сантиметров, оригинальное цифровое изображение должно иметь разрешение 3540 * 2670 пикселей - это около 9 мегапикселей. Вот и нашли причину, почему фотографии, распечатанные "из интернета" выглядят нерезко и мутно. Теперь вернемся к нашему вопросу - как подогнать разрешение картинки, чтобы оно печаталось заданным размером? В качестве примера рассмотрим подготовку фотографий для документов.

Создание собственного фото на документы - пошаговая инструкция

Предположим, вам нужно сделать несколько фотографий размером 4*6 см и разместить их на листе 20*30 см. Как это сделать?

1. Берем исходное изображение, открываем его в Photoshop. Выбираем пункт меню "изображение" - "размер изображения". Перед нами открывается такое диалоговое окно:

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

Меняя настройки размера печатного оттиска, мы видим, что размеры в пикселях тоже изменяются. Так и должно быть! После всего этого нажимаем кнопку ОК. Изображение меняется в размерах. Теперь нам нужно скопировать его - используем комбинацию клавиш:

1. Ctrl + A (англ) - выделить все
2. Ctrl + C (англ) - скопировать в буфер обмена

То, что скопировано в буфер обмена мы будем переносить на отдельный холст, см п.2. 2. Теперь нам надо создать новое изображение, которое будет соответствовать листу 20*30 см, который мы пойдем распечатывать в фотолабораторию. Выбираем меню "Файл", "Создать", появляется диалоговое окно:

Указываем размер фотобумаги, на которой будет выполняться печать (20 на 30 см) и выставляем разрешение в пикселях на дюйм такое же, какое имеет наша фотография - 300 DPI. Нажимаем ОК.

3. Появилось пустое изображение с прозрачным фоном. Нажимаем комбинацию клавиш Ctrl + V и вставляем наше первое изображение на новый холст. Это будет выглядеть примерно так:

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

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

Сохраняем картинку в формате JPEG, копируем на флешку и идем в фотолабораторию. Оператору говорим следующее - "напечатайте это изображение форматом 20*30 см с разрешением 300 DPI без масштабирования ". При этом маленькие картинки будут иметь точно такой размер, какой мы для них указали - в нашем случае 4*6 сантиметров. При себе желательно иметь линейку, чтобы проверить размеры отпечатков.

Что такое пиксели и что такое DPI? September 20th, 2012

Вас пугают слова "пиксели" и "DPI" или вы не до конца понимаете их значение? Тогда несколько строчек ниже - для вас.

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

DPI это сокращение от английского "d ots p er i nch" и переводится как "точек на дюйм".

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

Что значить 72 DPI или 300 DPI и в чем разница?

72 DPI (или 96) - файлы для интернет, где одна точка на экране вашего монитора соответствует одному пикселю изображения. Еще называют - экранное разрешение изображения. Больше чем 72 DPI делать картинку для Интернет - нет смысла, так как монитор все равно больше не отобразит.

72 точки на дюйм = 28 точкам на сантиметр.

300 DPI необходимо для качественной печати в типографии. Количество точек на дюйм значительно увеличено, чтобы повысить качество изображения. Но для каждого типа печати это значение может меняться. В целом, если печатный продукт рассматривается человеком на близком расстоянии, то количество точек на дюйм должно быть высоким. Это журналы, буклеты, листовки. Для макета, который будут рассматривать на расстоянии требования ниже. К примеру, для билборда это значение может быть 56 dpi и ниже.
300 точек на дюйм = 118 точкам на сантиметр.