Why Font Formats Matter
When you embed a font on your website, the browser downloads a font file. That file comes in one of several formats, each with different compression, browser support, and licensing considerations.
The Main Formats
WOFF2 (Web Open Font Format 2)
- Best choice for modern websites
- ~30% smaller than WOFF thanks to Brotli compression
- Supported by all current browsers (Chrome, Firefox, Safari, Edge)
- Designed specifically for web use
WOFF (Web Open Font Format 1)
- Predecessor to WOFF2, still widely supported
- Good fallback for older browser environments
- Larger file size than WOFF2
TTF (TrueType Font)
- Original desktop format, usable on the web but not optimized
- Larger file sizes, no web-specific compression
- Some older
@font-faceimplementations reference TTF
OTF (OpenType Font)
- Successor to TTF with advanced typographic features
- Common in print and desktop design
- Can be converted to WOFF2 for web use
Which Format Should You Use?
For web deployment in 2026, the recommended stack is:
@font-face {
font-family: 'MyFont';
src: url('myfont.woff2') format('woff2'),
url('myfont.woff') format('woff');
}
WOFF2 as primary, WOFF as fallback. Skip TTF/OTF on the web unless you have a specific compatibility requirement.
Format Conversion and Licensing
Converting a font from OTF/TTF to WOFF2 is common practice, but check your license first:
- Open-source fonts (OFL) — conversion and subsetting are explicitly permitted
- Commercial licenses — some EULAs prohibit format conversion or require you to use the vendor's provided web font files
- Adobe Fonts — provides pre-converted WOFF files; converting yourself may violate terms
If your license restricts conversion, use the web font files provided by the vendor or their CDN.
Performance Impact
Font file size directly affects page load speed:
| Format | Typical Size (Regular weight) |
|---|---|
| WOFF2 | 15–40 KB |
| WOFF | 20–55 KB |
| TTF/OTF | 50–150 KB |
Using WOFF2 and subsetting (including only the characters you need) can reduce font payloads by 60–80%.
How FontScanner Detects Formats
During a scan, FontScanner identifies font files by their URL patterns and response headers — whether they come from Google Fonts CDN, Adobe Typekit, or are self-hosted .woff2 files. This helps you understand not just which fonts are used, but how they are delivered.
Conclusion
Choose WOFF2 for web fonts, verify your license permits the format you deploy, and subset aggressively for performance. The right format choice benefits both your users and your compliance posture.