web端网页视觉疲劳分析

    本篇论文目录导航：

【题目】视觉传达设计中视觉疲劳问题探析 
【第一章】基于视觉疲劳的视觉传达优化设计探究绪论 
【第二章】视觉的解说 
【3.1】视觉的色彩疲劳 
【3.2】视觉的形象疲劳 
【3.3  3.4】视觉的心理疲劳 
【4.1】web端网页视觉疲劳分析 
【4.2】移动端手机界面视觉疲劳分析 
【4.3  4.4】传统视觉传达设计领域视觉疲劳分析 
【第五章】视觉传达设计领域缓解视觉疲劳的方法 
【第六章】眼与心的互动-寻找视觉舒适感与设计的平衡 
【结论/参考文献】视觉传达中缓解视觉疲劳的设计研究结论与参考文献

　　第 4 章 视觉传达设计中的视觉疲劳现象分析

　　4.1 web 端网页视觉疲劳分析

　　数字化时代的来临，生活节奏的加快，科技的进步，新媒体媒介已然步入我们的生活。电脑终端媒介的视觉传达表象也值得我们分析思考。

　　4.1.1 网页中的阅读疲劳

　　视觉疲劳的产生，在电脑终端的反应尤为显着。随着科技生活的发展，电脑已经是我们工作生活中的主要组成部分。计算机屏幕、电子书等与纸质印刷品的阅读体验是不同的，电子阅读比纸质阅读更难。电脑屏幕的影像是不稳定的，页面信息时常刷新，而且屏幕也在发光。我们无时不刻不在用眼睛面对着这些莹莹发光的显示器设备。目前，很多时候不论是阅读文件、浏览新闻还是欣赏文献，大部分都需要在电脑上进行，这就对电脑设备上的网页设计，提出了很高的要求，不仅要结合视觉，亦要考虑人们的心理因素。不良的网页设计效果，严重影响阅读速度，还会造成眼酸、眼涩等视觉疲劳感。与此同时，亦会造成使用者的心理烦躁感。人眼观看屏幕的时候会保持一定的距离，保持这样的状态一段时间后，眼睛会出现突然紧张的状况，这时，眼睛的使用达到了一个极限，突然放弃了观感，眼睛从紧张变为松弛，瞬间松懈下来之后，就会造成一定的视力模糊，从而造成视觉疲劳。

　　在网页中的阅读疲劳因素有视觉因素和非视觉因素。在阅读的过程中客观的视觉因素起了一定的影响作用。诸如：网页的排版、字体的大小、字体字号、文字与底色的对比关系等等。字体过大或过小都容易造成人的阅读疲劳，但有时也是因人而异。老年人的眼状况已经和普通年轻人不同，年龄导致的老花眼、青光眼等，适用于他们的字体字号需额外调整。在网页设计中，中文文字正文应该不小于 8 磅，英文字体则不小于 6 磅，过小就很不容易看清楚。在显示器设备上，文字字体的选择上没有特定的规则，根据美感即可。内文字体在注意大小字号之外，还要注意像素块的问题，字号小于 12 磅时，可用无衬线字体，不必修掉边缘的锯齿状。在小一点的字体上，衬线和修边会让字体模糊，影响识别的清晰度。

　　中文字体同理，但是都需要消除锯齿，以免在网页上显示模糊（图 39）。修边文字看起来较平滑，因为在文字颜色和背景颜色之间增加了像素。锯齿文字看起来凹凸不平，因为没有过度像素。在网页背景的选择上也要注意，浅色背景深色文字比较讨喜。高反差、深色背景反白字，在视觉上会渗到背景里，大大降低文字的辨别性。

　　比较大型的国内门户网站都有信息过多，排列过密的缺点。例如搜狐、新浪这样的门户网站，页面主次不清、通篇文字居多。笔者选择一个比较有对比性的网站进行分析。让我们来看看阅读大类的新闻类网站，我挑选了当下比较热门的几大互联网网站旗下的新闻门户：百度新闻、腾讯新闻、搜狐新闻、网易新闻、凤凰新闻。人们观看屏幕时一般不会注意到网站边缘，如果是有从左到右的书写习惯的话，一般是先看屏幕的左上方，并不是从顶部开始阅读的，更是由于使用网页的视觉经验，早已习惯认定网页顶部是无关内容，诸如标志、导航、留白或者是广告。所以在新闻门户的上方出现广告的问题，虽然影响视觉感受，但是我们也不予置评，因为这也是中国的国情决定的。

