Serving web fonts from IIS — Skip to main content

Serving web fonts from IIS

I've just started playing with web fonts for a site redesign. I came across the following gotcha (thanks, Firebug, for alerting me to it!).

If you are running IIS 6 or higher on your web server, some of the fonts will be disabled by default.

Your typical @font-face declaration might look like this:

@font-face { font-family: 'VegurRegular'; src: url('Vegur-R_0500.eot'); src: local('Vegur'), local('Vegur-Regular'), url('Vegur-R_0500.woff') format('woff'), url('Vegur-R_0500.ttf') format('truetype'), url('Vegur-R_0500.svg#Vegur-Regular') format('svg'); }

This will deliver one of four different font formats, depending on your browser's capabilities. (The font is Vegur, a really nice-looking free font I found over at Font Squirrel).

By default, the MIME types in IIS 6 are configured to deliver EOT (as used by IE) and TTF files. But WOFF (Firefox) and SVG (iPhone, iPad and others) will not be served.

Simply add the following MIME type declarations via IIS Manager (HTTP Headers tab of website properties):

.woff   application/x-woff
.svg    image/svg+xml

...and everything should work fine.