The trick lies with this optimization: unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; With this, the browser knows whether it needs to download the font, depending on the characters it just loaded in the html. Chrome is currently the only one with full support for this. MDN lists Firefox 36+ as completely ignoring this spec, therefore Google … Read more
Convert the ‘woff’ webfont to a regular font (e.g. TTF) using a service such as Online Font Converter. Then edit the converted file with your favorite font editing software. Specific ‘woff’ Editor: http://www.high-logic.com/font-editor/fontcreator.html Programming Tools: http://www.freetype.org/
This is doing the job for me, as Google page speed is no longer asking to fix it. The AddType is essential. # Fonts # Add correct content-type for fonts AddType application/vnd.ms-fontobject .eot AddType application/x-font-ttf .ttf AddType application/x-font-opentype .otf AddType application/x-font-woff .woff AddType image/svg+xml .svg # Compress compressible fonts # only uncomment if you dont … Read more
I realize that this question is old, but for anyone looking for a quick copy/paste for adding font MIME types to their .htaccess: <IfModule mod_mime.c> AddType application/vnd.ms-fontobject .eot AddType application/x-font-opentype .otf AddType image/svg+xml .svg AddType application/x-font-ttf .ttf AddType application/font-woff .woff AddType application/font-woff2 .woff2 </IfModule>
I wrote a simple tool for that: https://github.com/hanikesn/woff2otf Currently only tested with ttf files.
October 2018 edit tl;dr: use WOFF2, every modern browser supports it, with WOFF fallback because IE11 just won’t bloody die (late 2022 update: Microsoft actually killed it on its promised EOL date of June 15, and the world is a better place for it), and without the local() source indicator, because you want everyone to … Read more
After generation of WOFF files, you have to define font-family, which can be used later in all your css styles. Below is the code to define font families (for normal, bold, bold-italic, italic) typefaces. It is assumed, that there are 4 *.WOFF files (for mentioned typefaces), placed in fonts subdirectory. In CSS code: @font-face { … Read more
In IIS you can declare the mime type for WOFF2 font files by adding the following to your project’s web.config: <system.webServer> <staticContent> <remove fileExtension=”.woff2″ /> <mimeMap fileExtension=”.woff2″ mimeType=”font/woff2″ /> </staticContent> </system.webServer> Update: The mime type may be changing according to the latest W3C Editor’s Draft WOFF2 spec. See Appendix A: Internet Media Type Registration section … Read more
I was experiencing this same symptom – 404 on woff files in Chrome – and was running an application on a Windows Server with IIS 6. If you are in the same situation you can fix it by doing the following: Solution 1 “Simply add the following MIME type declarations via IIS Manager (HTTP Headers … Read more
Update from Keith Shaw’s comment on Jun 22, 2017: As of February 2017, RFC8081 is the proposed standard. It defines a top-level media type for fonts, therefore the standard media type for WOFF and WOFF2 are as follows: font/woff font/woff2 In January 2011 it was announced that in the meantime Chromium will recognize application/x-font-woff as … Read more