不得不知—网页设计的五种色彩搭配技巧

时间：2023-10-01 11:36:01 | 来源：网站运营

时间：2023-10-01 11:36:01 来源：网站运营

不得不知—网页设计的五种色彩搭配技巧：在心理学的研究中，大脑对颜色的敏感度很高。像是读者对杂志内页的广告内容全彩的偏好比起黑白高出了26%，有92.6%的人认为视觉将影响他们的购物决策，而人们的潜意识在90秒内便会透过颜色判读他们是否要购买商品，这样的下意识行为在大型的物品，如行李箱的挑选上又特别明显。







你所选择的品牌颜色将会永远影响你的品牌意识。根据研究结果显示，颜色会增加80%的品牌认知度，而品牌颜色也会影响品牌传递出的价值。在调查结果中发现，前100大的品牌中，他们的品牌颜色前四大代表色依序是：蓝、黑、红、黄。橘色、绿色和紫色被使用的比率则相对少了许多。







好的色系选择与搭配会让你的事半功倍。你一定不会想要随便选一个色系来建构你的网站，只因为「看起来很酷」吧！以下提供5个小技巧，教你如何选择网站配色。

1. 了解颜色如何影响情绪

在前面描述了那么多颜色对人们选择的影响之后，你一定也会知道颜色是会影响人们的情绪的。但是哪一种颜色会唤醒什么样的情绪？而对不同地理位置的消费族群，即便是相同的颜色也可能代表不同的意义。比方说在婚礼的时候，中国人可能会喜欢红色带喜气，西方人就习惯是白纱或简约风的色调。

以下是非特殊场景消费族群的调查结果，不同颜色如何影响人们的情绪：

黄色：乐观、年轻，常被使用在获取window shopper的注意力

红色：充满活力、心跳加速、创造急迫性，常出现在清仓大拍卖

蓝色：建立信任感和安全感，常出现在银行和企业

绿色：跟健康有关，对眼睛来说最舒服的颜色，通常会使用在实体店家，可传递放松的感觉

橘色：积极、创造行动呼吁，以带动订阅、购买或销售

粉红色：浪漫和女性主义，通常会女性的和年轻女性的产品市场出现

黑色：强而有力，通常出现在奢华的商品上

紫色：放松和冷静，常被用在常美妆和抗老化的产品

1. 考虑整体的主要目标客群、性别和年龄层

你想要卖给哪一群人？你想要唤起他们什么样的情绪？想一想你的主要目标客群的人格特质还有情绪。选择最合适的颜色作为网站的主要颜色，举例来说，如果你是一间有机的食品公司，那么最好选择绿色，因为绿色跟自然还有健康有关。







除了主要的目标客群之外，客群的性别也可能会是考量的因素。如有些公司是比较针对不同性别销售的。就必须要了解不同的性别的消费者他们偏好的颜色。

男生偏好的颜色：蓝色（57%）、绿色（14%）、黑色（9%）、红色（7%）、橘色（5%）

女生偏好的颜色：蓝色（35%）、紫色（23%）、绿色（14%）、红色（9%）、黑色（6%）

1. 放下自己的偏见

如果你喜欢蓝色，那么你很可能会倾向将品牌的Logo或是网站的色系使用蓝色。但如果你是一个锁定女性消费者的化妆品公司，选择蓝色就有点儿就大错特错了。因此你必须要放下自己的偏见，才不会因为个人的偏好导致销售成本增加，并可能会随着时间推移而对你的品牌印象有扣分的效果。

1. 选择要用几种颜色

到了这里，你应该已经有一个初步色系的发想了，接着就要思考你总共要在网站上使用几种颜色。但这没有固定的标准答案，建议是采用60-30-10法则。这是在室内设计和流行时尚产业常会使用到的配色比率，被称之为「完美和谐」的黄金原则。也就是将60%用主要的色系，30%用次要的色系，10％为辅助色系。

以下面这个页面来举例，绿色是它用的主色系，白色则是次要的颜色，黑色是辅助颜。所以当你把整张图放在一起看，你会发现理想的颜色使用搭配是3种。这并不是说你的网站不能用4、5种颜色，只是颜色越多会越复杂，让人抓不住重点在哪里，很有可能因此而失焦，跳离网站。

1. 选择你的颜色组合

在选好要几种颜色做搭配以后，接着你需要考量的是色系组合。虽然你不是设计专家，但你需要几个对照组合作比较。最简单的方式是采用对比的方式将网站的内容清楚地呈现在浏览者的面前，不论是浅底深色字或是深底浅色字，只要搭配得宜，都很容易让人一眼就抓住网页的重点。







除了对比色系以外，你也可以考虑邻近色、类似色和同类色。还记得以前在美术课的「色彩轮盘」吗？







【结语】

你不需要是个大艺术家，才能想出很棒的颜色搭配。只需要了解一点色彩心理学还有颜色所带动的情绪，并且根据60-30-10法则和颜色的轮盘，藉由一点实验和A/B测试，就能找到最适合的网站色系组合。

长期来说，你的网站机能透过颜色传递更多讯息，包括品牌的价值，同时借此降低网站浏览者地弹出率、延长他们停留在你的网站上的时间，以及带来更高的转换率。