论文部分内容阅读
摘要：web2.0时代到来，博客、微博等自媒体以文字为主要信息载体，给用户的使用体验和设计者的思路都产生新的冲击，可以说，文字的复兴是网页设计图形化的另一平行进步。本文通过分析主流、热门网站的文本设计，试图梳理优秀文本设计的特征，并对糟糕的文本设计提出修改方案，总结出适用于网页设计的文本的规则，分析近年来文本在网页设计中的地位从辅助性文字走向设计主题的变化，最后通过网站建设实践总结文本的复兴还能给设计带来哪些新的启迪。
关键词：网页文本；交互设计；视觉设计
中图分类号：G623.58？摇 文献标志码：A 文章编号：1674-9324（2013）48-0226-02
国际电信联盟（ITU）发布的最新报告显示，截至2009年底，全球大约26%的人使用互联网，同时在移动技术蓬勃发展的推动下，今年全球移动上网的用户数量有望达到50亿。伴随着互联网用户的爆炸式增长，网页设计视觉化也在技术的革新下不断增强。从1990年初的基本文本编辑的网页开始，1990年中期背景图片和切片技术的引入丰富了网页图像。上世纪90年代末崛起的flash，加大视觉效果冲击，从简单的图像变成动态的视频表现。再到2000年后CSS和Javascript的崛起，网页的视觉效应进一步增强，直到现在进入web 2.0时代鼎盛时期[1]。由此我们可以看出，网页设计由于技术革新的支持，其图像化趋势一直在加强。然而物极必反，盛极必衰。近些年来，由于博客、微博、搜索及各类SNS社会化平台逐渐成为热门应用，人们用文字传递信息的机会越来越多。设计中对文字的比重倾斜有两大好处，其一文字传递丰富的信息，文字传播的版面更清晰直观，运用文字对网页“注入情感”，使得交互的过程更为亲切；其二以文字为基础视觉特点为网页设计找到了新的切入点，加之从用户角度出发的科学设计观念的指导，使得更专业的视觉设计风格最终因能被用户所接受而广泛地传播开来，而这些风格也很大程度上取决于对文字的各方面的考虑和设计[2]。
一、互联网文本设计微观分析
为了避免一个平淡乏味的页面，通常使用文本和图像形成对比的背景。文字简洁直接，信息量大。文字准确地传达受众所需要的信息，并告诉浏览者这个网站是做什么的。如果图片在一个网页上占据的部分太大，导致使用者第一眼获取的信息量有限，不免会有枯燥乏味之感。据统计，网站使用者通常只用短短5秒来判断是否留在这个网页，或者点击下一个链接，甚至直接离开网站。
1.图形太多导致的灾难。在一个视觉创意的网站中，视频的部分占据了主导。左上方logo，中间主要部分是不断更新的视频，展示业界动态，左边是企业logo组成的一长串链接，这一系列的图像信息导致这网页图片和视频块头太大，信息量过少。解决这个问题最直接的办法，就是缩小视频的窗口大小。为了照顾一部分精彩视频画面的质量，可设置交互按钮，留下高清链接，保证满足对视频有高品质观看要求的用户需要。
2.中立的文字赢得信服。补充精当的文字，对于一个有很多话想对浏览者说的网站非常重要。网站关于文字的处理往往都会让其比较带有“陈述性”的色彩，或者经由用户、舆论领袖等第三方口中讲出来，因为不切实际的信息传递在当前的网络形势下显得不受欢迎，带“陈述性”的设计能让页面的“情绪”看起来比较平缓，对产生页面亲和力是有帮助的。美丽说，是聚合上传网上淘宝心得图片的网站。在整个流程中，网站以图片瀑布流的形式吸引感性的女性受众，在话语上，用户评论对产品推介提起口碑传播的效果，网站保持中立的电子商务媒介位置。
3.简洁的文字提高阅读效率。简洁就是使用最少的文字传达最准确的信息，不重复、不啰嗦，能用三个字表达清楚就不用五个字，比如板块文字“日志”比“我的日志”简洁，博客是比较私人化的产品，一般不存在多人共用的情景。文字内容太多，虽然说明非常详细，但用户要有一定有耐心去仔细阅读，用户希望得到想要的结果，而不是大段的文字解释，有必要让用户在最短的时间内获取信息。如果一个网站需要用户阅读大量的文字，才能使用，那么一定是导航出现问题。提升文本可读性的关键之一，就是让每行文本承载合适的字数。这不仅仅是设计一下文本宽度的问题，它也应该是一个易读性的问题。文本最佳长度是每行承载50～60字符，包括空格[3]。也有其他资料建议不超过75字/行也可以接受。如果一行里文字太多，我们用眼睛很难长时间聚焦文本。由于文本的长度过长会让浏览者很难注意到文字的起点和终点。如果每行中文字太少，眼睛也要不停的来回扫视，也会破坏浏览者的阅读节奏。同时，每行文本太短也会让人觉得紧张，这行没看完就跳到下一行去了，很可能一些重要的词会被跳过。因此在每一行的开头，读者的精力都很集中，为了避免文本过长或过短所带来的弊端，同时又能持续的激励读者，我们建议把每行承载的文本量控制在35～45个汉字。
4.在视觉上应给人以美感。在视觉传达的过程中，文字作为画面的形象要素之一，具有传达感情的功能，因而它必须具有视觉上的美感，能够给人以美的感受。字型设计良好，组合巧妙的文字能使人感到愉快，留下美好的印象，从而获得良好的心理反应。文本可以稍微口语化，如“立即注册找好友”比“账号注册”更好。使用鼓励式的语气，表达用户可以用网站做什么，而不是要求用户做什么。比如，使用“下载客户端：省时间，省流量，多积分”，而不是简单的“下载客户端”。好的设计可以深深赢得用户的信任。从基础设计就开始的，例如，界面确保高效和专业、动作容易撤销、广告被明确识别、术语的一致性以及令用户惊喜而非惊诧。产品在有危险的时候会警告用户，比如不安全的链接等。人性化的文字会给用户带来第一时间的信任感。
二、文本丰富网页视觉效果
1.文字成为设计的重点。对hotmail和msn网站的多次改版对比中，我们可以看出文字在版面中的作用日益显著。比如早期hotmail的版面中，并没有把文字与图片各自的属性进行区分，文字的作用也被逐渐弱化[4]。但如今我们已经看到，新版的界面中，文字已经成为支撑视觉框架的主要来源，各版块中的文字设计及广告条、提示框、登录框及页脚的版权信息等内容的合理编排，使得软件的界面更加清晰直观。最新版本的msn软件的主界面也是如出一辙，首先msn界面的进行了大胆的创新，带给使用者强有力的视觉印象，在内容呈现方面，也从过去的紧张、繁杂，饱和的界面布局中摆脱出来。通过以上的对比我们可以发现，文字在视觉设计工作中所占的权重比以往有了较大的提高，而且成为了版面中不可或缺的元素之一。
2.字体的设计理论。很多设计师更愿意把文字当做设计的切入点，提高文字的可读性，强调页面文字的位置是否符合整体要求，在视觉上是否给人以美感，设计是否具有创造性等。在内容区域方面，样式 版式的设计方法也逐渐被人们所认同并开始流行。通过平衡的结构、疏密的节奏、色调的明暗、合适的间距的控制来形成页面视觉框架，再用适当的图形元素与之搭配后使页面产生美感。例如，许多网站用Tag标记提供网站入口，通过颜色字体字号的修饰，突出关键词的流行程度，醒目且动感时尚。
文本在设计中比重的提升，是互联网设计者对内容的尊重，人性化的文字让用户的使用过程更加亲切，同时文本设计的重视也给设计者的设计概念开辟新的思路，是设计更加多元化。通过设计更加符合用户阅读习惯增强了网站与用户的互动性，中立的文字增强了网站的说服力，简洁的文字降低了对用户注意力的要求。在平面媒体文字的要求上，进一步观察网联网文字的设置，网络时代文字传播的规律让信息传播更加畅通无限。
参考文献：
[1]奥斯汀·豪.设计师不读书[M].一熙，译.重庆：重庆大学出版社，2010：124-125.
[2]Robin Williams/John Tollett.写给大家看的Web设计书[M].苏金国，刘亮，译.第三版.人民邮电出版社，2010：232-233.
[3]UCD翻译小组.优化文本获得最佳长度？摇提升可读性与易读性[EB/OL].http：//www.3lian.com/edu/2011/12-03/17086.html，2011-12-03.
[4]文本的权重变化与设计重心的转移[.EB/OL].http：//www.yindaoxian.com/html/web/HTML_Xhtml-13130.html，2010-04-05.
关键词：网页文本；交互设计；视觉设计
中图分类号：G623.58？摇 文献标志码：A 文章编号：1674-9324（2013）48-0226-02
国际电信联盟（ITU）发布的最新报告显示，截至2009年底，全球大约26%的人使用互联网，同时在移动技术蓬勃发展的推动下，今年全球移动上网的用户数量有望达到50亿。伴随着互联网用户的爆炸式增长，网页设计视觉化也在技术的革新下不断增强。从1990年初的基本文本编辑的网页开始，1990年中期背景图片和切片技术的引入丰富了网页图像。上世纪90年代末崛起的flash，加大视觉效果冲击，从简单的图像变成动态的视频表现。再到2000年后CSS和Javascript的崛起，网页的视觉效应进一步增强，直到现在进入web 2.0时代鼎盛时期[1]。由此我们可以看出，网页设计由于技术革新的支持，其图像化趋势一直在加强。然而物极必反，盛极必衰。近些年来，由于博客、微博、搜索及各类SNS社会化平台逐渐成为热门应用，人们用文字传递信息的机会越来越多。设计中对文字的比重倾斜有两大好处，其一文字传递丰富的信息，文字传播的版面更清晰直观，运用文字对网页“注入情感”，使得交互的过程更为亲切；其二以文字为基础视觉特点为网页设计找到了新的切入点，加之从用户角度出发的科学设计观念的指导，使得更专业的视觉设计风格最终因能被用户所接受而广泛地传播开来，而这些风格也很大程度上取决于对文字的各方面的考虑和设计[2]。
一、互联网文本设计微观分析
为了避免一个平淡乏味的页面，通常使用文本和图像形成对比的背景。文字简洁直接，信息量大。文字准确地传达受众所需要的信息，并告诉浏览者这个网站是做什么的。如果图片在一个网页上占据的部分太大，导致使用者第一眼获取的信息量有限，不免会有枯燥乏味之感。据统计，网站使用者通常只用短短5秒来判断是否留在这个网页，或者点击下一个链接，甚至直接离开网站。
1.图形太多导致的灾难。在一个视觉创意的网站中，视频的部分占据了主导。左上方logo，中间主要部分是不断更新的视频，展示业界动态，左边是企业logo组成的一长串链接，这一系列的图像信息导致这网页图片和视频块头太大，信息量过少。解决这个问题最直接的办法，就是缩小视频的窗口大小。为了照顾一部分精彩视频画面的质量，可设置交互按钮，留下高清链接，保证满足对视频有高品质观看要求的用户需要。
2.中立的文字赢得信服。补充精当的文字，对于一个有很多话想对浏览者说的网站非常重要。网站关于文字的处理往往都会让其比较带有“陈述性”的色彩，或者经由用户、舆论领袖等第三方口中讲出来，因为不切实际的信息传递在当前的网络形势下显得不受欢迎，带“陈述性”的设计能让页面的“情绪”看起来比较平缓，对产生页面亲和力是有帮助的。美丽说，是聚合上传网上淘宝心得图片的网站。在整个流程中，网站以图片瀑布流的形式吸引感性的女性受众，在话语上，用户评论对产品推介提起口碑传播的效果，网站保持中立的电子商务媒介位置。
3.简洁的文字提高阅读效率。简洁就是使用最少的文字传达最准确的信息，不重复、不啰嗦，能用三个字表达清楚就不用五个字，比如板块文字“日志”比“我的日志”简洁，博客是比较私人化的产品，一般不存在多人共用的情景。文字内容太多，虽然说明非常详细，但用户要有一定有耐心去仔细阅读，用户希望得到想要的结果，而不是大段的文字解释，有必要让用户在最短的时间内获取信息。如果一个网站需要用户阅读大量的文字，才能使用，那么一定是导航出现问题。提升文本可读性的关键之一，就是让每行文本承载合适的字数。这不仅仅是设计一下文本宽度的问题，它也应该是一个易读性的问题。文本最佳长度是每行承载50～60字符，包括空格[3]。也有其他资料建议不超过75字/行也可以接受。如果一行里文字太多，我们用眼睛很难长时间聚焦文本。由于文本的长度过长会让浏览者很难注意到文字的起点和终点。如果每行中文字太少，眼睛也要不停的来回扫视，也会破坏浏览者的阅读节奏。同时，每行文本太短也会让人觉得紧张，这行没看完就跳到下一行去了，很可能一些重要的词会被跳过。因此在每一行的开头，读者的精力都很集中，为了避免文本过长或过短所带来的弊端，同时又能持续的激励读者，我们建议把每行承载的文本量控制在35～45个汉字。
4.在视觉上应给人以美感。在视觉传达的过程中，文字作为画面的形象要素之一，具有传达感情的功能，因而它必须具有视觉上的美感，能够给人以美的感受。字型设计良好，组合巧妙的文字能使人感到愉快，留下美好的印象，从而获得良好的心理反应。文本可以稍微口语化，如“立即注册找好友”比“账号注册”更好。使用鼓励式的语气，表达用户可以用网站做什么，而不是要求用户做什么。比如，使用“下载客户端：省时间，省流量，多积分”，而不是简单的“下载客户端”。好的设计可以深深赢得用户的信任。从基础设计就开始的，例如，界面确保高效和专业、动作容易撤销、广告被明确识别、术语的一致性以及令用户惊喜而非惊诧。产品在有危险的时候会警告用户，比如不安全的链接等。人性化的文字会给用户带来第一时间的信任感。
二、文本丰富网页视觉效果
1.文字成为设计的重点。对hotmail和msn网站的多次改版对比中，我们可以看出文字在版面中的作用日益显著。比如早期hotmail的版面中，并没有把文字与图片各自的属性进行区分，文字的作用也被逐渐弱化[4]。但如今我们已经看到，新版的界面中，文字已经成为支撑视觉框架的主要来源，各版块中的文字设计及广告条、提示框、登录框及页脚的版权信息等内容的合理编排，使得软件的界面更加清晰直观。最新版本的msn软件的主界面也是如出一辙，首先msn界面的进行了大胆的创新，带给使用者强有力的视觉印象，在内容呈现方面，也从过去的紧张、繁杂，饱和的界面布局中摆脱出来。通过以上的对比我们可以发现，文字在视觉设计工作中所占的权重比以往有了较大的提高，而且成为了版面中不可或缺的元素之一。
2.字体的设计理论。很多设计师更愿意把文字当做设计的切入点，提高文字的可读性，强调页面文字的位置是否符合整体要求，在视觉上是否给人以美感，设计是否具有创造性等。在内容区域方面，样式 版式的设计方法也逐渐被人们所认同并开始流行。通过平衡的结构、疏密的节奏、色调的明暗、合适的间距的控制来形成页面视觉框架，再用适当的图形元素与之搭配后使页面产生美感。例如，许多网站用Tag标记提供网站入口，通过颜色字体字号的修饰，突出关键词的流行程度，醒目且动感时尚。
文本在设计中比重的提升，是互联网设计者对内容的尊重，人性化的文字让用户的使用过程更加亲切，同时文本设计的重视也给设计者的设计概念开辟新的思路，是设计更加多元化。通过设计更加符合用户阅读习惯增强了网站与用户的互动性，中立的文字增强了网站的说服力，简洁的文字降低了对用户注意力的要求。在平面媒体文字的要求上，进一步观察网联网文字的设置，网络时代文字传播的规律让信息传播更加畅通无限。
参考文献：
[1]奥斯汀·豪.设计师不读书[M].一熙，译.重庆：重庆大学出版社，2010：124-125.
[2]Robin Williams/John Tollett.写给大家看的Web设计书[M].苏金国，刘亮，译.第三版.人民邮电出版社，2010：232-233.
[3]UCD翻译小组.优化文本获得最佳长度？摇提升可读性与易读性[EB/OL].http：//www.3lian.com/edu/2011/12-03/17086.html，2011-12-03.
[4]文本的权重变化与设计重心的转移[.EB/OL].http：//www.yindaoxian.com/html/web/HTML_Xhtml-13130.html，2010-04-05.