Subsetowanie fontów (font subsetter)

Jak utworzyć subset fontu

1. Sprawdź licencję. Subsetowanie tworzy zmodyfikowaną kopię fontu. Licencje otwarte, takie jak SIL Open Font License (OFL) i Apache 2.0, na to pozwalają; wiele komercyjnych licencji desktopowych i webowych – nie, albo tylko pod pewnymi warunkami. Najpierw przeczytaj licencję swojego fontu.
2. Upuść plik TTF, OTF lub WOFF w polu albo kliknij je, aby wybrać plik. Panel Oryginalny font pokazuje rodzinę, format, rozmiar pliku, liczbę glifów i liczbę znaków, które font obsługuje.
3. Wybierz Znaki do zachowania: zestawy Podstawowa łacinka, Latin-1, Łacinka jak w Google Fonts, Latin Extended-A/B, Francuski oraz Cyfry i znaki liczbowe można łączyć. Własne znaki dodasz w polu Znaki z tekstu (zachowany zostaje każdy odrębny znak tekstu) lub w polu Zakresy Unicode, zapisanych jak w CSS: U+0020-007E, U+2013, U+04??.
4. Zaznacz Usuń hinting, jeśli chcesz uzyskać jak najmniejszy plik.
5. Kliknij Utwórz subset. Za pierwszym razem wczytuje się silnik (około 650 KB), a potem font jest przetwarzany na twoim urządzeniu.
6. Porównaj rozmiary w sekcji Wynik, obejrzyj Podgląd subsetu, a następnie użyj przycisków Pobierz TTF (lub OTF) i Pobierz WOFF i skopiuj regułę CSS @font-face.

Plik fontu nigdy nie opuszcza twojego komputera: jest odczytywany, subsetowany i ponownie pakowany w przeglądarce.

Polskie znaki – ważne

Litery ą, ć, ę, ł, ń, ś, ź i ż należą do zakresu Latin Extended (Latin-1 ma tylko ó). Na tej stronie domyślnie zaznaczone są więc zestawy Łacinka jak w Google Fonts i Latin Extended-A/B (U+0100–024F), które razem odpowiadają podzbiorom „latin” i „latin-ext” z Google Fonts. Jeśli chcesz mniejszy plik, zamiast nich dodaj w polu Znaki z tekstu tylko litery ąćęłńóśźżĄĆĘŁŃÓŚŹŻ. Polskie cudzysłowy „ ” mieszczą się w zakresie interpunkcji U+2000–206F, który zawiera zestaw Łacinka jak w Google Fonts. Zawsze sprawdź wiersz Brak w foncie i podgląd na prawdziwym tekście.

Co robi subsetowanie

Font często zawiera setki lub tysiące glifów: cyrylicę, grekę, wietnamski, symbole, warianty. Strona po polsku czy angielsku używa tylko ich części. To narzędzie uruchamia hb-subset, subsetter silnika tekstu HarfBuzz (ten sam kod, którego używa Google Fonts i wiele narzędzi do budowania), skompilowany do WebAssembly. Zachowuje glify wybranych znaków oraz glify potrzebne funkcjom OpenType do ich wyświetlenia (ligatury jak „fi”, kapitaliki i formy akcentowane, jeśli są osiągalne z twoich znaków), a resztę usuwa. Kerning i inne tabele układu są odpowiednio przycinane.

Typowe wyniki: pełny font z łacinką, cyrylicą i greką o rozmiarze 300 KB może zmaleć do 20–30 KB dla tekstu francuskiego, a font logo ograniczony do liter jednego słowa waży często kilka kilobajtów.

Wiersz Brak w foncie wymienia znaki, o które prosisz, a których font nie ma. Przeglądarki narysują je fontem zastępczym.

Formaty wyjściowe i unicode-range

• TTF/OTF: subset zachowuje typ konturów oryginału (TrueType lub CFF).
• WOFF: ten sam font z każdą tabelą skompresowaną zlib. Odczytuje go każda aktualna przeglądarka. Plik WOFF na wejściu jest najpierw rozpakowywany.
• WOFF2 nie jest dostępny: jego kompresja Brotli i transformacje tabel nie mają kodera w przeglądarce, a plików WOFF2 nie da się tu też odczytać. Najpierw przekonwertuj WOFF2 na TTF (np. za pomocą fontTools). Twój serwer może też kompresować TTF/OTF w locie za pomocą gzip lub Brotli.

Reguła CSS @font-face wymienia najpierw plik WOFF, ustawia font-display: swap i dodaje unicode-range zbudowany ze znaków faktycznie obecnych w subsecie. Dzięki unicode-range przeglądarka pobiera plik tylko wtedy, gdy strona używa któregoś z tych znaków, więc możesz podzielić rodzinę na kilka plików (np. łacinka i cyrylica) i pozwolić każdemu odwiedzającemu wczytać tylko to, czego potrzebuje. Zmień Nazwa font-family, aby pasowała do nazwy w twoim arkuszu stylów.