Skip to main content
Performance fix guide

Web Fonts Missing font-display: swap

Web fonts do not use font-display: swap, causing invisible text (FOIT) while fonts load. Users may see a blank page until fonts are ready.

Issue ID: CWV-FONT-DISPLAY-001
Severity: minor
Impact: Low
Effort: S

Use this article when

  • You need deeper remediation guidance than the issue card can show.
  • You want CMS-specific steps before handing the fix to a developer.
  • You want a repeatable re-check path after shipping the change.
Re-run full audit

What this issue is

Web fonts do not use font-display: swap, causing invisible text (FOIT) while fonts load. Users may see a blank page until fonts are ready.

Why it matters

Web fonts do not use font-display: swap, causing invisible text (FOIT) while fonts load. Users may see a blank page until fonts are ready. This affects load speed, Core Web Vitals, and how many visitors stay long enough to convert.

How we detect it

  • FreeSiteAudit flags this issue when the rule for CWV-FONT-DISPLAY-001 fails and the page evidence points to Performance tool.
  • You can usually confirm this by checking the page source or the relevant page settings inside your CMS.

Evidence examples

Check the affected page source, rendered output, or relevant CMS setting to confirm the missing or incorrect element.

How to fix it

  1. 1Add font-display: swap to @font-face declarations
  2. 2If using Google Fonts, add &display=swap to the URL

How to re-check it

  • Confirm all @font-face rules include font-display: swap

Related tools

This issue is best verified with the full FreeSiteAudit crawl rather than a single-point mini tool.