Связь между пикселями, сантиметрами и DPI. Относительные пикселы или в чем задавать размер шрифта Разрешение 96 dpi

DPI – (точек на дюйм, dots per inch) - характеристика экранного разрешения, которая показывает сколько точек экрана соответствует логическому дюйму. Экранное разрешение устанавливается при помощи диалога "Display Properties" - "Settings" - "Advanced" - "General" - "DPI setting".

1С:Предприятие версии 8 учитывает экранное разрешение для масштабирования всех элементов управления и других интерфейсных объектов. Из-за погрешностей в масштабировании системных шрифтов ОС Windows необходимо учитывать некоторые особенности при разработке форм для разных экранных разрешений.

Разработка в нормальном разрешении

Обычное разрешение, установленное в ОС Windows по умолчанию, составляет 96 DPI (Normal Size). Разрешение 120 DPI (Large Size), обычно используется для увеличения изображения иконок и шрифтов. В этом разрешении буквы шрифта отображаются большим количеством точек и поэтому становятся крупнее и легче читаются.

Но при увеличенном разрешении на экран помещается примерно на 30% меньше информации, чем при нормальном.

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

На рисунке 1 показана форма, разработанная в разрешении 120 DPI. На рисунке 2 эта же форма показана в разрешении 96 DPI. Видно, что в разрешении 96 DPI надписи "Наименование" и "Указывать в дате документа месяц прописью" не уместились и заканчиваются троеточиями, а командная панель имеет настолько маленький размер по высоте, что в нее не умещаются стандартные кнопки.

Рисунок 1

Рисунок 2

Запас для других разрешений

Из-за погрешностей при масштабировании системных шрифтов рекомендуется делать поля чуть шире, чем это нужно, оставляя запас в несколько точек (2-4 точки вполне достаточно). Высоту элементов управления корректировать не требуется. На рисунках 3 и 4 показана форма, разработанная в 96 DPI и как она будет выглядеть в 120 DPI соответственно.

Можно заметить, что текст поля переключателя не полностью поместился в отведенный размер в разрешении 120 DPI. Чтобы этого не происходило, достаточно сделать это поле на две точки шире.


Рисунок 3


  1. I set my screen to 72 DPI and designed a small png image that is 100x100 @ 72 DPI. Which means 72 pixels represents 1 inch.
  2. Now I changed my screen to 120 DPI and designed the same graphic png image with 100x100 @ 120 DPI. Which means 120 pixels represents 1 inch.
  3. Again I changed my screen to 96 DPI. Which means 96 pixels represents 1 inch. Then Created a wpf application and added the two images (step 1 and step 2) - I have set the Stretch Mode to None

Не уверенный, если я понял понятие правильно, Я ожидал, что изображение на 72 точки на дюйм будет выглядеть меньшим на 96 точек на дюйм потому что, если 72 пикселя представляли 1 дюйм для того изображения, то в новой конфигурации 96 пикселей представляет 1 дюйм. И поэтому я ожидал, что изображение на 72 точки на дюйм будет выглядеть меньшим. Но не имеет место. Infact, это был просто он напротив. Изображение на 72 точки на дюйм выглядит больше 96 точек на дюйм. Почему? Похож на него, wpf будет всегда не выполнять своих обязательств к 96 точкам на дюйм когда дело доходит до изображений?

Update Why is that, even at 120 dpi (setting system dpi to 120), only 96 dpi image fits 200x200 box perfectly?

1

2 ответы

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

Независимый от устройств пиксель в wpf мире стоящий 1/96-го из дюйма независимо от параметров настройки экрана. Поэтому только эксперимент на 96 точек на дюйм правилен.

Во-вторых, ваши точки на дюйм уроженца мониторов оказывают влияние

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

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

Поэтому каждая точка по изображению на 72 точки на дюйм больше, чем каждая точка по 120 изображениям, таким образом, целое изображение на 72 точки на дюйм больше, чем изображение на 120 точек на дюйм.

