字体是网页设计中最重要的细节

栏目:建站资迅 2020-10-29

一个非创意性质的网页,最重要的内容,就是文字。出现了文字,就会出现文字排版、字体选择、字体颜色大小粗细等细节。而这些细节,往往常重要的细节。

好的字体排版,可以让人耐心的看完那些文字,然后得到其中的重要信息,还可以影响到浏览者阅读的心情。同时,字体的选择、大小等,还应该配合企业的VI识别系统,还需要配合你作品需要表达的思想感情来确定(例如古典风格,应该选择哥特式字体等)。

好了,关于字体的重要性,我就说这么多,再多说也是废话,只要大家知道很重要,要好好选择调整就好了。

字体的分类和格式

衬线和无衬线

衬线算是一种辅助性的小细节,笼统的谈,太过于抽象,我们来看两个例子:

这两个字体,是有衬线字体,大家可以看到在边角的,会多出一些修饰。这样的好处就是,可以清晰的分辨出字母和文字,分辨笔划的起始和终止。但是,这种字体如果设置字体大小太小的话、或者你里文字较远,则会受到衬线影响,分辨不清晰。同时,由于中文系统,默认的字体为宋体,见的太多导致审美疲劳,所以衬线字体比较适合打印文字以及正规文档中使用,通常不太适合使用在网页中。

这两个字体,就是无衬线字体,没有边角的修饰,令人看起来很整齐光滑,没有毛刺。比较适合用在网页中,让浏览者获取大量的文字信息而不会疲劳。

字体系列

字体之间最大的差异并不在于有无衬线,而在于字体与字体之间,形体的差异。但是很多字体(特别是英文字体)之间,差异不大,有些新字体甚至是对已有字体进行了细微的后产生的。

于是,就把字体分成了几个大的系列,同一个系列中的字体,大体相同,称作通用字体系列。其中包括以下五个系列:

serif:带衬线字体。Times New Roman 是默认的 serif 字体,中文字体的话,是宋体、仿宋之类的字体。

sans serif:无衬线字体。Arial 是默认的 sans-serif 字体,中文字体中,微软雅黑、黑体等都是这类字体。

monospace:等宽字体。这个字体里面的每个字母都有相同的宽度。通常用于显示程序代码等,Courier 是默认的 monospace 字体。而对于中文,每个汉字都是等宽的。

cursive:模仿手写字体。手写体,比较个性,通常用于标题、logo等等。这个字体系列没有默认字体,英文来说,通常用 Comic Sans,中文的话,行书系列、草书系列的字体等,都可以算作手写字体。

ntasy:装饰用字体。多数用于标题,极具个性,字体繁多,艺术字体。无法对其的大小、形状下一个统一的,所以没有默认字体,在网页中,也通常很少用到,除非你有特殊的用处创意性的设计。

关于通用字体系列的更多解释、描述和字体举例,推荐大家查看在 W3school 上的资料。

字体的格式

格式就是指字体表现出来的粗细、宽度和姿态等等特征。看下面的这张图片:

里面的字,是相同大小的,同时排放在一条竖线上。为其应用了四种不同的字体后,体现出来了不同的形态和粗细大小。在中文字体中,不同的字体,在字间距中通常没有很大的变化。而在英文字体中,不同的字体会改变字母的大小,导致整体的尺寸布局不同,进而导致整个排版混乱。

相同的字体大小,在不同的字体下面,显示的效果几乎完全不同。这是英文字体选择中,比较麻烦和头疼的问题。

字体的选择

的这些理论,从某些角度和意义上来说,都是废话。如何选择合适的字体,才真正切合实际。那么我们应该如何选择在网页中使用的字体呢?

解决这个问题,我们先应该知道为什么要纠结于选择字体这个问题。我个人认为应该存在 实用性 和 创意性 这两个方面的因素。创意性很好理解,就是想突破常规,配合自己的网页中的设计思想而选择相应的字体,例如表达程序员的思维,就对代码使用等宽字体,表达恐怖、古典,使用哥特式字体等等。这点自己去找字体好了,不再赘述。最主要的问题是在于 实用性 的方面。

