字体主要分为衬线字和无衬线字。网站制作中，选用什么样的字体是比较重要。
衬线字和无衬线字的区别：
左边的中文和英文字属于衬线字，右边中文和英文属于无衬线字。
衬线字指的是在字的笔画开始、结束的地方有额外的装饰，而且笔画的粗细会有所不同。
如宋体，观察比划可以看到横细竖粗的特点，这就是典型的称线字。
无衬线字体没有这些额外的装饰，而且笔画的粗细差不多。比如微软雅黑。
衬线字体容易识别，它强调了每个字母笔画的开始和结束，因此易读性比较高，非衬线字则比较醒目。
在使用的过程中需要根据网站的定位而选择相应的字体。
下面简单给大家介绍在网站当中常用的8款字体：
1、微软雅黑
web里面最安全的一个字体。字体方正、简洁，被广泛使用。
上海大众这个网站默认的首选字体就是微软雅黑，整体比较简洁。
2、黑体
黑体字和微软雅黑差不多，作为非衬线字中的一种，同样具备方正、简洁、醒目的特点。
特别适合当标题。其实黑体在使用上没有微软雅黑来得清晰明亮，一般在微软雅黑和黑体的选择下，个人更倾向微软雅黑。
佳能的官网默认首选的字体就是黑体，字体简洁醒目。
3、宋体
称线字体——中易宋体，简称宋体。笔划有粗细变化，常用于书籍、杂志、报纸印刷的正文排版，所以在大篇幅文章的设计时，可以采用宋体。
大标题显示时字体不是很好看，所以一般不建议用宋体来当标题。
上海汉路律师事务所的网站就是采用了宋体字，这种字体的选择一般出现在一些个性比较强的网站中，传统、专业、公正、官方、权威，宋体就表现了这种特点。
4、 Arial
Arial字体是微软公司网页核心字体之一，最常用的sans serif字体，当字号很小时不容易阅读。但是，大写的“I”和小写的“l”是无法区别的，所以一般可以考虑用Tahoma字体来替代。这套字体方正、不花巧、方便阅读和印刷清晰。使用范围特别广泛。
但苹果系统下是没有这套字体的，苹果系统默认的是Helvetica。
可以看下禅道项目管理软件的英文网站，幻灯片采用的字体就是Arial，可以看下这套字体在幻灯片下粗细的组合形态。
5、Tahoma
Tahoma是英文Windows操作系统的默认字体，这个字体比较均衡，是种非常圆滑的字体。这个字体和中文混排显示时，不会出现中英文不对齐的状态。这套字体解决了Arial大写“I”与小写“l”难以分辨的问题。也相当于在Arial上优化了不少。除此，细看这套字体，可以发现其实在一些笔划的处理上还是很精致的。
zui前端框架网站，英文字体的设置上也用到了这个字体，虽然不是第一优先选择，但是可以看出Tahoma这套字体的使用率也是很高的。
6、Helvetica
Helvetica字体，设计师们的最爱。这套字体属于 Realist风格，拥有简洁现代的线条，受到大部分设计师的追捧。这种字体给人一种简单、现代化、休闲轻松的感觉。适用于扁平化设计，也适合搭配任何设计项目，包括banner、平面设计以及网页字体等。
在Mac下面被认为是最佳的网页字体，但在Windows下由于Hinting的原因显示很糟糕。
这个字体主要体现在苹果官网上，可以看下美国的官网。
7、Georgia
说到英文的衬线字，肯定首选是Georgia。
这套字体笔划粗重，衬线明线，轮廓较大，小字体显示也很清晰，同时细节还不错。
此种字体风格优雅又精致，可用于电影海报、游戏、时尚类网页设计中。
林肯的官网，Georgia是官网的第二优先选择显示的字体。网站比较现代，在一些幻灯片当中结合了Georgia字体，称线字和非称线字的相结合，可以使得整个网站更生动。
在专业的网页设计里，除了Banner图、广告语等特殊情况可能会用到特殊字体，网页中使用的字体以不超过2种为准，并且最好采用标准字体，比如中文的宋体、微软雅黑，英文的Arial、Helvetica。
使用这些系统自带的字体，能让前端开发人员在排版时高程度地还原设计稿的文字效果。
倘若使用了特殊字体，在设计font-family的时候，应该多设置几种字体的优先顺序，以确保网页显示的最佳效果。
当然，我们一般情况下建议使用系统自带的字体。
以上7种网站中常用的字体介绍和示例，希望可以对大家有所帮助。
本文转载自,原文链接： ,本文观点不代表125jz立场。
微信扫一扫 
支付宝扫一扫 
