关于字体的几点说明:网页字体在电脑和手机上显示更多是由用户电脑的设置决定。当用户电脑安装有网页指定字体时,则会正常显示,如没有则会显示系统默认的字体,一般是宋体或黑体,也就是我们经常遇到用户反应为什么页面显示效果跟设计稿不同,特别是中英文混排时会更难看。
所以,为避免这种我们不希望看到的效果,网页设计字体需要选择所有电脑系统默认自带的字体,也就是黑体和宋体。另外,因为大多数windows电脑都安装有微软办公软件office,所以会默认安装“微软雅黑”字体,微软雅黑是目前的显示效果最佳的字体,在中文、英文、中英文混排时比黑体、宋体要美观很多,而且安装的用户也较普遍。因此,微软雅黑是网页字体的首选。苹果电脑上如果没有微软雅黑,则默认会使用系统默认苹方黑。
在手机端字体显示则主要是以系统默认字体显示,基本不受程序控制。一般分为无衬线字体和有衬线字体两台类,也就是黑体和宋体。
纯英文字体显示原则与中文字体原理一致,系统默认的字体通常是Arial、Helvetica、Times New Roman。
如果必须使用指定字体,【1】如果是英文字体,我们可以在服务器端配置字库,用户访问时会先下载指定字库,英文字库大小通常不超过1MB,对用户访问速度不会有太大影响,但是也不排除意外情况,用户网速慢或字体没有下载成功,则用户看到的则是用户体统的默认字体。【2】如果是中文字体,则不能采用提供字体下载的方式,中文字体大小通常会超过100MB,即便是高速宽带,用户下载也需要非常长时间,会严重影响用户的访问体验。所以中文字体需要使用云字库的技术,为用户提供指定文字的下载,这种服务按调用次数和页面文字量多少收费。其涉及技术环节较多,用户访问速度还是会受很大影响。【3】对于一些标题使用指定字体,可以使用图片,但是图片内容会妨碍搜索引擎收录,另外比较长的标题,在手机端无法折行会造成文字很小。综合上述情况,不是非常必要的情况,不建议使用指定字体,会造成用户访问效果不确定,以及开发和后续使用成本的增加。
字体显示测试
TVtalk.cn 建站 font-family: ‘Microsoft Yahei’, ‘微软雅黑’, SimHei, 黑体, Arial;
TVtalk.cn 建站 font-family: Verdana, Geneva, ‘Microsoft Yahei’, ‘微软雅黑’, sans-serif;
TVtalk.cn 建站 font-family: Arial, SimHei, 黑体;
TVtalk.cn 建站 font-family: SimSun, 宋体, ‘Times New Roman’;
TVtalk.cn 建站 font-family: STFangsong, ‘仿宋’;
TVtalk.cn 建站 font-family: Kai, 楷体;
TVtalk.cn 建站最安全字体回退原则 font-family: -apple-system, BlinkMacSystemFont, ‘Segoe UI’, Roboto, ‘Segoe UI’, ‘Helvetica Neue’, ‘PingFang SC’, ‘Noto Sans’, ‘Noto Sans CJK SC’, ’Microsoft YaHei‘, ’微软雅黑‘, sans-serif;
自定义css全站换字体:
h1, h2, h3, h4, h5, h6, p.site-title, p, body {
font-family:Tahoma, Verdana, Geneva, ‘Microsoft Yahei’, ‘微软雅黑’, sans-serif;
}