　　现在我们来看凤凰网（图 40），过密的导航分布将近占到第一屏幕的二分之一，而其中广告位占在了主屏的三分之一中心位置，当人们第一眼看到主屏就不得不分心看到广告。广告的红色条框和红色字体又和凤凰网整体绿灰色调的字体形成了对比，更加吸引人的眼球。左边的小广告和右边的二维码形成了视觉上的小杂音，使人余光可以看得到它们，造成了小小的视觉影响。主体字体颜色选择上，选用灰绿色和蓝色，其实是为网页起到了降噪的效果，但是在网页阅读中不能忘记的一点是，为了保证网页的阅读性，应该增强文字与底色的对比度，研究表明白底黑字在网页中是最清晰易读的。如果是类似小说或大面积阅读，长时间阅读时，可以考虑减弱对比度，实际是减低底色的反光度，前文理论中介绍过，明度越高的颜色反光度越高，易造成视觉疲劳。凤凰网主要新闻信息分三栏的设置，将头条文字放在中间，用字体大小区分要闻和散闻，可是区分并不明显，整列文字主次不清，其主要原因是主题只加粗没有放大，而其他标题又没有缩小，同时行距也没有拉开。三段式分栏中间大字，还好把人的视觉吸引到了，但是左侧小分栏不由的被忽略了，在网页中变得无足轻重。总体来讲凤凰新闻网视觉信息结构复杂，视觉呈现效果模棱两可，易引起人的视觉疲劳。

　　我们再来看网易新闻（图 41），最顶有一条重色压住整个网页，给人以引领感。一条主导航和一条新闻导航，主次清晰。上方广告在鼠标滑动浏览时即消失。

　　左右两边有两个窄细的广告条，只有鼠标经过时才会展开，鼠标移开就自动闭合成一竖条。直接把头条信息放在左边，十分符合人的用眼习惯，主题目和小字介绍大小对比非常清晰，一眼明确。文章内容行距拉开，使人观看的时候有一定的视觉跳跃，十分有视觉节奏。页面右侧的图片位置，文字信息紧邻图片右边十分符合我们从左到右的阅读习惯，并且间隔空隙的掌握，不会让人对图片信息的位置产生歧义。图片十分简洁，没有自己轮播闪动等烦乱的效果，而是鼠标滑过时图片选择位置才出现，并随鼠标移动介绍图片信息，十分方便，符合用户的心理预期。总体来说网易新闻是这几个门户网站中比较完善易读的。

　　网页中文字分布过多过密集就很容易造成视觉疲劳，因为人的视觉本身更倾向于接受直观的东西，诸如图片、图形。图片不仅会吸引视觉注意力，同时视觉也不会像阅读文字一样进行频繁的左右上下闪动。现在我们来看看国外的新闻类网站。亚洲半岛电视台网站 Al Jazeera English（图 42），导航清晰，页面简洁，块面分布，以图片为主，图片轮播放在标题右侧的大量空白处，而且留有一定空间，无烦乱感，轮播速度协调，视觉清晰。英国 BBC（图 43 图 44）网站更为简洁主页黑白风格，图片为主，导航清晰，点击 news 进入新闻页，信息增多，但是也无烦乱之感，视觉清晰。

　　网页阅读中文章的行距占着非常重要的位置，适当的行距有效的调节了眼睛的疲惫感，使人能够轻松的阅读。对人来说，更易阅读短行文字，这点新闻门户中都做到了，但是人在阅读长行文字时速度更快。但是人们更喜欢分栏阅读。有时影响阅读的也有视觉经验或者从事专业、生活经验等相关。所以在文字行长行短的问题上不用过于纠结，掌握好行距才更重要。为了受众更好的阅读，视觉更好的页面呈现，一定是块面简洁，不要将信息复杂化，也不能为了抢占首页的位置，进行过多的信息设置，要真正的做到简洁而不简单。了解受众目标，进行简洁清晰的设计调整是最好不过的。

