@font-face in IE: Avoid always downloading font?

Question

When using an IE specific font-face declaration like below:

@font-face{
    font-family:'Arial Narrow';
    font-style:normal;
    font-weight:normal;
    src:url('../fonts/ArialNarrow.eot');
    src:local('Arial Narrow'),
    local('ArialNarrow'),
    url('../fonts/ArialNarrow.eot') format('embedded-opentype'),
    url('../fonts/ArialNarrow.woff') format('woff');
}

From what I can see, even though the font exists as a system font, it insists on downloading the font that my sheet suggests every time. In order to be more efficient, is there a way to only download the font in IE if it's necessary?

Answer 1

With this declaration for IE6+:

@font-face{
    font-family:'Arial Narrow';
    font-style:normal;
    font-weight:normal;
    src:url('../fonts/ArialNarrow.eot');
    src:local('Arial Narrow'),
    local('ArialNarrow'),
    url('../fonts/ArialNarrow.eot') format('embedded-opentype'),
    url('../fonts/ArialNarrow.woff') format('woff');
}

This declaration for FF/Opera/Chrome/Safari:

@font-face{
    font-family:'Arial Narrow';
    font-style:normal;
    font-weight:normal;
    src:local('Arial Narrow'),
    local('ArialNarrow'),
    url('../fonts/ArialNarrow.ttf') format('truetype');
}

IE 6/7/8 and lower/IE9+ WITH compatibility mode on: Downloads the linked font no matter what.

Firefox/Opera/Chrome/Safari/IE9+ WITH compatibility mode off: Uses system font when available. Downloads the linked font when system font is unavailable.

Compatibility mode is forced off with:

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

Good news: Fonts are cached in all browsers. They only have to be downloaded once.

Final Answer: There is no way to avoid an @font-face file download in IE 6/7/8 and IE 9+ with compatibility mode on.