网页色彩用户体验分析.docx

网页色彩用户体验分析.docx

《网页色彩用户体验分析.docx》由会员分享，可在线阅读，更多相关《网页色彩用户体验分析.docx（5页珍藏版）》请在冰点文库上搜索。

网页色彩用户体验分析

网页色彩用户体验分析

　　随着互联网技术的快速发展，网络已进入时代，堆砌各种所谓的先进技术和功能已经无法满足用户的深层次需求，用户体验是指人们在使用产品或服务过程中建立起来的主观感受，它代表了一个网站的可用性以及对其用户的吸引程度。

愉悦的用户体验是网站用户忠诚度的重要保证，因而它也成为现今各个网站更高层次的追求。

视觉设计肩负着展现网站最终设计成果和与用户进行对话的重要使命，直接影响用户体验的成果。

而色彩无疑又是视觉设计中极为重要的一个方面。

心理学研究表明，人的视觉器官在观察物质时，最初的几秒钟内，色彩感觉占80％，形体感觉占20％；两分钟后，色彩感觉占60％，形体感觉占40％。

因此当用户打开一个网页时，留下第一印象的并不是它的内容或版式布局，而是网页的色彩。

它具有很容易被人注视和感知的特征，并能够持久的给访问者留下深刻的印象。

传统的网页视觉设计，在色彩的研究方面往往不够深入，忽略了一些会对用户产生深层次影响的因素，对一些细节不够关注。

而时代的发展赋予设计新的要求，为了让用户在使用的过程中获得良好的体验，网页的视觉设计也需要不断进步。

下面就重点从用户的情感、认知、特殊性等角度对网页设计中的色彩元素进行探索。

　　一、色彩对用户情感的影响

　　网页的色彩，不仅对其整体的美感起到重要作用，还往往会给用户传递很多的情感。

情感是人对客观事物所持的态度体验，对其行为有着重大的影响，是满意度的一种体现。

因此，色彩对人类情感的影响也是用户体验的一个重要部分，设计师应该有足够的重视。

色彩对人产生的心理和情感影响，主要是由联想引起的，建立在人们对生活认知的基础上。

长期以来，人们在生活中积累对事物的认知，当色彩刺激发生时，人会把它与以往的经验知识等联系起来，从而联想到与之有关的某种具体事物或是抽象概念。

如红、橙、黄让人想到阳光、火焰和太阳，给人温暖的感觉即暖色系；青、蓝让人想到大海和蓝天，给人清爽凉快的感觉即冷色系；还有一些中性色，表达中立的情感，即并不创造出一些情感，例如棕色和灰色。

举一些例子，暖色用在希望带来幸福快乐感觉的网站上不失为明智之举。

全球金融危机时，黄色变成了网页设计中非常流行的色彩，因为公司希望带给顾客阳光明媚的感觉；而冷色最好是用在想要表达出专业或整洁感觉的网站上，以呈现出冷静、权威、值得信赖的企业形象，而若将其运用在以乐观为主题的网站上就是不明智的，因为用户会得到错误的印象。

因此，当一个网页最初被设计的时候，设计师也需要决定网站的情感色彩，考虑需要给人什么样的心理感受。

通过色彩的恰当使用，把网站的思想内涵传达给浏览者。

通过不同的色彩可以传达不同的情感。

因此，在网页设计中对色彩的选择和使用并不能仅仅根据设计师自身的喜好来决定，而是必须考虑到设计的用途、功能和使用者的心理感受。

色彩的情感尤为重要，巧妙地运用色彩的情感规律，能在吸引用户兴趣的同时，为其在使用的过程中带来愉悦的体验。

　　二、色彩对网页可用性的影响

　　网站可用性是衡量用户体验的指标，是对用户使用网站达成目标是否顺利、以及在这个过程中用户是否满意的综合衡量。

它主要关注网站的易用性、有效性和满意程度等。

色彩对网页可用性的影响可以从认知心理学的角度来研究。

　　1.色彩的亮度/对比度与可识别性

　　在网页设计过程中，元素的可识别性直接关系到网站的可用性。

费希纳、韦伯等心理学先驱以研究感知阈限为起点，指出人的视觉、听觉等只能加工特定强度范围的刺激。

颜色的色相和饱和度对于配色来说并不是最重要的部分，根据颜色的对比度/亮度来考虑色彩组合更为有效。