　　4.1.2 网页中的视觉臃肿

　　视觉臃肿这个词，多半是形容人的穿衣打扮，秋冬的厚衣厚裤搭配下人看起来的臃肿状态。其实，在这一小节说认知负荷可能更为恰切，但是本节探讨的内容可能又没有认知负荷的概念这么的庞杂，仍是本着视觉状态和心理反应的网页分析，所以借用了视觉臃肿一词，来形容一个网页如果信息过多的表达，与人的穿衣厚重感相同，也给人视觉臃肿感，同时带来视觉和心理的负荷。人的眼睛不能在一时间接收很多的信息，尤其是在视觉条件有限的情况下，在前文的视觉的心理疲劳当中有所提及。上文我们提及了阅读疲劳，那视觉臃肿和阅读疲劳有何不同呢。阅读疲劳选取的还是可以正常阅读的范例，而视觉臃肿就已经达到了无法进行长时的观看，甚至在观看其中信息条目时要进行视觉大搜索，这样的页面不仅视觉臃肿，给人的操作也带来不小的麻烦。

　　人天生懒惰，网页设计应该是便于浏览而不是细细寻找。人的大脑一次能处理少量的信息，现在国内的网站很多网站会犯这样一个错误：就是一次给用户提供太多的信息。有些时候为了吸引用户的注意力，就想不断的参加视觉信息，视觉元素，加入图片、动画和视频，这样的网站就会给人呈现视觉臃肿感。不过有些时候，负荷学说是有刻意增加的，比如一些游戏挑战。游戏是通过负荷增加来调高难度的，游戏里不仅有视觉难度也有动作难度，如果为了满足自己的好胜心，那视觉疲劳就在所难免。

　　在当下，最让我们印象深刻，视觉上琳琅满目的就属各式电商网站为多。电商网站是近年来不断兴起的一种 B2B 或 B2C 的网络购物形式。特点就是内容丰富，给使用者足够的自由空间。国内的所有电商网站的页面都呈现视觉信息过多，过杂，信息条件密集的情况。电商网站的问题大都大同小异，比如淘宝，京东，一号店（见附录图 1 图 2）等等，这里我们就以最大型的阿里巴巴旗下的购物网站为例。分别是淘宝网站、天猫购物以及阿里巴巴网站。这三款网站有一个共同的问题，即信息传递过多，过满。而三者中相对比而言，天猫较好些，淘宝其次，阿里巴巴最次。这三个网站有一个共通特点，即以阿里巴巴旗下产品侧边菜单栏的标志性摆放。好处是当用户想要在网站购物时，绝大部分物品交易流程是相通的，淘宝网站的用户以亿计算，如此多的用户量致使受众已经比较熟悉淘宝的操作流程，所以在侧菜单的摆放位置上，几乎相同。不同的是天猫网站（图 45）的设计相对简洁，以图片为主，菜单也采用黑色，沉稳高档的颜色。但是展示的产品类别过多，在图片选择上也没有进行一个系统的归类，整个网页没有主次关系，图与图之间没有间隙，给人的视觉没有一个喘息的机会。像是一个介绍产品的人在喋喋不休的说话，不停地在表达信息，这和信息冗杂的网页给人的感觉相同，视觉感觉上很臃肿，比较纷乱。整个视觉感受导致主页没有起到相应的作用，大部分用户集中在搜索和左菜单栏中的使用。不过，天猫这个产品的整个基调是对的，倡导天猫店，正品保证，高质量广告图，红黑的搭配，给人以严肃感和信任感，同时不缺乏热情。

　　淘宝（图 46）相对天猫来讲，更加有平民感，主页中没有过多图片，都以文字的小分类为主，第一屏显示三分栏，左侧较密集的分类文字入口，中间是轮播广告，右侧相当于个人信息。在这里需要赞扬的是右侧的个人信息的分块设计，人的视觉更倾向于认知图形，相比小信息文字的入口而言，似乎宫格式的图形化表现让人的视觉更清晰，可以更快的找到自己的需要。淘宝的整个页面问题和天猫一样，天猫的页面用图片填满了，而淘宝的下部则是用细小的文字入口填满了，虽然每一类也有划分块面，但是整体太和谐，没有主次关系，分块条目的颜色选择给人感觉也没有特别的倾向性，没有给人以指向作用。

