网页设计怎么选择字体
使网页排版困难的一个问题是,浏览器总是在不断变化和更新。你要选择一个字体,是以现代网络接口用于桌面和移动设备兼容。下面介绍网页设计怎么选择字体,希望为大家带来帮助。
1、从较基本开始
·serif和sans-serif:虽然在网页设计中还有其他类型,但几乎每一个项目都是基于这些选项之*。(无衬线字体是主要的选择)
·字距:适当的字距让人眼看着舒服易于阅读。
·可读性:想想屏幕的大小,每行的字符数是很重要的。
·对齐:想想如何将文本在屏幕上对齐?向左对齐、向右对齐、或者中心对齐?
·记得对比:文本要与背景有足够的对比。有助于对比的元素包括大小和颜色等。
2、考虑兼容性
使网页排版困难的一个问题是,浏览器总是在不断变化和更新。你要选择一个字体,是以现代网络接口用于桌面和移动设备兼容。听起来很容易,它可能需要在多个设备上进行测试,以找到一个无缝的工作。更多建站信息请咨询才艺多。
3、考虑加载时间
如果一个字体不加载,请寻找另一种字体。用户对慢网站没有耐心。无论多么漂亮的字体,它需要闪电般的加载速度。
网页设计的注意事项
网页设计的几点注意事项:
(1)网页页面不必填满,留白,如果留的合适与适当,更利于用户体验。这点可以试想一下,如果一个文字、版块等非常多,排版密密麻麻的网站就好比一辆挤满人的公车,如果没有急事你愿意挤上去吗?
(2)站内信息量。有些人,总认为在页面上表达的东西越多越好,恨不得将肚子里装的所有的东西都一股脑儿的呈现给用户。结果,如果没有强悍的页面设计尤其是在呈现上的驾驭能力,我们将看到的一大片密密麻麻的文字。在读图时代,文字的表现力远远不如图片的表现力,而且,实践表明,如果是一个对你不是非常感兴趣客户是没有耐心去阅读你的长篇大论,因为这是阻碍他去筛选其他商家的时间。
(3)在网页设计上,尤其是专题页面的呈现上,较好尽量别用大段文字来表达你的思想,你想表达的东西越多,让客户产生的疑惑也就越多,转化率也将随之降低。
(4)打个比方,网页设计,尤其是专题页面设计,如同写小作文。一篇小文章,总应有个主题思想。但是,由于网页设计尤其是专题设计又不同于文章。因此,你只需用几个简短的语言来表达你想干什么即可:比如,店内全程免邮;全场8折;全场8折包邮等。客户马上就可以领会到,哦,原来下面的产品,不仅仅是5折而且还可以包邮。这就够了。如果你在这里面要附加很多其它杂乱的信息,反倒让客户产生疑问,只要有一个疑问,接下来就会产生一堆疑问,每个客户都有如此多的问题反复询问你,工作量也会大好几倍,你回答一旦慢了就可能流失客户,所以要表达的信息简单明了是多么的重要。
网页设计中字体和字体大小的选择
一般字体的使用常为宋体。不要使用交生的字体,防止用户因没有安装对应字体样式造成显示错误。此外windows系统也自带了40多种英文字体样式和5种中文字体样式。这些字体的样 式,你也可以在网页设计排版时自由使用和设置不同的字体样式。所以凡是使用了windows操作系统的浏览器都可以正确的显示这些字体,但是在其它操作系统里也有显示不正常的,例如unix就是不能全正确的显示来。
所以不同操作系统都有不同的字体系统,但既然是字体,总有一些比较经典特殊常用的字体共同存在于各个系统中。例如无衬线的 Arial 字体,它产生和使用的时间比较早,同时在价格这块交低廉,所以从早期就被 windows 操作系统使用,在其他的操作系统中,也会有较好的不同于默认字体的显示效果,需要使用的用户可以自行安装。
网站建设中字体大小的选择是用户体验中的一个重要部分,过大过小都会影响用户体验。在制作网页的时候,我们可以根据文字在网页中的不同位置和不同等级来分别使用不同大小的字体。相对来说,内容标题可以使用较大的字体,而内容小标题可以采用次一号的字体,而内容正文则可以采用正常大小的字体。
在CSS中,较常用的描述字体大小的单位有两个,即em和px。通常认为em为相对大小单位,而px为大小单位。但从实际应用中来讲,px像素有时也像是一种相对大小单位。比如,在一块15寸分辨率为800×600像素的屏幕上,10px大小的文字,要比一块10寸分辨率1024×768像素的屏幕上的10px大小的文字显得更大一些。px为像素单位,20px表示20个像素大小,在现在的网页设计中,常被用来表示字体大小,方便且直观。比如12px,14px就是用px作为字体大小,而16px为中等字体,18px为较大字体,12px为偏小字体。em为相对大小单位,它表示的字体大小不固定,根据基础字体大小进行相对大小的处理。浏览器默认的字体大小为 16px,如果一段文字指定1em,那么就是代表16px大小,而2em就是32px大小。相对大小单位有很广泛的用途,由于它的相对性,对跨平台跨设备的字体大小处理上很有优势,只是无法直观的看到大小。
网页设计中较常用的英文字体
Sans-serif
Helvetica: 被评为设计师较爱的字体,Realist风格,简洁现代的线条,非常受到追捧。在Mac下面被认为是较佳的网页字体,在Windows下由于Hinting的原因显示很糟糕。
Arial: Helvetica的「克隆」,和Helvetica非常像,细节上比如R和G有小小差别。如果字号太小,文字太多,看起来会有些累眼。Win和Mac显示都正常
Lucida Family: Lucida Grande是Mac OS UI的标准字体,属于humanist风格,稍微活泼一点。Mac下的显示要比Win下好。
Verdana: 专门为了屏显而设计的字体,humanist风格,在小字号下仍可以清楚显示,但是字体细节缺失严重,较好别做标题。
Tahoma: 也是humanist风格,字体和Verdana有点像,但是略窄一些,counter略小,曾经是Windows的标准字体,Mac 10.5之后默认也有安装。
Trebuchet MS: 为微软设计的一个humanist风格字体,个人觉得个性太过突出,用得不好会不搭。
Verdana,是一套无衬线字体,由于它在小字上仍有结构清晰端整、阅读辨识容易等高品质的表现,因而在1996年推出后即迅为许多领域所爱用的标准字型之*。
Serif
Georgia: 基本上适合正文屏显的衬线字体,非Georgia莫属了。笔画粗重,衬线明线,轮廓较大,小字体显示也很清晰,同时细节还算OK。
Times: Times是为了报纸而设计的,特点是可以在有限的空间塞进去更多的文字,笔画较弱,小字号正文屏显看起来累眼。曾经Engadget改版的时候用了Times作为正文,被骂得很惨之后换成了Georgia。
有些偏艺术类的网站的大字会使用lobster。更艺术的网站就搜索free font,或者font freebie吧,出现的名字格式为“X种免费网页设计字体”的博客文章,都进去看一眼,挑一个就好。
Trebuchet、Georgia、Times New Roman、Arial、Lucida等字体在26px或更大像素时效果是比较好的,非常适合作为正文的标题。
更多培训课程,学习资讯,课程优惠等学校信息,请进入 南京天琥教育 网站详细了解,免费咨询电话:400-998-6158