Роздільна здатність зображення менше 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». Тепер залишається перевантажити ноутбук та перевірити… Вийшло!

PS Один з користувачів, які обговорювали цей спосіб в ЖЖ запропонував просто... запам'ятати, при якому масштабі розміри листа відповідають реальним.

Як ви все чудово знаєте, консорціум 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 точок на сантиметр.