网站中要使用哪个字体文件? [英] Which Fontfile to use in a website?

问题描述

伙计们，我正在一个需要字体很棒的自定义项目中工作 但是当我检查字体很棒的字体文件时，我可以看到它们提供了很多选项

1. JS
2. 带JS的SVG
3. Web字体

据我所知，我应该使用 WebFonts ，但是在那我可以看到很多字体文件.

1. eot
2. svg
3. ttf
4. woff
5. woff2

是否所有字体格式都是必需的? 我们可以只使用SVG吗?

实际上，如果我添加所有占用太多空间的字体文件，我总共需要我的项目2MB.

解决方案

在发布本文时，您选择的字体FontAwesome包含3,332个不同的字形.您完全可以假设将文件加载五次会占用一些严重的系统资源.

但是……

通常在将Webfont用于图标时，我们仅使用字体中定义的许多图标中的一部分.如果您仅使用FontAwesome中的三或四个字形，则加载五次对于您的系统来说应该是轻而易举的事情.

如何执行此操作?使用字体设置服务.在其网站上提供免费且易于遵循的说明.有几种，但就我个人而言，我在fontello上取得了成功: http://fontello.com

我已经从FontAwesome子集中(动词?)约20-25个图标(超出了我的需要)，以在我的网站上提供简单的图标，并且文件大小小于60KB，总和.

当然，我们加载这5次的原因是什么?为了最大化跨浏览器的兼容性.干净利落.做到了.

Guys i am working on a custom project where i need font awesome But when checking fontawesome font files i can see they provide a lot of options

1. JS
2. SVG With JS
3. WebFonts

As for as i know i should use WebFonts but in that i can see there are lot of font file.

1. eot
2. svg
3. ttf
4. woff
5. woff2

is all the font formats are required ? Can we use only SVG ?

Actually i need my project in total of 2MB if i add all the font files it taking too much space.

解决方案

As of this posting your selected typeface, FontAwesome , contains 3,332 different glyphs. You are more than correct to assume that loading this file five times over will take up some serious system resources.

However…

Often when using a webfont for icons, we only use a portion of the many icons defined in the font. If you are only using three or four glyphs from FontAwesome, then loading those five times should be a light-as-a-feather job for your system.

How to do this? Use a font-subsetting service. Free and easy-to-follow instructions on their sites. There are several, but personally I've had success with fontello: http://fontello.com

I have subsetted (verb?) about 20-25 icons from FontAwesome (more than I needed) to provide simple icons on my site, and the file sizes are under 60KB, collectively.

And of course, the reason we load these five times over? To maximize cross-browser compatibility. Plain and simple. This does it.

这篇关于网站中要使用哪个字体文件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！