　　再来说说阿里巴巴批发站（图 47），整个网页只有左边的侧边菜单，其余部分被各种产品的图片填充，而且宝贝图片的整体感觉应该是店铺卖家自己拍摄的实物图，良莠不齐，真的从视觉上给人一种来到了大型批发站的感觉。总体来说，这三个网站的主页功能性作用不强，但是搜索页面（图 48）十分好用，数据抓取的图片搜索，找相似等等，充分理解了用户的需求。

　　虽然阿里巴巴旗下的这几个网站在视觉上给我们呈现的是视觉臃肿的感觉，但是我们不得不承认阿里集团精准的找到了网站的目标定位，十分符合中国的国情，是大众的网站。在这里，就用到了一个恐惧留白效应（图 49）。在很多时候，我们强调简洁，强调留白，但是在淘宝这里却并不适用，反而它的视觉臃肿，琳琅满目，满足了中国普遍大众的心理需求。恐惧留白和价值感受之间存着一个反比的关系。比如，店铺橱窗里的模特儿、衣服、广告牌的数量，与该店的平均价格和品牌价值度成反比[6].零售店和批发商倾向尽可能把橱窗填满，利用每一寸空间展示各式各样的衣服和模特，反之，高档精品店通常在橱窗中只陈列一个模特，没有吊牌没有叠成堆的衣服，亦没有价格标示，询问价格的人极有可能消费不起。这也是社会的恐惧留白效应，和贫富有很大的关系，也就是说，对那些习惯拥有很多的人来说，少才是多，而对于那些向来都没什么东西的人，多才是多。所以在电商网站中，我们看到了这样的视觉效果。阿里的受众群是大多数的普通老百姓，花大价钱购物的群体也不屑于登录这种购物网站。这也和教育程度的高低和文明程度有关系。以上种种，形成了目前中国最大受众群的电商网站之所以网站页面视觉臃肿的原因。

　　下面来说一下其他的电商网站，例如暖岛网（图 50），一直以原创设计小众买卖主打的网站，也有可能是太想表现设计，反而使得页面中很多地方出现过多的设计元素，使人产生视觉十分臃肿的感觉，首页一排精致的扁平图标，很有设计感但是不免喧宾夺主。紧接着大面积的轮播图片，轮播时间过快，图片选择也过于花哨，每张都是很好看很有设计感的图片，但是放到一起轮播起来，便给人造成视觉困扰。花花绿绿的页面让人的眼睛无所适从。

　　我们对比一下另外的小众设计网站，果库（图 51）和想去（图 52）。都是黑白为主，十分简洁，有图有文，相得益彰。其简洁的主要原因是留白和分块，信息与信息之间留有足够的间隙，给视觉提供休憩的喘息。

　　我们再说一下，国外的 ebay 网站（图 53），它的地位相当于中国的淘宝。

　　但是整体感觉清晰整洁，主页没有放过多的东西，但是也有分类模块，每一类的图片选择和颜色分布都是按照这一类别商品的感觉分配的，比如（图 54）儿童类就是糖果色的图片，充满童趣，女装类则是粉色调的图片，充满浪漫温柔的气息（图 55）。前面说过恐惧留白，但是它还有一个重要的因素的国情、受教育程度和文明程度的不同，中外电商网站也会有差别。（图 56 图 57）亚马逊的中国官网和美国官网就有所不同，所以视觉臃肿的问题便显而易见。

　　4.1.3 网页中的视觉干扰

　　界面中的视觉干扰一般是由过多的视觉元素造成的，这些多余的视觉元素将人们的注意力从那些直接传达功能和行为的主要对象上转移他处[7].这就是我前文说到的视觉选择也有视觉中心的因素。视觉干扰十分影响浏览网页的视觉效果，过分的装饰、不必要的元素、无限制循环的 Flash 动图，恶意的插件还有令人烦躁的弹出窗口，还有一些站轮播图画面转换的闪烁，都造成了视觉的干扰，导致视觉疲劳。

