Osadzanie fontów i font stack – podstawy typografii w Internecie

Każde medium ma swoje ograniczenia. Zły efekt uzyskamy, dobierając papier niepowlekany do pisma z szeryfami włosowymi. Jeszcze gorzej będzie, jeśli nie załączymy fontów, wysyłając komuś pliki otwarte. Podobna sytuacja panuje w sieci – bez osadzenia niestandardowych fontów nie możemy liczyć na to, że wyświetlą się one na każdym komputerze. Należy też być ostrożnym, jeśli chcemy na ekranie stosować pisma, które zaprojektowano z myślą o druku, a nie o wyświetlaniu.

Wyjścia są dwa: stosowanie narzędzi pozwalających na osadzenie wybranych krojów na stronie, takich jak TypeKit, @font-face czy Cufon, albo budowanie poprawnych list (font stack). Kwestią problematyczną nadal pozostaje jednak dobór pisma. Użytkownicy sprzętu z wyświetlaczem retina i rozdzielczością 270dpi, będącymi nowością na rynku, stanowią mniejszość. Przy niższych rozdzielczościach wiele detali umyka. Strony takie jak Font Squirrel dostarczają wyboru niestandardowych krojów, które dobrze wyglądają na ekranie (często są to wersje popularnych fontów przystosowane do innej technologii). Decyzje podejmuje się tu podobnie jak przy druku na nierównej powierzchni: pismo nie może posiadać zbyt wielu cienkich linii, bo zginą rozpikselowane. Nie można też zapominać o warunkach udzielania licencji końcowemu użytkownikowi oprogramowania (ang. End User License Agreement) – innymi słowy sprawdzenie czy licencja zezwala na osadzenie fontu na stronie. Tego typu rozwiązanie ma pewną wadę – przy łączach o małej przepustowości strona może ładować się wolniej.

Rezygnacja z osadzania fontów i ograniczenie się do tzw. „bezpiecznych” pism, choć gwarantuje, że strona będzie wyświetlana poprawnie, narzuca pewne ograniczenia, a te mogą z kolei prowadzić do monotonii. Nudzie zapobiega budowanie font stacks, które odwołują się do standardowo instalowanych na komputerach fontów oraz proponują ich zastępniki. Nathan Ford definiuje je jako ustalone wedle priorytetów listy fontów zdefiniowane w arkuszu CSS za pomocą atrybutu font-family, które przeglądarka będzie analizować do momentu, aż znajdzie font zainstalowany w systemie użytkownika.

Od momentu powstania kaskadowych arkuszy stylów typografowie projektujący dla sieci zwracali uwagę na poprawne komponowanie font stacks. Smashing Magazine radzi, żeby w definicji umieszczać zarówno preferowany font, jak i font bezpieczny oraz ogólną nazwę typu, np. Baskerville, ‘Times New Roman’, Times, serif. Ważne jest, by pamiętać, że pisma preinstalowane na Windowsach oraz na systemach operacyjnych Apple’a są różne. Do tego dochodzi wojna o udostępnienie innym platformom standardowych dla użytkowników produktów Microsoftu od czasu Windowsa Visty fontów.

Podobieństwo poszczególnych fontów wymienionych w pojedynczej liście nie może się ograniczać do podobieństwa kształtu. Równie istotna jest skala: chociaż Arial mógłby się wydawać dobrym zamiennikiem Verdany, to jednak szerokość tych krojów jest różna, więc wyświetlony nimi tekst będzie zajmował różną ilość miejsca.

Wreszcie mamy tu do czynienia z bardzo szybko zmieniającą się technologią. Listy najpopularniejszych krojów systemowych sprzed roku mogą być już nieaktualne. Dlatego podstawą jest śledzenie zmian w tej dziedzinie.

Autor: Karina Graj