Как пользоваться
- 1
Вставьте публичный URL страницы.
- 2
WebDiag проверит inline CSS и до 12 external stylesheets на @font-face.
- 3
Проверьте font-display, families, sources, WOFF2 signals, matched preloads, bytes и cache headers.
Что умеет инструмент
- Разбор family, style, weight, font-display, local() и URL sources.
- Сопоставление link rel=preload as=font с найденными @font-face URL.
- Проверка font MIME, Content-Length, cache policy, redirects и public-target safety.
Когда пригодится
- Найти @font-face без явного font-display.
- Найти preload URL, которые не совпадают с static CSS sources.
- Проверить количество families/weights и known declared font bytes.
Что происходит внутри
CSS parser bounded и не выполняет JavaScript-generated stylesheets или runtime CSSOM.
Не все fonts нужно preload: инструмент проверяет согласованность существующих preload, а не требует preload для каждого файла.
Вопросы и ответы
Какое значение font-display лучше?
Универсального ответа нет. Инструмент показывает отсутствие или block, но выбор swap, optional, fallback или другого поведения зависит от продукта и метрик.
Почему отсутствие preload не считается ошибкой?
Preload полезен только для ограниченного числа критичных fonts. Массовый preload может конкурировать с другими ресурсами.