　　举一个非常典型的网站例子。Underworld magazines（图 58）网站设计，背景过多的装饰使得当想集中注意力看这个网页时，目光不由的游离。背景太过复杂，主要是想强调一些版式设计、社交媒体等元素，使得周围产生了强烈的视觉效果，装饰只是出于视觉吸引力而增添的内容。它也许是不必要的下划线、粗体文字的多余斜体样式、页面周围的边框。这些元素的存在可能是为了吸引用户的视觉兴趣，然而又有点弄巧成拙的意味。如果一个页面上的某个元素对传达消息没有什么作用，那么它可能不需要出现在页面当中，如果出现，很有可能造成视觉干扰，长时间的观看就会产生视觉疲劳。

　　Flash 闪烁和弹出框的问题，在一些小说网站尤为严重。在网站排行榜中，位居榜首的是起点中文网（图 59），然而起点中文网的弹框广告、Flash 闪动也最为严重。首页几乎所有的位置都分布着吸引视觉的点，并不像上文 Underworldmagazines 一样只是图底关系不明确，没有视觉中心，但是扔保持了画面视觉效果。起点的首页没有什么特别突出的设计，反而是满屏的闪动点，广告弹框让我们记住了它。页面中间按钮闪烁，新推出模块 new 也在导航栏部分闪烁，左右两边广告弹框闪烁，网页下方也有弹框并且还伴随着音乐，真是让眼睛应接不暇，你想不看都不行，注意力完全被频繁的闪动吸引，但是用户却根本不想使用这些功能，视觉的干扰，让心里也产生烦乱感，关闭弹窗后，还要小心点错蹦出另外的广告窗口，是非常糟糕的用户体验。

　　由于视觉干扰，文章正文和广告的吸引力成反比。在站长网（图 60）中的一篇文章，虽然网页内容是按照人的视觉流程从左到右的分布，但是点开网页后视觉不自觉被右部和上部的彩色广告所吸引。虽然不是页面的主要信息，却因为颜色对比强烈和运动感占据了页面的视觉中心，造成了正常浏览网页的视觉干扰。在 68 设计联盟（图 61）这样的设计类网站中，在三级页面的时候，也出现了图片主内容与广告相干扰的问题，站长中的文章是文字，没有广告图的吸引力强，从而导致视觉吸引。而 68 网站中，页面的主体是图片，但由于块面小，文字小，视觉识别吃力，所以也被广告图所侵蚀。高考门户网站（图 62）中，经常出现在页面中游离的各色广告弹框，阻挡人的视线，与普通的广告弹框不同，此类弹框是不停的在页面中移动，视觉也不自觉的跟随这些弹框眼动，十分干扰。

　　小游戏类的网站（图 63）中没有广告也没有弹框，但仍存在视觉干扰的问题，原因是用色鲜亮，分点过多，没有引导性的块面。文字语言用色繁多，游戏icon 也十分花哨，导致画面处处充满焦点，视觉感受十分跳跃，甚至有些晃眼，长时间的观看眼睛十分疲劳。这与暖岛二级页面中图片上的“限时特价”（图 64）是一样的道理。图片上的小色块用亮紫色，在视觉上也形成跳跃，长时观看很容易形成视觉暂留。

　　在迅雷看看网页版观看电影栏目的时候，每一个电影海报在大屏部分推送转换的时候都有一个黑屏闪烁，在用户自己点击滑动的时候，每一幅都有一个闪烁，多个闪烁之后眼睛难免会产生不适，必须紧闭一会才会适应，频繁的闪烁却对用户的视觉产生了噪点，这也是网页中的干扰，应该注意避免。

　　4.1.4 网页中的色彩疲劳

　　在网页的色彩选择中，除了要充分考虑网站本身的特点，也要遵循色彩应用的一些视觉和心理的规律。网站的色彩搭配要合理，颜色搭配的好坏直接影响用户的视觉和心理感受，甚至影响情绪。不同的色彩搭配会带来不同的视觉感受，有时候，在追求视觉冲击力的同时，也要注意色彩分布和分配对视觉带来的影响。在这里我们先不论网页设计的好与坏，单从视觉疲劳的角度，分析网页中的色彩。