因为人的视觉是首先查找边缘的，在意识到真正的色彩之前，人眼最先发现的是颜色的对比度和亮度的区别。

通常情况下，网页中的有色对象或区域并不是孤立存在的，都会与其他的对象或区域比邻或者重叠。

这就产生了对比效果。

没有足够的对比，我们是不能在屏幕上分辨出不同的区域的。

这也正是很多网页界面都会默认设置成白底黑字的原因了，因为它会产生最强的对比度，以及最佳的可视度。

当几种颜色有着非常接近的亮度时，会产生些许的光学误区。

另外，人类眼睛中的水晶体会对不同的光波产生不同程度的折射。

这种情况是因为不同的光源投射到视网膜中不同的地方所引起的，比较明显的情况是紫色/蓝色与红色的组合，因为紫色与蓝色的光波位于光谱的一端，而红色位于另一端。

因此，采用红蓝搭配的文字与背景，看起来就会显得有些模糊。

所以，在设计中应当避免红色和紫色/蓝色的文字对比，同时这对红绿色觉障碍者也是不太友好的。

选择配色方案的一个简单方法，就是将色彩搭配去个色，或者说是降低饱和度，看看颜色之间的区分度再决定。

人类对色彩也会产生很多视错觉，这在设计过程中也要加以注意，根据情况加以利用或是避免。

比如任何视觉区域都会趋于临域的补色，像一个灰色的方框，如果周围是红色，那它看起来就会发绿，如果周围是绿色，看起来就会发红，这种情况被称为同时对比。

因此背景颜色对目标颜色的知觉会有影响，在不同的背景色下同一种颜色会产生完全不同的视觉效果。

对于合适配色的经验有很多，也有很多提供网页配色方案的网站和工具。

有设计师也曾总结出符合良好知觉效果的文字底色对比方案，即当黑色作为背景色时，采用青、绿、黄为前景色可辨识度较好；当白色作为背景色时，选用黑、粉、蓝和红色较好；当粉色为背景时，白色是适宜的前景色；蓝色背景宜搭配白、青、绿或黄色；青色底则宜配黑、蓝及红色；绿色背景与黑、蓝色前景搭配较合适；黄色背景与黑、粉、蓝、红色前景搭配较合适；而红色背景适合白色前景。

此外，W3C也有相应的色彩对比度规范和测试软件，不妨作为参考。

　　2.色彩与用户的注意资源

　　色彩的对比会提高视觉吸引力，把浏览者的注意力引向某些传递关键信息或者需要输入的重要元素。

但如果在同一网页内使用过多的色彩，却会分散用户的注意力，使用户无法快速找到目标。

因此，色彩对比的使用也要有合适的度。

我们提倡一个原则，就是大和谐，小对比。

大和谐即整个页面的色彩效果应是统一的。

可以通过采用近似色或者同一视觉感的颜色来实现。

小对比，就是给浏览者准确信息的地方要对比，这样容易对重点内容进行突出。

可以采用色调的对比和亮度的对比。

也可以采用互补色，这样产生的对比效果更为明显。

而像黑、白、灰这样的中性色主要用于不同颜色之间的过渡和柔和。

同时，同一页面中尽量不要采用三种以上的颜色搭配，这会让访客感觉你的网站很嘈杂，容易让人疲劳。

一个页面要有统一的配色风格，网站的主色可以根据其性质定位来确定，辅助色应遵循大和谐的原则来确定，点缀色应遵循小对比的原则来确定。

经研究分析，眼睛最能适应的是中等明度的全色光，所以网页设计中应多采用中等明度的色彩，少部分采用对比色可起到画龙点睛的作用。

也就是说，网页色彩搭配也要人性化：

既要视觉冲击力强，能引起人们的注意力。

同时又要避免视觉疲劳，要兼顾人眼的生理特点，要让人越看越舒服，这样才能有利于提高网页的可用性。

　　三、色彩与通用化设计

　　通用化设计是指对于产品的设计和环境的考虑是尽最大可能面向所有的使用者的一种创造设计活动。

在世界不断全球化的今天，互联网因其特性更应在设计过程中注意到这个问题。

　　1.色觉障碍

