7折
减价出售
¥799
网页设计中的色彩心理学
颜色是您沟通策略的重要组成部分，尤其是对于您的网站而言。我与很多网站合作过，所以对网站的最佳颜色不仅仅与美观有关，请稍微了解一下。相反，它们可以极大地影响本地和全球层面的用户参与度。
在本指南中，我将引导您了解如何为您的网站选择完美的颜色，并特别注意多语言网站的文化考虑因素。无论您是在构建电子商务平台、作品集还是教育网站，您都将学习如何创建与特定受众产生共鸣的配色方案。
了解网页设计中的色彩心理学
第一步是了解颜色如何影响人类行为和决策。色彩心理学不仅仅是理论上的，它对网站的成功具有实际意义。
不同的颜色可以唤起特定的情绪反应。例如，蓝色通常传达信任和专业精神，这就是为什么您会看到金融机构和医疗保健提供者经常使用它。例如，大通银行使用蓝色作为其徽标的一部分，然后成为其网站上的强调色：
在（字面）对比中，红色可以创造紧迫感和兴奋感。这使得它在零售和娱乐领域很受欢迎。事实上，这样做的两个大牌也是最成功的：Target 和 Netflix。
然而，文化背景在如何感知颜色方面起着重要作用，而不是它们是一种普遍的心理影响。例如，白色在西方文化中代表纯洁和清洁，但在一些东方文化中代表哀悼，例如印度。例如，这些地区的殡葬服务提供商通常拥有更适合西方商业网站的调色板。
当您想创建一个迎合不同受众的多语言网站时，这些方面变得至关重要。
不同网站类型的最佳颜色
您可能已经对不同网站类型使用的调色板有本能的了解。然而，将它们确定为灵感是另一回事。
接下来，我将分享针对各种网站类别的具体建议，以及保持不同语言和文化之间视觉一致性的注意事项。我无法包括所有网站类型，因此我将查看一些最受欢迎的网站类型。
电子商务网站：转换销售的颜色
电子商务网站设计很难。这是因为您的配色方案需要平衡品牌形象与转化优化，并呈现客户会感到熟悉的外观。
根据我的经验，我发现成功的电子商务网站经常使用中性色与战略口音的组合来引导用户的注意力：
- 背景的中性原色（如白色、浅灰色或米色）。
- 适用于任何号召性用语 （CTA） 的强烈、符合品牌的强调色，例如按钮和销售通知。
- 次要元素的互补色。
例如，亚马逊、eBay 和全球速卖通都选择了这种配色方案：
每个品牌也使用合适的强调色。亚马逊使用黄色、橙色以及各种深浅不一的黑色和灰色。速卖通选择红色作为强调色，eBay喜欢蓝色。
事实上，蓝色和绿色等建立信任的颜色非常适合安全元素和结账流程。但是，您可能需要根据目标市场调整这些选择。例如，在亚洲市场，使用黄金销售奢侈品可能比西方市场更有效。
重要信息和定价的高对比度颜色尤为重要。您可以使用与 CTA 相同的颜色（就像全球速卖通一样），或者与配色方案的其余部分发生冲突的颜色。亚马逊使用红色表示折扣的百分比值，以及灰色和粗体黑色字体。
这显示了微小而细微的更改可以完成您需要的所有工作。
作品集网站：展示您作品的颜色
对于电子商务网站的配色方案，目标是使用中性色让产品成为客户的焦点。投资组合网站具有类似的重点，但以不同的方式处理任务。
在这里，您的配色方案应该增强而不是与您的作品竞争。我推荐一种极简主义的调色板，将焦点放在您的内容上，同时保持专业性。
WordPress 开发人员 10up 做到了近乎完美。该网站的典型调色板是红色、白色、绿松石色和灰色。但是，作品集页面对每个条目都使用全角卡片——这是一种常见的策略。
你用你的品牌颜色在屏幕上添加的空间更小。10up 使用品牌页眉和页脚以及雅致的颜色搭配，帮助您将注意力集中在卡片上。各个项目组合项目页面使用相同的主要红色、灰色和绿松石色方案：
事实上，其中一个项目强调了辅助功能设置如何帮助多语言网站。Hillel International 是一个面向犹太学生的校园组织。配色方案传达了信任，大量使用蓝色。但是，它还包括一个使用黑色的高对比度辅助功能选项。
对于投资组合网站，深色模式设计很受欢迎，尤其是在创意产业中。它们可以使图像和艺术品流行起来，同时减轻眼睛疲劳。不过，当针对国际客户时，请考虑提供浅色和深色选项。
医疗保健网站：通过色彩建立信任
与商业网站非常相似，医疗保健行业也受益于传达专业、清洁和信任的配色方案。蓝色和绿色在这一领域占据主导地位是有充分理由的——它们与许多文化中的医疗环境有关。但是，您选择的具体色调可能需要因地区而异。
有趣的是，全球范围内的颜色差异很微妙。例如，孟买医院信托基金在一些阿拉伯和东亚地区开展业务。该网站使用天蓝色和红色，在我看来是典型的东方医疗机构：
如果您比较东西方文化，美国和英国 （UK） 的医疗网站使用更深、更大胆的颜色。例如，英国的国家医疗服务体系 （NHS） 网站使用白色和蓝色之间的强烈对比，以绿色作为强调色和突出色：
加州大学旧金山分校 （UCSF） 网站使用大胆的颜色，但饱和度较低：
在某些地方，较浅的蓝色几乎看起来是灰色的，但当您浏览网站时，您仍然会感受到信任和专业精神。
教育网站：通过色彩参与学习
教育网站还需要在专业性和参与度之间取得平衡。虽然传统学术机构通常坚持保守的配色方案，但在线学习平台可以在颜色选择上更具实验性。
对我来说有趣的是，全球教育网站的典型颜色如此狭窄。以南非的 Alma Mater国际学校为例。您可以删除该位置，该设计几乎适合世界任何地方。
关键是使用有利于学习而不会分散注意力的颜色：
- 考虑主要内容区域的冷原色。
- 使用温暖的强调色进行交互元素。
- 提供中性背景以减少认知负荷。
- 为重要信息选择高对比度组合。
对于在线学习平台，颜色选择具有更大的灵活性。最受欢迎的选项之一 Coursera 选择为其网站选择典型的调色板：
然而，像 Brilliant 这样的现代平台避开了这一点，转而采用极简主义的颜色和绿色的口音：
Skillshare 还使用绿色，这比典型的教育平台更具活力和刺激性：
我的观点是，在线课程市场和学习平台的目标用户与长期教育不同。对于后者来说，无论学生身在世界何处，尽责、关怀、信任和专业精神都是最重要的。
用于为您的网站选择和测试最佳颜色的工具
有几种工具可以帮助您创建和验证配色方案。我已经测试了很多，并依靠一些。Paletton 网站是查找基本配色方案并将它们相对于彼此可视化的好方法：
为了获得更大的范围和灵活性，我喜欢 Coolors。这是我有一个高级帐户的应用程序，也是我经常使用的应用程序。前提很简单：单击空格键，然后生成一个新的调色板：
您可以移动颜色、添加或删除颜色、将它们保存到专用调色板等等。它还包括一个对比度检查器、一个用于测试调色板在色盲时的外观的工具以及可视化工具。
如果您想使用人工智能 （AI） 生成颜色，Khroma 可能是适合您的应用程序。它要求您预先选择 50 种您喜欢的颜色，然后使用答案为您生成调色板。
它本质上是了解您的颜色偏好，这有助于根据不同的文化背景调整您的配色方案。然而，据我所知，Khroma 还没有像 Coolors 那样检查对比度的方法。为此，您可以依靠专用工具，例如 WebAIM 的对比度检查器。
这将确保您的颜色组合符合网站所有版本的辅助功能标准。这对于保持不同文化和语言的可用性至关重要，并且通常对于为网站的每个用户提供可访问的设计至关重要。