　　通常来说，使用纯度高的颜色，从广告效果上是好的，能够一瞬间把用户的注意力吸引过来，但并不适合长时间的浏览。长时间浏览纯色的页面，会产生视觉疲劳。有人说绿色是保护眼睛的颜色，但实际上纯度过高不经调和的绿色对眼睛的刺激也不容小觑（图 65）；在网站中使用大面积单色类色彩，笔者把它归类为单色刺激性网站色彩。假如使用统一感强的色彩，比如高级灰色调，整体色彩偏白，看起来会使页面呈现简洁而干净，但同时也需注意一个问题，由于电脑屏幕分辨率的不同，导致显色也会有不同的变化，太高级的颜色，亮部的颜色也许会在低分辨率的电脑上显示不出，从而导致网页画面颜色无层次，十分单薄。

　　而黑灰色等深色为主的页面，整体把控相对比较容易，但是也有可能因为显示器分辨率的问题，导致暗部失去层次。深沉的颜色如果搭配不好，很有可能造成画面的憋闷感，所以说要从客观视觉和主观心理还有外界因素的多重方面考虑，要站在用户的感官角度来设计网页的色彩。

　　明度高的颜色吸光度就高，反光度就更高，大面积使用纯度高且明度高的颜色，要尤为注意。（图 66）Cygnis 是一个以高明度蓝色为主的充满卡通元素的网站，非常好看，也很惹眼，可以瞬间给人留下深刻印象。但是大面积高明度的蓝色充斥在眼前的时候，不禁想要眯住眼睛，眼睛一时可能承受不了电脑屏幕上高明度蓝色的反光。另一个购物类的网站，也使用了高明度蓝色，并参杂了白色条纹，颜色对比刺激更加明显，眼睛已经不能直视（图 67）。同样的高明度的黄色也是如此，从视觉上给人反光感十分强烈，不能长时观看，另外高明度的黄色给人张扬感，在心理色彩中的印象也不如饱和度高一点的黄色（图 68）。同为黄色饱和度和彩度高，明度低一点的黄色，让人看着比较舒服，没有刺眼感。前文我们说过，红色是视觉感受最强的颜色，它在网页当中不适宜大面积的使用，不然会造成视觉补色的错觉。例如最近非常火的中国好声音在腾讯视频的专题页，通篇为了配合好声音的主视觉，几乎满屏的红色，再加上分布不是很清晰的视频介绍，着实让人眼痛一番。不过好在没有用到非常刺激的大红色，并没有造成十分强烈的视觉残留感。在网页中运用红色，给人热情，热闹和欢乐的感觉，尤其在中国，更有中国红的说法，所以在网页设计中有时避免不了要使用红色，倘若一定要使用大面积红色，那我们一定要选择明度低，彩度微低的红色，（图 69）切记强烈的色彩对比。红色与同明度同色系的颜色搭配是比较讨巧的。48鲜明跳跃的网页色彩十分好看，但是颜色之间的搭配和面积的分布尤为重要。鲜亮多彩的颜色在一起视觉上是很丰富，但不见得就是适合视觉的好的设计。（图 70）聚划算年终大促的网页，颜色鲜艳，体现促销欢乐的气氛，但是颜色过多，纯度偏高，是视觉感官并不好。这种狂欢节似的效果会淹没用户的感官。（图 71）Mr. Adam Hayes 这个网站，由于是个人主页，作者将自己的众多作品组合成一个网页，画面很绚烂，但是从视觉的角度来说，颜色多，排列密集，还有多组对比色，色彩对比的反复刺激，还有冷暖明暗的刺激，使得眼睛看一会就开始视觉模糊。暗色冲击力的网页色彩是人们想经常运用吸引眼球的做法，如（图72）但是不得不说，大面积背景呈现黑色，正文呈现白色，再有小部分的纯色提亮，确实让整个网页都焕然一新的感觉，十分抓人眼球，但是需要注意的一点是，这类黑色背景网站不适宜放过多的文字，或进行长时阅读，黑底白字的强烈对比会对视觉造成一定的刺激，让人感到十分刺眼，并且在观看的时候视觉会出现闪烁，就像前面我在颜色错觉疲劳的位置说到的例子。并且，黑色与高纯度颜色的对比也同样会出现这种状况，只是面积大小和影响大小的区别。如果要有文字，不宜过多，而且除了标题，不要使用纯白色，尽量使用灰白色，缓和强烈的视觉对比。俗语说“红配绿，冒傻气”,在我们印象里，红配绿一直是比较刺激的配色。