实用性问题,即不需要太过于华丽的字体,只需要大家看的都舒服、稍微带点自己的特色即可。你会说,很容易啊,直接 CSS 定义一条,填上个字体就好了。如果真这样,那就太好了。浏览器解析字体的过程实际上是这样的,当浏览器加载 CSS 后,解析到有关字体的样式,它会在你的系统中查找这个字体,只有找到了相应的字体文件,才会根据那个字体文件对网页中的文字进行渲染,显示出你想要的效果。

既然这样,如果你的操作系统中,并没有安装网页中定义的那种字体,就无法渲染出那种字体的效果,而通常使用当前系统的默认字体来渲染。那么你原有的设计,就不行了,你设计时觉得挺好,字体、、大小合适,但在别人的电脑上,清一色的宋体。所以这个问题,才是选择字体的难处所在。当然,有问题就有解决方式:

使用经典通用字体

不同操作系统都有不同的字体系统,但既然是字体,总有一些比较经典老牌的字体共同存在于各个系统中。例如无衬线的 Arial 字体,它产生的时间比较早,同时价格低廉,所以从早期就被 windows 操作系统使用,在其他的操作系统中,也会有较好的不同于默认字体的显示效果。所以 我爱水煮鱼、潜行者m博客 这些网站,直接在 CSS 中声明使用一个字体:Arial。

相关阅读

低成本建站:创造性解决方案的探索

2024-04-41

在当今数字化时代,网站已成为企业、个人甚至机构不可或缺的存在。然而,对于许多初创企业和个人项目来说,高昂的建站费用可能是一个障碍。在这篇文章中,我们将探讨低成本建站的创造性解决方案,为您提供一些经济实惠但又高效的建站方法。选择适合的建站平台首先,选择合适的建站平台至关重要。有许多免费或低成本的建站平台可供选择,如WordPress、Wix、Squarespa…

建设一个营销型的网站有什么优化技巧

2021-05-57

建设一个营销型网站是整合了各种网络营销理念和网站运营管理方法,不仅仅要注重建站的专业性,更加注重网站运营管理的整个过程,是企业建站与运营维护一体化的全程网络营销模式。那么建设一个营销型的网站有什么优化技巧?1、网站的标题就是网站页面中用<title>标签来表示,对网页主题内容的概括。标题是网站优化最重要的内部因素,是被搜素引擎当做网页主题的最主要…

如何设计可以使网站留住更多用户?

2021-04-410

在如今竞争激烈的行业环境中,想要自己的网站更具吸引力并留住旧用户,是一件十分困难的事情。那么如何设计可以使网站留住更多用户?1、网站要兼容不同的设备随着现在移动端搜索用户的不断增多,网站兼容pc,ipad,移动端等不同的设备已然成为了建站设计必须要考虑的问题。网站兼容不同的设备,可以最大程度的实现网站的网络营销。2、网站一定要精美用户是否继续访问网站的往往是…

品牌建站需要做的策划

2021-03-310

随着互联网的不断发展,越来越多的大型企业,重视品牌建站,想借助互联网让自己的品牌知名度更上一层。品牌建站不像普通的网站,这个需要深入市场、企业做调研,挖掘企业的各方面优势,帮助企业塑造独有的形象,特别是很多细节问题,直接影响到品牌网站的发力,那么品牌建站需要做的策划有哪些?下面广州建站公司网巢网络给大家分享相关知识。1、做好品牌建站的定位做高端品牌建站一定要…

为什么小企业越来越难做百度优化?

2020-10-10118

很多需要做百度优化的客户问我这样一个问题“为什么优化对于小企业来说更难?”这个问题我也在团队中讨论很多次了,最终我们得出以下这几个原因也许能够说明问题。1.你的钱太少这是搜索引擎优化的第一个原因–也是所有原因的根源!-对小企业来说更难。这是一个没有办法改变的事实:你必须花钱做优化先之后才能赚钱。公司花钱投放市场营销和广告的原因是因为他们提供投资回报率,但有时…

HDwiki百科建站第一期

2020-10-1085

题目:回顾过去,展望未来——HDwiki产品发展历程嘉宾:宋登高大家好,我是负责开源HDwiki的技术人员,今天我来给大家分享下HDwiki的历史还有我们真实的想法。HDwiki产品历史介绍:互动百科系统(HDwiki)作为国内第一家拥有自主知识产权的中文Wiki系统,力争给国内外众多的Wiki爱好者提供一个免费、易用、功能强大的Wiki建站系统。2006年…