Asked 30/1, 2015 at 12:5 Answered 1/7, 2015 at 2:48

307

Today I updated Font Awesome package to 4.3.0 and noticed that woff2 font was added. That file is linked in CSS so I need to configure nginx to serve woff2 files properly.

Currently I have this block in nginx config for fonts:

location ~* \.(otf|eot|woff|ttf)$ {
    types     {font/opentype otf;}
    types     {application/vnd.ms-fontobject eot;}
    types     {font/truetype ttf;}
    types     {application/font-woff woff;}
}

What is proper mime type for woff2 fonts?

Photoengrave answered 30/1, 2015 at 12:5 Comment(1)

Here's how to cache woff2 files in Apache: <IfModule mod_mime.c> AddType font/woff2 woff2 and <IfModule mod_expires.c> ExpiresActive On ExpiresByType font/woff2 "access plus 1 month". (Closing tags and newlines omitted.) – Therapist 24/11, 2015 at 21:55

480

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 6.5. WOFF 2.0 which states the latest proposed format is font/woff2

Rosinski answered 10/3, 2015 at 2:45 Comment(4)

Now MIME-types in IIS 10 was support .woff2. With IIS 10 you don't need to change anything in web.config. – Calcaneus 20/11, 2015 at 7:36

What purpose does the <remove> tag serve here? It doesn't seem to be documented in the IIS reference (iis.net/configreference) – Catherincatherina 23/11, 2016 at 22:34

@Catherincatherina Sometimes IIS throws an error if the mimeMap already exists. Removing it before adding it fixes that error. – Particular 30/11, 2016 at 14:47

Appendix link is broken - please update it :) – Yacketyyak 22/11, 2022 at 15:56

226

font/woff2

For nginx add the following to the mime.types file:

font/woff2 woff2;

Old Answer

The mime type (sometime written as mimetype) for WOFF2 fonts has been proposed as application/font-woff2.

Also, if you refer to the spec (http://dev.w3.org/webfonts/WOFF2/spec/) you will see that font/woff2 is being discussed. I suspect that the filal mime type for all fonts will eventually be the more logical font/* (font/ttf, font/woff2 etc)...

N.B. WOFF2 is still in 'Working Draft' status -- not yet adopted officially.

Quasimodo answered 31/1, 2015 at 13:0 Comment(6)

This has been updated. The spec makes it very clear. Type is font and subtype is woff2 which makes is font/woff2. This is also what Google Fonts itself uses. – Mix 22/6, 2015 at 5:45

I still cannot see anything definitive in the spec. Though they do talk about wanting to introduce a font/* top level type. I think in the interests of full information, I will add that to my answer. – Quasimodo 22/6, 2015 at 10:17

@Quasimodo the mime types are covered in appendix A, for Woff2 it is section 6.5 of appendix A. – Planer 3/9, 2015 at 12:32

Updated March 2016: it is now a candidate recommendation and font/woff2 is the mimetype w3.org/TR/WOFF2/#IMT – Rolland 12/5, 2016 at 16:17

when I gzip woff2 the file gets larger - unlike my CSS and JS files which are shrunk massively - maybe its already compressed? – Infusive 10/11, 2020 at 1:16

@Infusive Yes, both woff and woff2 (and EOT) are already heavily compressed (unlike TTF and OTF) and should be omitted from any additional server-side compression. woff2 uses a different compression algorithm to woff and supposedly offers better compression rates. – Virginium 20/10, 2022 at 22:41

Apache

In Apache, you can add the woff2 mime type via your .htaccess file as stated by this link.

AddType  application/font-woff2  .woff2

IIS

In IIS, simply add the following mimeMap tag into your web.config file inside the staticContent tag.

<configuration>
  <system.webServer>
    <staticContent>
      <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />

Augury answered 1/7, 2015 at 2:48 Comment(5)

what about application/x-font-woff2 – Kindred 11/8, 2015 at 5:5

Hey @Moes :) Acutally, application/x-font-woff2 is the old type for when woff2 was very new. The W3C Spec now recommends using application/font-woff2 since that is widely supported. If you're after backwards compatibility, feel free to also include x-font-woff2. – Augury 18/8, 2015 at 1:58

In IIS, be careful to remove any previously defined extension entries in case they are defined somewhere else in the server. This will give you very confusing errors if you encounter it! <remove fileExtension=".woff2" /> and then define it as above :) – Lundberg 22/4, 2016 at 15:13

Note that the proposed and also most probably be accepted is font/woff2 – Hartal 5/6, 2016 at 9:29

The W3C Recommendation for WOFF File Format 2.0 now recommend using font/woff2 as the MIME type but the IANA list of official media types does not (yet) include WOFF2. – Outbound 8/11, 2016 at 18:15

http://dev.w3.org/webfonts/WOFF2/spec/#IMT

It seem that w3c switched it to font/woff2

I see there is some discussion about the proper mime type. In the link we read:

This document defines a top-level MIME type "font" ...

... the officially defined IANA subtypes such as "application/font-woff" ...

The members of the W3C WebFonts WG believe the use of "application" top-level type is not ideal.

and later

6.5. WOFF 2.0

    Type name:

        font
    Subtype name:

        woff2

So proposition from W3C differs from IANA.

We can see that it also differs from woff type: http://dev.w3.org/webfonts/WOFF/spec/#IMT where we read:

Type name:

    application
Subtype name:

    font-woff

which is

application/font-woff

http://www.w3.org/TR/WOFF/#appendix-b

Capacitate answered 27/4, 2015 at 6:39 Comment(8)

I don't see anything on that page to suggest that it has been changed to font/woff2 can you calrify please? – Quasimodo 28/4, 2015 at 13:30

Maybe I missunderstand it. I mean Appendix A, '6.5. WOFF 2.0' – Capacitate 28/4, 2015 at 14:14

I've got to say the spec isn't very clear. I think they are referring to the font-woff2 part – Quasimodo 29/4, 2015 at 8:39

Can't imagine that this is downvoted. The spec makes it very clear. Type is font and subtype is woff2 which makes is font/woff2. This is also what Google Fonts itself uses. – Mix 22/6, 2015 at 5:43

Agreed, can't see why this was downvoted. Though the spec document has been updated since this question was asked/answered. – Quasimodo 22/6, 2015 at 10:28

I think this answer is better and also more correct, than the accepted. Also I think all fonts should come under one primary type name: "font/..." – Affinity 23/7, 2015 at 11:12

I upvoted this initially but and thought I could get a blog post out of this. As it stands this post is inline with the WOFF2 spec but that is still a Working Draft and hasn't been moved to Recommendation Status yet. This means woff2 doesn't technically have a mime as the font/woff2 is invalid until it's approved but the spec document has revoked the endorsement of application/font-woff2 leaving us with no official one. Therefore I think at this point I'm going to use application/font-woff2. – Interrelated 25/8, 2015 at 20:21

@Interrelated I previously upvoted both this answer and your comment. As of February 2017, the W3C published the Standards Track RFC 8081, making font/woff2 the official media type. See https://mcmap.net/q/75521/-proper-mime-type-for-otf-fonts – Outbound 10/4, 2017 at 11:21

Hot tags

Godot Unity Godot Help Programming Godot 4.X GUI GDScript 3D 2D Physics CSharp Godot 3.X VR XR Projects C++

Apache

IIS

Recommended topics

Hot tags