网页设计中字体的应用范文

本站小编为你精心准备了网页设计中字体的应用参考范文，愿这些范文能点燃您思维的火花，激发您的写作灵感。欢迎深入阅读并收藏。

摘要：

本文介绍了字体的五种分类，分别从创意性和实用性两方面总结了网页设计中字体选择和排版的经验，为网页设计的学习者和工作者提供一定的参考价值。

关键词：

网页设计；字体；创意性；实用性

我们在做网页平面设计时一般考虑三个大的方面，一是颜色的搭配要符合网站的风格，二是整体的布局要合理规划，三就是文字的排版。实际上文字的排版是非常重要也是非常体现网站视觉水平的一大部分。早在2006年，OliverReichenstein写了一篇名为《WebDesignis95%Typography》[1]的文章用来阐述文字排版对网站设计的重要性，甚至可以说文字本身就是一种完整高效的交互设计。关于这点，许多优秀的网站做出了范例，比如：AWorkingLibrary、BlackAllenDesign还有IA公司（最受欢迎的写作软件公司）的网站设计都是杰出的例子。

1、字体的分类

当前有成千上万种字体，每天还会产生更多，大致可以分为以下六种：Oldstyle：基于手写体创建，Oldstyle字体都有截线并且小写字母截线都有角度，所有曲线笔画都有从粗到戏的过渡变化，粗细变化平缓，这种字体基本上没有什么显著的特征，不会影响人们的注意力，所以如果设计时需要的是阅读者专注于文字本身，可以考虑使用Oldstyle字体。常用的典型Oldstyle字体有TimesNewRoman、Garamond等。

Modern：有截线但是是水平的而且非常细，笔画粗细对比非常明显，不符合手写的规律，强调线完全垂直，外观很醒目，特别是设置得非常大的时候给人一种冷酷高雅的感觉，这种字体不适合做正文，只适合做标题。经典的Modern字体包括Didot（Vogue杂志用logo）、Bodoni等。Slabserf：最开始制作广告的人热衷于Modern字体，并把粗线设置得更粗，后来为了解决看上去像栅栏一样的问题，将整个字体都加粗，这就出现了粗线对比小很多的Slabserf字体，该字体可读性较好可以显示大量文本，但是设置成这种字体后页面较暗，由于它简洁直观经常用在儿童读物中。典型的字体包括Clarendon、black等。sansserif：无截线字体。Sans在法语中含义是“没有”，所以sans-serif是没有截线的意思，也就是整体笔画整体光滑无棱角，无粗细过渡，该字体给人感觉很亲切友好，比如google主页也将标志也将原有的截线字体改为无截线字体。典型的sans-serif英文字体包括Arial、bold等，中文字体中，微软雅黑、幼圆等都是这类字体。比较适合用在网页中文字较多部分，让浏览者获取大量信息而不至疲劳。

Script：手写字体。这类字体特点很明显，一看就是手写风格，Script字体就像奶油要少用，多用觉得腻，不能将网页中的大段文字设置成手写体，而且绝对不能全部设置成大写。典型的英文通常用SegoeScript，中文的话，行书系列、草书系列的字体等，都可以算作手写字体。Decorative：装饰字体。有趣也很特别，可以表达鲜明的情绪，也不能多用，否则让人感觉不上档次。无法对其的大小、形状下一个统一的定论，所以没有典型字体，在网页中通常很少用到，除非有特殊的创意性设计。

2、字体选择的创意性

文字的版式设计，不仅仅局限于信息传达上的概念，更是一种高尚的艺术表现形式和情感的表达。为了能让文字的编排风格和画面主题保持一致选择何种字体以及几款字体的组合我们都要多做比较和尝试。在字体选择上我们从创意性和实用性两方面来考虑。创意性在于怎样选择字体可以使得文字和主题更好搭配，甚至文字能进一步突出主题，表达网站的目的，为此本文总结了几种不同字体的试用范围供大家参考。

1）中文字体－黑体。包括但不局限微软雅黑、方正兰亭黑体、蒙特简黑、造字工房黑体。此种黑体的艺术风格为：方正、简洁、醒目。试用范围：粗黑体字强壮有力有男性特点，适合汽车、手表、建筑、打斗等内容，可作为标题。细黑体字高雅细致，有女性特点，适合服装、化妆品、食品等行业内容，也可作为正文使用。

2）中文字体－宋体。包括但不局限于方正书宋、方正标宋、方正宋黑、创意简标松、造字工房尚雅宋体。它的艺术风格为端庄、典雅、清正、秀丽。适用范围为政府行业、文化艺术等。根据实际情况运用于时尚类设计、饮食文化、养生生活等。

