In doing mobile development, UI designers will provide some custom fonts to improve the product's visual effects. For front-end development, it will need to consider the size of the file compatibility and font files, try to ensure that in the case of UI effects, compatible with more browsers, reducing the volume of resources, the UI effects, compatibility, performance reaches three balance. Due to limitations Chinese character set fonts, font package file will be a great final, not discussed here. The following describes the English, numbers, symbols scene several common font formats.
.ttf
TrueType is a Type 1 (Adobe has developed) of competing products, developed together by Apple and Microsoft, is the most widely used mac system font and window systems, usually downloaded from the Internet are ttf font file format, click It can be installed on your system.
.otf
OpenType, TrueType OpenType is the predecessor, Microsoft seeks Apple's GX typesetting authorization failure 1990s, forced to create their own martial arts named TrueType Open, and later with the development of computer typesetting technology need to be more expressive fonts , Adobe and Microsoft developed a new font blend of Type 1 and TrueType Open underlying technology, named OpenType. OpenType tissue was subsequently accepted ISO standard, called Open Font Format (off).
.eot
Embedded Open Type, mainly used in earlier versions of IE, Microsoft made according to OpenType compression, re-named Embedded OpenType, its proprietary format with copyright protection and compression. ttf and otf fonts in web end is compatible relatively good, except for IE and early Android ios safari and less support, other browsers are compatible are good. However, due to ttf and otf too large, in the era of the desktop browser also meet the needs, to the era of mobile browsers, frequently 5MB, 10MB font file becomes too big. So Microsoft in OpenType, based on optimized compression, compared OpenType greatly reducing the volume, but in addition to IE browsers are not supported and therefore did not become the industry standard.
.woff
Web Open the Font the Format, can be seen as another package ttf, adding compression and font information sources, typically less than 40% ttf. After April 8, 2010, Mozilla Foundation, Opera Software and Microsoft, WOFF submit, comment refers to the World Wide Web Consortium, hope WOFF will soon be able to become all browsers support the "single, interoperable (Font) format . " July 27, 2010, the World Wide Web Consortium WOFF as a working draft released. Also the current mainstream web font format.
woff font file browser compatibility (2019.07.23)
.woff2
Web Open the Font the Format 2.0, compared to the maximum optimization woff should be to strengthen the compression ratio of the font. Under the same font content, woff2 woff less than 20% to 30%.
woff2 font file browser compatibility (2019.07.23)
结论
对比总结我们就会发现，尽管 .woff 文件由于历史原因，许多旧设备的浏览器并不支持，但是考虑当前兼容情况和文件大小的优势，在进行移动Web开发时，我们可以优先考虑使用.woff2，如果需要兼容更多的低版本设备，再考虑使用.woff。
————————————————
版权声明：本文为CSDN博主「black-heart」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/mrqingyu/article/details/96995760