Převeď pixely na typografické body

Jeden pixel odpovídá 0,75 bodu, protože standard CSS stanoví, že do palce se vejde 96 pixelů a 72 bodů [1]. Odtud plyne dvojice, která se vrací v každém projektu: 16 px je přesně 12 pt a 24 px je 18 pt.

Tímhle směrem se převádí tehdy, když materiál vznikl na obrazovce a končí ve světě tisku. Sazečské programy, poštovní klienti, tabulkové procesory i formát PDF měří text a stránky v bodech, takže návrh popsaný v pixelech potřebuje překlad do jejich jednotky.

Převodník se hodí těm, kdo posílají do tiskárny soubor vzniklý na obrazovce, vývojářům, kteří čtou rozměry stránky z PDF, i návrhářům mobilních rozhraní, kde slovo bod znamená něco úplně jiného.

Níže najdeš tabulku velikostí textu, tabulku velkých hodnot, rozměry devíti formátů stránky v bodech PDF a porovnání bodů a pixelů na displejích Apple. Opačný směr obstará převodník bodů na pixely.

Vzorec je krátký: body = pixely × 72 ÷ 96, tedy násobení 0,75. Dvacet pixelů dá 15 pt, 40 px dá 30 pt a 96 px dá rovných 72 pt, tedy přesně jeden palec.

Výsledek vyjde kulatý pokaždé, když je počet pixelů dělitelný čtyřmi: 12 px je 9 pt, 16 px je 12 pt, 20 px je 15 pt, 24 px je 18 pt. U ostatních hodnot se objeví čtvrtiny bodu — 15 px dá 11,25 pt a 18 px dá 13,5 pt. Sazečské programy takové zlomky přijímají bez výhrad.

Násobitel 0,75 platí při hustotě 96 pixelů na palec, kterou standard CSS předpokládá pro obrazovku i pro tisk z prohlížeče [1]. Když připravuješ rastrovou grafiku v jiném rozlišení, fyzický rozměr spočítáš převodníkem px na mm s nastavitelným DPI. Bod zůstává navázaný na tuhle hustotu bez ohledu na nastavení čtenáře, zatímco rem jde za velikostí textu v prohlížeči: při základu 16 px je jeden pixel 0,0625rem, což spočítá převodník px na rem.

Formát PDF umisťuje každý prvek do uživatelského prostoru, jehož výchozí jednotkou je 1/72 palce, tedy přesně typografický bod. Položka UserUnit v popisu stránky může tuhle hodnotu změnit, a když chybí, platí 1/72 palce [2]. Počátek souřadnic leží v levém dolním rohu stránky a svislá osa roste nahoru.

Proto má list A4 v souboru PDF rozměry 595 × 842 pt, zatímco americký Letter 612 × 792 pt. Tyhle hodnoty uvidíš v knihovnách pro generování dokumentů, v protokolech nástrojů pro předtiskovou přípravu a v poli velikosti stránky v Acrobatu, jakmile přepneš jednotku na body.

Když skládáš fakturu nebo report z kódu a rozměry návrhu máš v pixelech, vynásob je 0,75 a máš hotové souřadnice stránky. Šířka 800 px dá 600 pt, tedy o pět bodů víc než 595 pt šířky formátu A4 — obsah se na stránku vejde až při návrhu o šířce 793 px.

Apple nazývá bodem základní jednotku rozvržení ve svých systémech, měří jí ale obrazovku, ne papír. Vlastnost scale ji popisuje doslova jako vztah mezi body, tedy logickým souřadnicovým prostorem, a pixely, tedy prostorem zařízení [3]. Hodnota 1,0 znamená, že bod se rovná pixelu, hodnota 2,0 ho rozloží na dva pixely a 3,0 na tři.

V praxi kreslí návrhář iPhone v mřížce 402 bodů na šířku, zatímco displej ukazuje 1 206 pixelů [4]. Bod v iOS se tedy převádí přes měřítko zařízení, kdežto násobitel 0,75 z téhle stránky obsluhuje typografický bod.

Android vyřešil totéž pod názvem dp, tedy pixel nezávislý na hustotě. Vztažným bodem je tam obrazovka s hustotou 160 dpi a vzorec zní px = dp × (dpi ÷ 160). Dokumentace ho uvádí výslovně a zároveň doporučuje sáhnout v kódu po TypedValue.applyDimension() místo natvrdo zapsaného výpočtu [5]. Dvanáct bodů tvoří piku, takže výsledek 240 pt lze uvést i jako 20 pik — převodník pixelů na piky vrací rovnou tuhle jednotku.