为什么网页定义字体族时,最后一个都是sans-serif?

总结:

为了保证网页文字显示效果,避免因字体定义不生效,应用系统默认字体导致网页视觉效果不可控的问题。

sans-serif是无衬线体,是一类字体(互联网经常使用无衬线体,相比衬线体,不易引起视觉疲劳),它在操作系统或者浏览器里是可以设置的(设置的这种字体肯定是当前系统里存在的),使用这个字体就一定能生效,加上sans-serif能保证调用


一. 案例

美院


美院


清华大学信息设计系


清华大学信息设计系


摩登天空


摩登天空


Apple

apple

volusion【国外】


volusion

二. 了解sans-serif

什么是sans-serif?

sans-serif是无衬线体,是一类字体。它在操作系统或者浏览器里是可以设置的,设置的这种字体肯定是当前系统里存在的字体,所以使用这个字体就一定能显示出来,加上sans-serif就能保证调用

Chrome设置-外观

为什么用sans-serif? 不用serif

字体大致可以分成衬线字体 serif 和无衬线字体sans-serif。


衬线指的是字母结构笔画之外的装饰性笔画,比如宋体就是典型的有衬线字体,常用于印刷。


央美-衬线字体

在互联网时代,用的最多的是无衬线字体,比如微软雅黑。所以在 UI 设计中,主要界面框架基本使用的就是无衬线字体。

为什么在互联网时代,用的最多的是无衬线字体?

衬线字体从审美角度较为正式优美,然从眼睛的感受并不及无衬线的黑体字,因为衬线体在笔划上有过多的点缀(笔划末端的小三角),很容易造成视觉疲劳(尤其是显示在萤幕上时)。出于上述原因,大部分网页使用无衬线字体。 ——维基百科


北大-无衬线字体


三. 为什么放在最后一个?

定义font-family字体族后,字体是从左到右的顺序调用。在最后加一个sans-serif,这样如果所列出的字体都不能用,则默认的sans-serif字体就能保证调用

所以代码常规写法中,最后通常都会带一个sans-serif:

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容