March 24, 20263 min read

EOT to WOFF — Migrating Internet Explorer Fonts to Modern Web

EOT died with Internet Explorer. Here's why WOFF/WOFF2 replaced it and how to migrate your web fonts.

fonts eot woff woff2 web fonts internet explorer
Ad 336x280

If you have EOT font files in your project, you're carrying around a fossil. Embedded OpenType was Microsoft's proprietary web font format, created back when Internet Explorer was the dominant browser and web fonts were a novel idea.

IE is dead. EOT should be too.

A Brief History of EOT

Microsoft introduced EOT in the late 1990s. At the time, there was no standard way to use custom fonts on the web. EOT solved the problem — but only for Internet Explorer. No other browser ever adopted it.

For years, web developers had to serve multiple font formats to cover all browsers:

@font-face {
  font-family: 'MyFont';
  src: url('myfont.eot');                        / IE9 compat /
  src: url('myfont.eot?#iefix') format('eot'),   / IE6-8 /
       url('myfont.woff2') format('woff2'),       / Modern /
       url('myfont.woff') format('woff'),         / Older modern /
       url('myfont.ttf') format('truetype');       / Safari, Android /
}

That bullet-proof @font-face syntax was a rite of passage for frontend developers. It was also ridiculous.

What Replaced EOT

WOFF (Web Open Font Format) launched in 2010 with broad browser support. It's essentially a compressed wrapper around TrueType or OpenType font data. Every modern browser supports it. WOFF2 arrived in 2014 with even better compression (30-50% smaller than WOFF) using Brotli compression. Browser support is now universal — every browser released since 2016 handles it.

Today, you really only need WOFF2. Include WOFF as a fallback if you want to cover browsers from 2012-2015, but even that's increasingly unnecessary.

Why You Still Have EOT Files

Usually one of these reasons:

  • Legacy project that hasn't updated its font stack since 2015
  • Enterprise intranet that was built for IE and still carries those assets
  • Font package you downloaded years ago that included every format
  • Template or theme from the early 2010s
Whatever the reason, those EOT files are dead weight. They add to your build size and serve no users (IE's global usage share is effectively 0%).

Converting EOT to WOFF/WOFF2

The conversion extracts the font data from the EOT container and re-packages it as WOFF or WOFF2:

  1. Upload your EOT file
  2. Select WOFF2 as the output (or WOFF if you need broader legacy support)
  3. Download the converted font
  4. Update your CSS to reference the new file
After conversion, simplify your @font-face:
@font-face {
  font-family: 'MyFont';
  src: url('myfont.woff2') format('woff2');
  font-display: swap;
}

That's it. One line. No IE hacks, no format stacking, no query string tricks.

Don't Forget font-display

While you're updating your font declarations, add font-display: swap if you haven't already. This tells the browser to show fallback text immediately while the custom font loads, preventing the invisible text flash (FOIT) that makes pages feel broken.

Check Your Licensing

Some font licenses are format-specific. A license that covers EOT might not explicitly cover WOFF2. This is uncommon with modern licenses, but if you're using a commercially licensed font, double-check the terms before converting. Google Fonts and other open-source fonts have no such restrictions.

Ad 728x90