Proper MIME type for fonts
在网上搜索,我找到了大量关于字体的正确MIME类型的不同建议,但我还没有尝试任何可以解决Chrome警告的MIME类型,如下所示:
Resource interpreted as font but transferred with MIME type font/otf
字体是OTF。
到目前为止,我尝试了以下MIME类型
- 字体/ OTF
- 应用/字体OTF
- 应用/字体
- 应用程序/ OTF
- 应用/八位字节流
- 应用程序/ x-字体OTF
- application / x-font-TrueType(我知道它不是truetype,但有一个来源引用了这个OTF)
在Apache和IIS服务器上,可以使用多种字体格式设置MIME类型。我传统上有以下运气:
1 2 3 4 5 6 7 8 | svg as"image/svg+xml" (W3C: August 2011) ttf as"application/x-font-ttf" (IANA: March 2013) or"application/x-font-truetype" otf as"application/x-font-opentype" (IANA: March 2013) woff as"application/font-woff" (IANA: January 2013) woff2 as"application/font-woff2" (W3C W./E.Draft: May 2014/March 2016) eot as"application/vnd.ms-fontobject" (IANA: December 2005) sfnt as"application/font-sfnt" (IANA: March 2013) |
根据互联网工程任务组的说法,他们在这里维护有关多用途Internet邮件扩展(MIME类型)的初始文档:http://tools.ietf.org/html/rfc2045#section-5 ...它具体说明:
"It is expected that additions to the larger set of
supported types can generally be accomplished by the creation of new
subtypes of these initial types. In the future, more top-level types
may be defined only by a standards-track extension to this standard.
If another top-level type is to be used for any reason, it must be
given a name starting with"X-" to indicate its non-standard status
and to avoid a potential conflict with a future official name."
随着时间的推移,随着时间的推移,在创建和接受标准时会添加其他MIME类型,因此我们会看到供应商特定MIME类型的示例,例如vnd.ms-fontobject等。
更新2013年8月16日:WOFF于2013年1月3日在IANA正式注册,Webkit已于2013年3月5日更新,在最新版本中获取此更新的浏览器将开始发布有关服务器MIME类型的警告x-font-woff声明。由于警告只是令人讨厌,我建议立即切换到批准的MIME类型。在理想的世界中,警告会及时解决。
更新2015年2月26日:WOFF2现在处于W3C编辑的草案中,提议使用mime类型。它可能会在最近的进度时间表之后在明年(可能在2016年底)提交给IANA。还有SFNT,Google Web Fonts主干表参考中使用的可扩展/样条容器字体格式及其非常简单的Java库,并且已经注册为IANA的mime类型,并且可以根据个人需要添加到此列表中。
更新2017年10月4日:我们可以通过大多数支持该格式的现代浏览器来跟踪WOFF2格式的进展。同样,我们可以按照IETF的"字体"顶级媒体类型评论请求(RFC)跟踪器和有关最新提议的字体类型集的文档进行审批。
对于那些希望在CSS中以正确的顺序嵌入字体的人,请访问这篇文章。但是,我再次对以下顺序感到满意:
1 2 3 4 5 6 7 8 9 10 11 | @font-face { font-family: 'my-web-font'; src: url('webfont.eot'); src: url('webfont.eot?#iefix') format('embedded-opentype'), url('webfont.woff2') format('woff2'), url('webfont.woff') format('woff'), url('webfont.ttf') format('truetype'), url('webfont.svg#webfont') format('svg'); font-weight: normal; font-style: normal; } |
对于Subversion自动属性,这些属性可以列为:
1 2 3 4 5 6 7 8 | # Font formats svg = svn:mime-type=image/svg+xml ttf = svn:mime-type=application/x-font-ttf otf = svn:mime-type=application/x-font-opentype woff = svn:mime-type=application/font-woff woff2 = svn:mime-type=application/font-woff2 eot = svn:mime-type=application/vnd.ms-fontobject sfnt = svn:mime-type=application/font-sfnt |
尝试使用"font / opentype"。
忽略铬警告。 OTF字体没有标准的MIME类型。
font / opentype可能会使警告静音,但这并不能使其成为"正确"的事情。
可以说,你最好还是做一个,例如使用"application / x-opentype",因为至少"application"是注册的内容类型,而"font"不是。
更新:OTF仍然存在问题,但WOFF在2013年1月增加了IANA MIME类型的application / font-woff。
更新2:OTF已经增长了MIME类型:application / font-sfnt 2013年3月。此类型也适用于.ttf
自2017年2月起,RFC 8081将顶级
IANA列出的字体类型现在是:
-
.otf -> font / otf -
.sfnt -> font / sfnt -
.ttf -> font / ttf -
.woff -> font / woff -
.woff2 -> font / woff2
其他非标准字体格式保留原样:
-
.eot -> application / vnd.ms-fontobject(自2005年12月起) -
.svg -> image / svg + xml(自2011年8月起)
[过时的原帖]
由于网络上关于网络字体的MIME类型仍然存在很多混淆,我想我会给出一个当前答案,包括有效日期,以及支持IANA和W3C的链接。
以下是Web字体的官方MIME类型:
-
.eot -> application / vnd.ms-fontobject(自2005年12月起) -
.otf -> application / font-sfnt(自2013年3月起) -
.svg -> image / svg + xml(自2011年8月起) -
.ttf -> application / font-sfnt(自2013年3月起) -
.woff -> application / font-woff(自2013年1月起) -
.woff2 -> font / woff2(由W3C于2016年3月提出)
请注意,有一个将上述所有内容更改为
关于Web服务器的主题,值得一提的是,HTTP响应可能
我在(Fantom)BedSheet的Web字体的MIME类型中说了更多。
作为计算中两个难点之一的具体实例,有趣的是看到这个问题的答案在最初发布以来是如何改变的。值得庆幸的是,这些权力给混乱带来了秩序:
在今年2月(2017年),W3C发布了标准跟踪RFC 8081:"字体"顶级媒体类型,它极大地简化了字体文件的相应媒体类型:
This memo serves to register and document the"font" top-level media type,
under which subtypes for representation formats for fonts may be registered.
This document also serves as a registration application for a set of
intended subtypes, which are representative of some existing subtypes
already in use, and currently registered under the"application" tree by
their separate registrations.
它是一个非常易读的文档,它描述了历史背景(缺少"字体格式的注册"),这引起了媒体类型和子类型的混乱混合。随着(相对)近期可下载网络字体的普及,W3C认识到需要"直观的顶级字体类型"。他们想出的是......
因此,IANA已使用
1 2 3 4 5 6 | collection font/collection otf font/otf sfnt font/sfnt ttf font/ttf woff font/woff woff2 font/woff2 |
这里希望这是这个问题需要的最后答案。
我刚刚对IANA官方列表进行了一些研究。我相信这里给出的答案'font / xxx'是不正确的,因为MIME标准中没有'font'类型。
根据RFC和IANA,这似乎是截至2013年5月的当前状态:
这三个是官方的,由IANA分配:
- svg为"image / svg + xml"
- woff为"application / font-woff"
- eot as"application / vnd.ms-fontobject"
这些不是官方/分配的,因此必须使用'x-'语法:
- ttf为"application / x-font-ttf"
- otf为"application / x-font-opentype"
application / font-woff看起来是新的,也许只是2013年1月以来的官方版本。所以"application / x-font-woff"在短期内可能更安全/更兼容。
关于在Debian Linux和OS X Leopard和Snow Leopard上测试的Apache 2.2 VirtualHosting和mod_mime的FWIW:
如果您有VirtualHost配置,则需要通过AddType指令添加类型,如下所示,至少在配置的底部如下:
1 2 3 4 | .... AddType font/opentype .otf AddType font/ttf .ttf </VirtualHost> |
针对Chrome Unstable / Trunk和Safari WebKit Nightly进行了测试,消除了ttf和otf字体类型的mime八位字节流警告。
注意:.htaccess在处理VirtualHosting时没有效果。如果您正在为多个站点开发,那么您将使用VirtualHosting开发,并且每个配置都需要添加这些AddType。
从2013年3月起,IANA.ORG建议使用.otf:
其他字体:
1 2 3 4 5 | .eot -> application/vnd.ms-fontobject (as from December 2005) .otf -> application/font-sfnt (as from March 2013) .svg -> image/svg+xml (as from August 2011) .ttf -> application/font-sfnt (as from March 2013) .woff -> application/font-woff (as from January 2013) |
查看更多...
这是NGINX解决方案
文件
1 | /usr/local/nginx/conf/mime.types |
加
1 2 3 4 5 | font/ttf ttf; font/opentype otf; application/font-woff woff2; application/font-woff woff; application/vnd.ms-fontobject eot; |
去掉
1 | application/octet-stream eot; |
感谢Mike Fulcher
http://drawingablank.me/blog/font-mime-types-in-nginx.html
截至2017年2月,RFC 8081添加了字体/ *媒体类型,这些类型也列在IANA媒体类型列表中。
woff的application / font-woff:
http://www.iana.org/assignments/media-types/application/font-woff
以下内容可用于电子书空间:
application/vnd.ms-opentype
我会想象网络是一样的。
也许这会对某人有所帮助。我在IIS 7上看到
1 | application/octet-stream |
所以我刚刚添加了所有CSS字体类型(
干杯,
迈克尔
阻止来自Chrome的此警告的一种方法是更新Chrome,然后确保您的mime类型是以下之一:
1 2 3 4 5 6 | "font/ttf" "font/opentype" "application/font-woff" "application/x-font-type1" "application/x-font-ttf" "application/x-truetype-font" |
此列表是根据webkit.org上的Bug 111418找到的补丁。
同一个补丁将消息从"警告"降级为"日志",因此只需将Chrome升级到2013年3月发布的任何版本,就可以摆脱黄色三角形。
由于问题是关于静音Chrome警告,并且由于某些原因,人们可能会坚持使用旧的Chrome版本,因此我认为这值得添加。