Jeśli hostujesz czcionki TTF na swojej stronie internetowej, wysyłasz około 30% więcej danych niż jest to konieczne. WOFF2 dostarcza tę samą czcionkę w znacznie mniejszym pliku, a każdy nowoczesny przeglądarka go obsługuje. Oto jak przekonwertować — i dlaczego to ma znaczenie dla wydajności Twojej strony.
Dlaczego WOFF2?
WOFF2 (Web Open Font Format 2.0) wykorzystuje kompresję Brotli, aby zmniejszyć rozmiar plików czcionek o około 30% w porównaniu z TTF, bez utraty jakości. Postacie liter, wskazówki, odstępy i wszystkie cechy typograficzne są zachowane identycznie. Gdy przeglądarka ładuje plik WOFF2, rozpakowuje go do tych samych danych co oryginalny TTF.
The performance impact is real. Fonts are render-blocking resources — the browser won't paint text until fonts finish loading. A 120KB TTF that becomes an 84KB WOFF2 means text appears faster, especially on mobile connections. Google's Core Web Vitals directly measure this: smaller fonts improve Largest Contentful Paint (LCP) and reduce Cumulative Layout Shift (CLS) from font swaps.
Wsparcie przeglądarkowe jest uniwersalne. Chrome, Firefox, Safari i Edge obsługują WOFF2. Jedynymi przeglądarkami, które tego nie obsługują, są Internet Explorer i bardzo stare przeglądarki na Androidzie — oba stanowią mniej niż 1% ruchu globalnego.
Jak przekonwertować
Używanie WOFF2 w CSS
Po otrzymaniu pliku WOFF2, odwołaj się do niego w arkuszu stylów. Wskaż WOFF2 jako pierwszy, a TTF jako zapasowy dla maksymalnej kompatybilności:
@font-face {
font-family: 'MyFont';
src: url('/fonts/myfont.woff2') format('woff2'),
url('/fonts/myfont.ttf') format('truetype');
font-display: swap;
}Dyrektywa font-display: swap informuje przeglądarkę, aby wyświetlić tekst zastępczy natychmiast i zamienić go na niestandardowy czcionkę po jej załadowaniu, eliminując niewidoczny tekst podczas ładowania czcionki.
Zgodność z licencją czcionki
Wiele licencji na komercyjne czcionki zawiera klauzule, które ograniczają przesyłanie plików czcionek do第三方 usług internetowych. Tworzy to problem: musisz przekonwertować na WOFF2 dla wydajności, ale większość narzędzi konwersji wymaga przesłania czcionki na serwer.
Oczywiście, zawsze sprawdź szczególne warunki licencji swojej czcionki. Ale lokalna natura konwersji w Morph usuwa najpowszechniejszy problem zgodności.
Inne konwersje czcionek
Morph obsługuje również konwersję OTF na WOFF2, WOFF na WOFF2, TTF na OTF oraz każdą inną kombinację TTF, OTF, WOFF i WOFF2. Potrzebujesz bezpłatnych czcionek, aby zacząć? Przeglądaj ponad 1 500 bezpłatnych czcionek w bibliotece czcionek Morph.