Wiele wyszukiwarek ustala ranking stron na podstawie ich dostosowania do komórek. Czcionki mniejsze niż 12 pikseli są często trudne do odczytania na urządzeniach mobilnych i mogą wymagać powiększenia tekstu w takim rozmiarze.
Co się dzieje, gdy kontrola rozmiaru czcionki w Lighthouse kończy się niepowodzeniem
Lighthouse oznacza strony z czcionkami, które są zbyt małe i nie można ich łatwo przeczytać na urządzeniach mobilnych:
Lighthouse zgłasza strony, na których co najmniej 40% tekstu ma czcionkę mniejszą niż 12 pikseli. Jeśli strona nie przejdzie kontroli, Lighthouse wyświetla wyniki w tabeli z 4 kolumnami:
| Źródło | Lokalizacja źródłowa zestawu reguł CSS, który powoduje nieczytelny tekst. |
| Selektor | Selektor zestawu reguł. |
| % tekstu strony | Odsetek tekstu na stronie, na który ma wpływ zestaw reguł. |
| Rozmiar czcionki | Obliczony rozmiar tekstu. |
Rozwiązanie problemu z nieczytelnymi czcionkami
Sprawdź rozmiary czcionek w kodzie CSS. Postaraj się, aby czcionka miała co najmniej 12 pikseli na co najmniej 60% tekstu na stronie.
Rozwiązanie problemu z brakującą konfiguracją widocznego obszaru
Jeśli Lighthouse zgłasza Text is illegible because of a missing viewport config, dodaj tag <meta name="viewport" content="width=device-width, initial-scale=1"> do <head> dokumentu.
Więcej informacji znajdziesz w poście Nie ma tagu <meta name="viewport"> z wartością width lub initial-scale.
Zasoby
Kod źródłowy kontroli Dokument nie używa czytelnych rozmiarów czcionek