Для дополнительных материалов для чтения вы хотели бы рассматривать Урегулирование точек на дюйм и разрешение применения WPF страница на веб-сайте Решений Mindfire.

Что такое 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. Визуально уменьшается экран и появляется много свободного места, но все элементы рабочего стола и шрифт остались прежними. Сами пиксели уменьшились, чтобы уместиться на той же площади экрана, при том же размере.

Глава первая. 96 точек на дюйм.

Мне тут недавно сообщили применительно к готовым цифровым изображениям, сделанным в Фотошопе, что «…вообще стандарт картинок для экрана - это 72 точки на дюйм и никак иначе! По-другому просто не делается…» и что «…это признанный стандарт, в котором работают все, кто связан с WEB’ом, а точнее, с экранной графикой».

Я был слегка озадачен, и подумал тогда - причём тут вообще разрешение картинки, если на экране монитора она всё равно отображается точка в точку (если, разумеется, не масштабировать её насильно). Какое ни укажи разрешение в Фотошопе, программами отображения оно игнорируется, и картинка будет отображаться только исходя из своих точечных размеров! Другое дело - в специальных программах вёрстки это разрешение учитывается, но мы-то говорим об экранной графике!

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

Для начала, я проверил современные ЖК-мониторы. Вооружившись линейкой, я произвёл вычисления, и оказалось, что величина их разрешения никак не 72 точки на дюйм, а очень даже 96 точек на дюйм! Самые распространённые сегодня 17-дюймовые ЖК мониторы ближе всех подошли к этой цифре - их разрешение 96,4 точки на дюйм. Ниже всех разрешение оказалось у 19-дюймового ЖК-монитора - 86,3 точки на дюйм, но и то эта цифра была ближе к 96, чем к 72!

Что касается ЭЛТ-мониторов, то в них, как известно, разрешение можно выставить любое из некоторого набора. Первый квадратный пиксель появился на VGA-мониторах (раньше они были вытянутые, и разрешение по ширине не совпадало с разрешением по высоте). На первых 14-дюймовых VGA-мониторах наиболее комфортное разрешение было 800х600 точек, что при фактической диагонали 13 дюймов давало около 77 точек на дюйм. Но эти мониторы ушли в далёкое прошлое, и уже на 15-дюймовых мониторах с фактической диагональю 14 дюймов стало стандартом де-факто 1024х768 точек, что давало уже 91,4 точки на дюйм. Для 17-дюймовых мониторов с фактической диагональю 16 дюймов самое удобное разрешение оказалось 1152х864, что даёт цифру 90 точек на дюйм. С более крупными диагоналями ситуация примерно такая же.

Таким образом, разрешения любых современных мониторов не имеют ничего общего с параметром 72 точки на дюйм, но их разрешение близко к 96 точкам на дюйм.

Для проверки разрешений мониторов можно воспользоваться вот этим калькулятором:
http://novikovmaxim.narod.ru/calc.htm

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

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

Тогда у меня возник следующий вопрос: может быть, величина разрешения важна во время создания изображения? Поэкспериментировав с Фотошопом, я выяснил, что от текущего разрешения зависит только пиксельный размер Фотошоповского шрифта, задаваемый в пунктах. Причём для веб-страницы, визуальное равенство одних и тех же размеров шрифтов на картинке и в тексте возможно только при установленном в Фотошопе разрешении 96 точек на дюйм. То есть, если веб-страница содержит текст размером 10 пунктов, то чтобы на той же странице Фотошоповский 10-пунктовый шрифт на картинке выглядел также, необходимо установить при создании этой картинки разрешение именно 96 точек на дюйм. Это логично - ведь все программы масштабируют текст, исходя из предполагаемого разрешения монитора 96 точек на дюйм, а значит и мы в Фотошопе должны исходить из того же значения.