　　但是在网页中运用红配绿也依然可以呈现舒服的视觉感受。Startup Giraffe（图73）这个网站运用的就是红配绿的配色，但是，是经过调和的红和绿。运用了彩度低白度高的带有黄味的绿和彩度适中带有黄味的红，这样在画面中的红和绿进行了充分的调和，而且十分和谐，视觉看着也十分舒服。其实，彩度、亮度稍低，偏灰度的颜色十分适合视觉。Every Last Drop（图 74）这个网站的整体配色是十分舒服的，他们的明度几乎相同，画面色彩温和不刺激，这才是最适合视觉感官的色彩搭配。还有整体白度高，前文所说的高级灰，也同样给人视觉以舒服。在网站中，最适合视觉的颜色搭配即是没有明显颜色反差对比，十分和谐的颜色，最好是“你中有我我中有你”的颜色搭配，即有低明度，同彩度，有大面积颜色引领的，不杂乱的颜色搭配。

　　4.1.5 创意类网站网页辩证分析

　　设计中有一个美即适用的法则，当一个网站富有一定的创意性和美感，或者达到了某人的兴趣点，无论有没有视觉的疲劳他都会义无反顾的使用。这也是一个辩证的思维，当我们的设计思想或者创造美感与视觉的基本原则有些相悖的时候，到底应该选择设计，还是为了人的视觉体验，放弃美感呢。其实答案是前者，我们需要永远追求美的设计，人们认为美的设计更加实用，这是一种心理效应。美的设计容易被接受并且长期使用。美的设计能够激发创意帮助解决问题，美的设计还能够帮助品牌与消费者建立正面的关系，使人们能够容忍产品上的缺陷。

　　手机在早期的时候左上方都会有一根天线突出，方便接收信号，苹果创始人乔布斯提出为了产品的美观，将天线隐藏于手机内部，但是这就导致当接打电话时，手指放的位置如果靠上就会影响信号接收，影响了用户的使用体验。但是乔布斯坚持把天线隐藏于机身里面，为了苹果的平滑和简洁的外观。而苹果并没有因为信号不好的原因销量变差，人们反而为了外观有简洁美感的苹果改变自己手握手机的位置，这就是人为了美得设计而妥协的实例。

　　在网站设计中，有很多设计好，视觉美，有创意的网站，多多少少存在一些影响视觉的因素，诸如视觉中心不明确，颜色对比强烈等等，但是却也阻挡不了它们对人们的吸引。当然，这里并不是说人们就不喜欢简洁、视觉舒适的设计，当美感和舒适感达到平衡，那就是设计的最佳状态。（图 75 图 76）The Farmer &the Chef 这个网站，网站风格非常有创意，是采用复古的画风，做古旧的效果，页面内容像一张纸钉在屏幕上，其实整体画风的古旧感，还有字体的选择都是比较协调统一的，乱乱颜色背景前复古的字体，与画风相融合，导致文字信息没有引起视觉的注意。但是这并不影响当我们打开网页一瞬间的惊喜，创意的风格已经深深的将我们打动。（图 77）Feed Stitch 这个网站也采用了明度较高的纯蓝色做背景，并且画面中还有其他彩度明度高的颜色，视觉上比较晃眼，但也正是因为这样，抓住了人的眼球，视觉中心虽然会被网页两边的彩色所干扰，但是整个图形的设计，好像穿过电脑屏幕，从左至右的变化，它利用图给我们传达了一个故事，是非常有创意的网站首页，观看这个网页使我相信大家也有兴趣继续点击。

　　但是需要注意的是，在创意类的网站中，鲜有信息过多，视觉臃肿的现象，所以良好的信息传递，信息较为简洁的网页依然是上上之选。（图略）