字体设计规范
作者:优漫动游设计部 2023-08-07 17:14 查看: 229

  对于内容描述性的网页及网页模块,最重要的内容,就是文字。出现了文字,就会出现文字排版、字体选择、字体颜色大小粗细等细节。而这些细节,往往是非常重要的细节。不同的字体和选色往往对整个页面都有着非常大的影响,这是我在自己进行页面设计中感受很深的一点。


字体设计规范



  一、设计要点

  1.字体样式不能太繁复,避免显得页面太过杂乱。

  2.使用的字体应该容易识别,而且最好是通用字体这样可以避免在不同浏览器上显示的效果与设计差异过大。

  3.字体样式和应该与整个页面的主氛围相匹配。

  二、字体和字号的选用

  1、字体的选用:

  网页字体的使用一般选择宋体等比较常用的字体。不要出现生僻字体,防止用户因没安装对应字体造成显示错误。在网页中Arial就是一种字体的名称,默认的浏览器定义的标准字体是中文宋体和英文timesnewRoma字体。如果你没有设置任何字体,网页将以这两种标准字体显示。同时,这两种字体也可以在任何操作系统和浏览器里正确显示。

  windows另外自带了40多种英文字体和5种中文字体。这些字体,你也可以在网页里自由使用和设置。凡是使用windows操作系统的浏览器都可以正确显示这些字体,但在其它操作系统里,如unix则不能完全正确显示。

  网页字体的样式一共有四种:正常体(regular),斜体(Italic),粗体(Bold),粗斜体(BoldItalic)。

  如果需要用到少量特殊样式的字体,最好用形式去表示。这样可以保证设计效果与实际效果相同。

  2、字号的选择

  系统默认,通常采用12px作为网页正文的标准字体大小。较长文章的话12号字可能会显得太密集,可以根据情况改成14px。12px。而用16px显示中等字体,18px显示较大字体。

  三、常用字体颜色

  在界面中的文字分为三个层级,主文、副文、提示文案等。

  在白色的背景下,字体的颜色层次其实就是黑、深灰、灰色。

  常用的色值是#333333;#666666;#999999

  总之选的字体色彩应该朴素平常,不能太跳脱。

 四、常用安全字体

  1、微软雅黑

  微软雅黑系列:在网页设计中这款字体使用的非常平凡,这款只无论是放大还是缩小,形体都非常的规整舒服。在设计过程中建议多使用雅黑,大标题用加粗字体,正文用常规字体。

  2、方正正中黑系列:中黑系列的字体笔画比较锐利而浑厚,一般运用在标题文字中。但这种字体不适用于正文中,因为边缘相对比较的复杂,文字一多会影响用户的阅读。

  3、方正兰亭系列:整个兰亭系列的字体有大黑、准黑、纤黑、超细黑等。因笔画清晰简洁,这个系类的字体就足以满足排版设计的需要。可以通过对这个系列的不同字体进行组合,不仅能保证字体的统一感,还能很好的区分出文本的层次。

  4、Arial

  微软公司的网页核心字体之一,最常用的sansserif字体,当字号很小时不容易阅读。但是,大写的“I”和小写的“l”是无法区别的,你可以考虑用Tahoma字体来替代。

  (苹果系统没有这种字体,但有一种对应于Arial的字体叫Helvetica,它是MAC机上与Arial字体最相似的WEB字体,是别一种非衬线字体.它是一种性能优良的打印字体,但在屏幕上表现不是很好,说道Helvetica字体,昨天发现了很多有意思的站点,主要是纪念Helvetica字体诞生50年而设的。)

  5、Verdana

  微软公司的网页核心字体之一,微软公司专门为屏幕显示而开发的。应用广泛。易于阅读。是显示器中最清晰的字体,即使字号很小,也很容易阅读。半肥猫比较喜欢采用10PX的Verdana来做英文正文字体,也推荐大家使用,但字号最好介于10~14像素之间,超出这个范围就不好看了。

  6、TimesNewRoman

  微软公司的网页核心字体之一,可能是最常用的serif字体,是网站浏览器默认的字体,12pt以上的字体容易阅读,但小字号的字体易读性差。(苹果系统没有这个字体,有一个对应于TimesNewRoman的字体叫Times)

  广州UI设计培训,系统学习,融会贯通,直奔主流技术,节省时间,老师督促指导,学习效率高,随堂练习,及时解决问题,企业IT大牛指导实战落地项目,与企业需求无缝连接,签订就业协议,诸多合作名企,4个月后直接走向工作岗位,避免工作后的水土不服。高薪名企有增加!了解详情请登陆广州UI设计培训官网
预约申请试听课
填写下面表单即可预约申请试听!怕钱不够?可就业挣钱后再付学费! 怕学不会?助教全程陪读,随时解惑! 担心就业?一地学习,可全国推荐就业!
IT培训问答
开班时间

微信客服