Таким образом, разрешение в веб-графике важно только при её создании и только в том случае, если мы работаем со шрифтами. И разрешение это - 96 точек на дюйм!

Глава вторая. 72 точки на дюйм

Давайте разберёмся, откуда же взялись эти самые 72 точки на дюйм, за которые так ратуют некоторые дизайнеры, и почему именно эта цифра по умолчанию устанавливается Фотошопом для нового изображения? Объясняется всё довольно просто - историей. В полиграфии дюйм равен 72 пунктам, а фирма Эппл, ориентируя свои первые компьютеры Макинтош именно на полиграфию, взяла, да и приравняла размер точки экрана своего компьютера к полиграфическому пункту, чтобы текст на экране выглядел также, как на бумаге. В общем-то, это было логичное решение. В результате, разрешение первых Макинтошевских мониторов было именно 72 точки на дюйм.

Впоследствии, чтобы сэкономить на размерах Макинтошевских мониторов, разработчики решили увеличить их разрешение до разрешения мониторов PC (96 точек на дюйм). В результате, зрительные размеры шрифтов уменьшились (поэтому, например, при просмотре веб-страниц на Макинтоше, все шрифты, размер которых указан в пунктах, выглядят в 1,33 раза мельче, чем на PC, где размеры пункта изначально были в 1,33 раза больше размеров точки, а не равны ей). Фактически, у Макинтоша сложилась ситуация, когда наряду с фактическим (физическим) разрешением 96 точек на дюйм у него появилось «логическое» разрешение 72 точки на дюйм. То есть Макинтош как бы просит считать разрешение его монитора 72-точечным, а диагональ соответственно в 1,33 раза большей, чем на самом деле. Поэтому разрешение в 72 точки в Фотошопе актуально на Макинтоше и сейчас. Парадокс - разработчики Эппл с самого начала старались приблизить экран к бумаге, а в итоге получилось всё с точностью до наоборот.

Что касается Фотошопа, то он был изначально написан для Макинтошей, и лишь потом был переведён на PC, но значение 72 так и не посчитали нужным изменить на 96, хотя это было бы определённо разумным решением. Вот эта-то настройка по умолчанию и сбивает многих дизайнеров, считающих её истиной в последней инстанции под давлением авторитета Фотошопа. А последний всего лишь наивно предполагает, что запущен на Макинтоше…

Ну и напоследок, чтобы развеять все сомнения, давайте посмотрим наглядно зависимость размера Фотошоповского шрифта от установленного разрешения картинки:

Текстовый Arial, 10 пунктов, на Макентоше равен размеру шрифта первой строки, а на PC - второй строки следующего рисунка:

Замечу, что если вы смотрите этот текст через Internet Explorer 7 с включённой в нём по умолчанию опцией ClearType или через браузер Safari 3, то они несколько сглаживают шрифты, что заметно при сравнении шрифта строки примера со шрифтом строк на рисунке, Выполненном в Фотошопе. Для чистоты эксперимента советую посмотреть этот текст через браузеры Opera 9, Firefox 2 или Netscape Navigator 9, не вносящих искажения в шрифт. Если вы используете ЖК-монитор, и всё ещё видите разницу, то отключите в Windows функцию ClearType сглаживания экранных шрифтов (свойства экрана).

  1. Если вы создаёте веб-графику, то при разработке изображений используйте разрешение 96 точек на дюйм, чтобы лучше ориентироваться в размерах применяемых вами шрифтов - ведь большинство ваших клиентов видят ваши сайты через PC.
  2. Если вы создаёте графику для полиграфии, то используйте то разрешение, которое требует от вас технолог типографии (для разного оборудования и разных целей это будут разные разрешения).
  3. Если вы создаёте веб-графику, ориентируясь исключительно на пользователей Макинтошей, то используйте разрешение 72 точки на дюйм, чтобы лучше ориентироваться в размерах применяемых вами шрифтов.