Rozmiar czcionki w rzeczywistości – typografia, punkty, piksele i CSS

Rozmiar czcionki w rzeczywistości często zaskakuje: 12pt w programie Word to nie to samo co 12px na stronie internetowej, a oba te wymiary różnią się od milimetrów zmierzonych linijką na wydruku. To nie błąd programów – to wynik historycznie utrwalonego systemu jednostek typograficznych, który łączy tradycję drukarską z realiami ekranów cyfrowych. Wyjaśniamy, jak to wszystko ze sobą współgra i jak świadomie dobierać rozmiar czcionki do każdego kontekstu.

Co oznacza rozmiar czcionki w typografii?

Rozmiar czcionki podawany jest w punktach typograficznych (pt). Jeden punkt DTP to 1/72 cala, co odpowiada dokładnie 0,353 mm. Zatem 12pt = 4,23 mm, a 10pt = 3,53 mm. Ale uwaga: punkt nie opisuje wysokości litery, lecz całkowity rozmiar „oczka” – obszaru, w którym litera jest rysowana. Obszar ten obejmuje wznos (ascender), linie środkową, zniżnik (descender) oraz górny i dolny margines zwane leadem.

Faktyczna wysokość dużej litery (wersalik) w foncie 12pt wynosi zazwyczaj 6–8 mm – zależy od projektu kroju. To dlatego dwie czcionki tego samego rozmiaru mogą wyglądać zupełnie inaczej: jedna wydaje się wizualnie duża, inna małą. Wysoki x-height (stosunek wysokości małych liter do wersalików) sprawia, że czcionka wygląda na większą przy tym samym rozmiarze punktowym.

Jaki jest rzeczywisty rozmiar czcionki – pt, px, mm?

Przeliczenie między jednostkami zależy od rozdzielczości ekranu (DPI). Standardem webowym jest 96 DPI. Przy 96 DPI: 1pt = 1,333px, więc 12pt = 16px. Przy rozdzielczości wydruku 300 DPI: 12pt = ok. 50px. W milimetrach: 12pt = 4,23 mm niezależnie od DPI – bo milimetry to miara fizyczna, nie ekranowa.

Tabela przeliczeniowa dla najczęstszych rozmiarów: 10pt = 13,3px = 3,53 mm; 11pt = 14,7px = 3,88 mm; 12pt = 16px = 4,23 mm; 14pt = 18,7px = 4,94 mm; 16pt = 21,3px = 5,64 mm; 18pt = 24px = 6,35 mm. Przy projektowaniu do druku zawsze używaj pt lub mm. Przy tworzeniu stron internetowych – px lub em.

Rozmiar czcionki na ekranie a w druku – dlaczego wygląda inaczej?

Ten sam dokument Word wydrukowany na papierze wygląda inaczej niż na ekranie – nawet przy identycznym ustawieniu 100% widoku. Ekran wyświetla obraz w pikselach, wydruk utrwala go w atramencie lub tonerze z rozdzielczością 300–1200 DPI. Przeglądarka Word domyślnie zakłada wyświetlanie przy 96 DPI, a przy druku przełącza się na DPI drukarki. Efekt: 12pt wygląda na monitorze Full HD nieco większy niż na wydruku A4 trzymanym w ręku.

Czy papier ma wpływ na czytelność fontu? Tak. Na papierze matowym toner wchłania się głębiej, litery wyglądają nieco szerszej i wyrazistej. Na papierze kredowym toner pozostaje na powierzchni – litery są ostrzejsze, ale cienkie szeryfy mogą wyglądać krucho. Przy małych rozmiarach (8–9pt) drukuj próbnie przed finalnym nakładem.

Jednostki rozmiaru czcionki w CSS

W CSS dostępnych jest kilka jednostek typograficznych. px – piksel, absolutna jednostka ekranowa; najprostsza, ale nieresponsywna. pt – punkt, fizyczna jednostka druku; używana przy stylach dla @media print. em – relatywna do rozmiaru czcionki rodzica; np. 1.5em to 1,5× rozmiar rodzica. rem – relatywna do elementu html; ułatwia spójną skalę typograficzną w całym projekcie. vw/vh – viewport width/height; używana do dynamicznych nagłówków skalujących się do szerokości okna.

Dobra praktyka w CSS: ustaw html { font-size: 16px; } jako bazę, a następnie używaj rem dla wszystkich rozmiarów typografii. To zapewnia spójną skalę i łatwe skalowanie przy zmianie jednej wartości bazowej.

Złote zasady dotyczące rozmiaru czcionki

Tekst bieżący (body text): 10–12pt w druku, 15–18px na ekranie. Nagłówek H1: 24–36pt lub 28–42px. Nagłówek H2: 18–24pt lub 22–30px. Podpisy i noty drobne: 8–9pt lub 12–14px. Interlinia dla tekstu bieżącego: 120–145% rozmiaru czcionki (np. przy 12pt → interlinia 14,4–17,4pt).

Ważna zasada: tekst bieżący powinien być możliwie najmniejszy, a jednocześnie wygodny do czytania bez wysiłku. W praktyce oznacza to 11–12pt dla druku i 16–18px dla stron internetowych. Zbyt mały tekst męczy wzrok; zbyt duży wygląda amatorsko i zajmuje niepotrzebnie miejsce. Więcej o wyborze rozmiaru dla drukowanych książek: jaki rozmiar czcionki w książce.

Domyślny rozmiar czcionki w popularnych programach

Microsoft Word: Calibri 11pt. Google Docs: Arial 11pt. Strony WWW (CSS): 16px (= 12pt). LibreOffice Writer: Liberation Serif 12pt. LaTeX (klasa article): Computer Modern 10pt. Adobe InDesign: brak domyślnej – użytkownik ustawia zgodnie z projektem.

Zmiana domyślnej czcionki w Wordzie: Narzędzia główne → kliknij strzałkę przy sekcji Czcionka → otwórz okno Czcionka → ustaw żądany krój i rozmiar → kliknij „Ustaw jako domyślną” → zastosuj dla wszystkich dokumentów opartych na szablonie Normal.

Pytania i odpowiedzi

Czy rozmiar tekstu w Wordzie jest dokładnie taki jak na wydruku?

Nie – ale jest bardzo zbliżony. Word przy 100% widoku i standardowym monitorze 96 DPI wyświetla tekst nieznacznie większy niż na wydruku A4. Aby zobaczyć dokładny podgląd wydruku, użyj opcji Widok → Układ wydruku i sprawdź wymiary na linijce. Ostateczną weryfikację daje zawsze próbny wydruk na docelowej drukarce.

Dlaczego mały tekst nie może być w Rich Black?

Rich Black (mieszanka CMYK: C:60 M:40 Y:40 K:100) jest używany do dużych powierzchni czarnego tła. W małych rozmiarach tekstu prowadzi do efektu „rozmazania” (misregistration) – każdy kanał koloru jest drukowany osobno i przy drobnych literach odchyłki rejestracyjne sprawiają, że krawędzie liter stają się nieostre. Do tekstu używaj zawsze czystej czerni K:100.

Źródło grafiki: Pexels