3）中文字体－幼圆。包括有方正准圆简体、方正细园简体、造字工房悦圆体和造字工房雅圆体等。艺术风格细长细腻，不太适合用在比较严肃和正式的场合。

4）中文字体－书法体。包括方正楷体、方正隶书、方正魏碑简体、叶根友毛笔行书等。此字体书法韵味浓厚，带有书卷味、古色古香。适用于中国风页面，不适合大篇幅使用。

5）英文字体－无截线字体。包括Arial、Tahoma、Helvetica等。这种字体给人一种简单、现代化、休闲轻松的感觉。适用于扁平化设计，也适合搭配任何设计项目，包括banner、平面设计以及网页字体等。

6）英文字体－modern字体。包括Didot、TheTimesnewroman、Georgia等。此种字体风格优雅又精致，可用于电影海报、游戏、时尚类网页设计中。

7）英文字体－vv手写英文字体。有Exmouth、Italianno等。此种字体飘逸优雅，适用于珠宝、服饰类网站，还可以用于制作一些精美的贺卡、邀请函、婚礼请柬等。

3、字体选择的实用性

网页设计中在Banner窗口可以使用一些很有个性的字体，在正文部分要避免使用那些有个性的字体，因为访客的终端上很可能没有安装那些特殊字体，那样会导致内容无法显示，所以英文常用的字体也就是TimesNewRoman、Arial和Verdana。在使用中文字体时基本上选择Windows系统自带的，包括宋体、楷体或者幼圆，微软雅黑都是可以的。字体样式选择建议：整个版式选择两到三种字体为最佳效果，否则会有凌乱感破坏整体效果。一般来说粗字体作标题，细体字作正文。

1）字体的大小选择在英文网站字体大小选择上，一般由于英文字母相对汉字来说较简单，即使是小字体也能显得很清晰明了，所以大部分英文网站的主要部分都是选择较小的字体。中文网页不能照搬那样的设计，由于字体的复杂度，通常字体大小在10px以下是看不清的，一般要达到11px及以上才有不错的显示效果。从现有的中文网站分析，12px和14px大小的宋体结合使用在阅读性和外观上是最好的。比10px再小，可阅读性和美观性都没有了。比14px再大，可阅读性好，但是不够美观。字体大小的选择建议：英文网站字体大小可以选择10px，11px，12px等字体大小，中文网站字体大小可以选择12px，14px，16px等字体大小。

2）字体的颜色选择字体的颜色的选择对整个网页的风格影响很大，正文内容部分一般会使用黑色，给人中立的感觉。红色或者黄色等暖色调能很快吸引访客的目光，产生热情、兴奋等刺激感，多用在特价、食物等广告中。而蓝色、灰色等冷色调则给人职业、科技、商务等感觉，多用在机械、风景等页面中。

3）字体其他的特性选择除了以上概括的网页字体样式，大小，颜色外，当然字体还可以设置其他的各种特性比如斜体、粗体、下划线，对齐方式等。字体选择是一种很直接、感性的行为。无论选择什么字体，都要把握网页的总体风格满足访客的需要。比如粗体字强壮有力具有男性特点，适合机械、科技、建筑业等内容；细体字典雅华贵偏向女性特质，更适合化妆品、服装、时尚等行业的内容。同一页面中，如果字体种类少，就会显得版面雅致有稳定感；如果字体种类多，则版面活泼丰富多彩。关键是如何根据页面想要表达的内容来控制比例关系。

4、结束语

网页设计不仅仅是一种技术，更是一种艺术，其中如何选择字体，如何排版文字是非常重要的一个部分。只有正确的使用了字体才能让浏览者感受到其中要传达出的内涵与情感，获得设计者想要表达的信息。

参考文献

[1]OliverReichenstein.WebDesignis95%Typography[J],UIdesign,2006(10):56-60

[2]张岩.网页设计中扁平化设计的趋势[J],美术大观,2014,(5):132-133.

[3]邓美玲,李丹.Photoshop在网页设计中的作用[J],电子技术与软件工程,2015,(04):110-110.

[4]张璐.关于网站网页设计中的视觉元素分析[J],科技风,2014(14):48-49.

[5]刘莎.网页设计中字体设计分析[J],网友世界,2013(22):12-13

[6]李玉荣.浅谈网页设计中的文字设计[J],科技创新与应用,2015,(09):65-65.

作者：周倩 单位：长沙商贸旅游职业技术学院