　　色觉障碍通常是指对接收某种特定颜色存在障碍，由视锥细胞类型的缺失或工作异常所导致，分为色弱及全色盲，其总发生率并不低，男性约为8%，女性约为%。

色觉障碍患者中最典型的一类人是无法接收红、绿两色的男性，他们对颜色接收的呈现大多都是基于蓝、黄两个色调，不能正确的接收红绿配色。

非红绿色觉障碍的患者比例非常低，这种色觉误差会导致颜色的接收都是基于红绿色调，而蓝黄配色则无法感知。

但这是一种非常罕见的情况，只有%的男性以及%的女性会出现此类症状。

全色盲的情况也非常罕见，只有%的男性以及%的女性看不见任何颜色，他们的视觉是非彩色的，完全基于黑、白、灰。

色盲人群眼中的世界，远没有正常人看到的精彩，但在对颜色的美学要求还远不及某些表示状态的系统重要程度高。

通常情况下，建议不要通过颜色来表明某些重要信息。

比如，通过红光或绿光表明系统状态，这会给红绿色觉障碍者带来麻烦；最好提供一些有意义的文本标识如“OK”、“警告”，或者符号“√”、“！

”等，来代替有色码。

我们在网页设计过程中，也需要注意这一点，尽量避免由于色盲色弱原因而无法感知重要的变化信息。

注意文字颜色的对比度也是件容易被忽略的事。

有些正常人在正常环境中并不能查觉到的状况，但是如果是在欠佳的显示环境中，即使是正常人，面对对比度欠佳的文字长时间阅读也容易产生疲劳。

这在一些色盲色弱、视力欠佳的人看来，就更显吃力了。

因此视觉设计完成后，看看自己的设计在黑白环境中是什么样子，在灰度颜色模式下审查一下效果，想象一下色盲色弱者看到会是如何的情形，对于注重人性化的通用设计型网页是十分必要的。

　　2.性别差异

　　Newcastle大学的神经科学专家AnyaHurlbert的研究发现，尽管被调查者都对于蓝色有着普遍的偏好，但女性的选择更靠近蓝色谱系中偏粉红色的一端。

实验结果中表明，女性的色彩倾向有非常清晰的模式，在黄色和绿色谱区偏好度很低，而在紫色到红色谱区达到了峰值。

多项研究也得出了类似的结论。

因此在网页设计的过程中，可以充分考虑网站潜在用户的性别，根据其特点来对色彩进行选择。

　　3.年龄差异

　　更有研究发现儿童更喜欢波长长的颜色，例如红色、黄色；年轻人更喜爱饱和色；年龄较大的女性比男性更喜欢黑色和紫色。

JoeHallock的研究发现，随着年龄的增长，人们对蓝色的喜好非常稳定，而越来越多的人不太喜欢橙色。

因此儿童网站一般采用高纯度高明度的色彩来吸引儿童的注意力，采用鲜艳的绿、橙等颜色来满足儿童的心理需求。

　　4.文化差异

　　由于文化上的差异，人们对色彩的偏好也会不同。

这在考虑网页用户的地区性时就十分重要。

因为颜色观念是与文化密切相关的，在不同的区域会表示截然不同的涵义。

比如红色，在埃及象征着“死亡”，而在印度却代表“生命”与“创新”，在中国则是代表“幸福”；在美国的包装设计惯例上，用橙色表示其中的物品较便宜，所以在用橙色设计商业网站之前就必须考虑到这个问题。

由于地域、年龄、性别等等方面存在差异，人们对色彩感知的角度、能力也不尽相同；而且存在相当一部分的人群因为生理上的因素对色彩辨识有缺陷。

关注不同的人群，根据网页潜在用户的实际状况确定网页的基本用色，正是一名设计师在设计中体现“以人为本”时，所要注重和考虑的。

　　总结：

　　好的色彩设计应该是用户和信息之间的一座桥梁，帮助用户快速、高效、愉快的接受信息，让用户在浏览使用网页产品时获得更加美好的体验。

这方面的研究涉及到了人类生理学、心理学以及认知学等多个领域，既复杂又深奥。

在这里只是讨论了几个相关的小问题，希望起到抛砖引玉的作用。

而无论使用怎样的设计方法，让“以用户为中心”的理念贯穿始终，是做出好的设计的本源和唯一途径。

网页色彩用户体验分析