為您的
網(wǎng)頁(yè)設(shè)計(jì)項(xiàng)目選擇正確的顏色不是一個(gè)可以輕率做出的決定。好的顏色選擇可以影響訪問者如何解釋他們所看到的內(nèi)容，并且可以對(duì)他們對(duì)一般品牌的愿景產(chǎn)生積極影響。沖突的顏色選擇可能會(huì)導(dǎo)致他們嘗試其他網(wǎng)站。
簡(jiǎn)而言之，色彩是設(shè)置良好第一印象的最快和最直接的方式。雖然一開始可能看起來難以處理，但您可以通過色彩理論背后的基礎(chǔ)科學(xué)知識(shí)輕松確定您的選擇。
顏色意味著什么？
選擇顏色不僅僅是個(gè)人喜好。每種顏色都有不同的含義，可以以特定的方式影響人們。這就是為什么顏色對(duì)于網(wǎng)頁(yè)設(shè)計(jì)如此重要 。它有能力立即傳達(dá)有關(guān)您業(yè)務(wù)的正確信息。讓我們來看看顏色的含義以及它們可以觸發(fā)的情感。
暖色調(diào)
紅色可以喚起激情
下面這些顏色可以對(duì)訪客產(chǎn)生積極的影響，但是當(dāng)它們單獨(dú)使用時(shí)，它們往往會(huì)過度刺激。將它們與冷色和中性色混合以保持平衡是個(gè)好主意。
- 紅色活躍——情感，熱情，力量，愛，強(qiáng)度
- 粉紅色——甜美，浪漫，俏皮，溫暖，富有同情心，柔軟
冷色調(diào)
下面這些顏色對(duì)觀眾有鎮(zhèn)靜作用，這就是為什么它們是網(wǎng)站上最常用的顏色。但要小心 - 如果它們被過度使用，它們也會(huì)有冰冷或沒有人情味的感覺。
- 綠色——清新，平靜，放松，信任，和平，充滿希望，愈合
- 藍(lán)色——舒適，清晰，冷靜，信任，誠(chéng)信，忠誠(chéng)，可靠
該網(wǎng)頁(yè)設(shè)計(jì)使用藍(lán)色傳達(dá)了了忠誠(chéng)和信任的感覺
中性色
它們非常適合與暖色或冷色混合使用，它們通常用于降低原色，并在網(wǎng)頁(yè)設(shè)計(jì)中提供平衡。
- 灰色——尊重，智慧，耐心，現(xiàn)代，長(zhǎng)壽，聰明
- 黑色——強(qiáng)大，大膽，嚴(yán)肅，優(yōu)雅，豪華，戲劇，正式
- 褐色——友誼，地球，家庭，戶外，可信度，簡(jiǎn)單，耐力
一個(gè)為了平衡使用了中性色彩去創(chuàng)造奢華，簡(jiǎn)約的感的偉大網(wǎng)頁(yè)
色彩心理和品牌認(rèn)知
顏色是科學(xué)
除了上面提到的每種顏色背后的一般含義之外，品牌經(jīng)常遵循某些趨勢(shì)來創(chuàng)造品牌認(rèn)知。例如，餐館通常是紅色和橙色，銀行和金融機(jī)構(gòu)通常是藍(lán)色的，奢侈品通常是黑色的，酒店通常是白色，藍(lán)色，黑色或綠色。一些以其顏色著稱的標(biāo)志性品牌包括具有紅色，白色和黑色的CNN，具有黃色的國(guó)家地理，以及紅色和黃色組合的麥當(dāng)勞。
網(wǎng)頁(yè)設(shè)計(jì)中的色彩理論
現(xiàn)在您已了解顏色如何影響訪問者，您可以混合它們并有意使用它們以使顏色理論對(duì)用戶行為產(chǎn)生更多影響。
色輪上的類似色
簡(jiǎn)而言之，色彩理論是色輪上顏色相互作用背后的科學(xué)，它在設(shè)計(jì)中很好地協(xié)同工作。用于配色方案的三種通常接受的結(jié)構(gòu)是三元，互補(bǔ)和模擬顏色。
完美的三合一方案
互補(bǔ)色的有趣使用
類似色
通過考慮互補(bǔ)，對(duì)比度和活力，您可以在色輪上進(jìn)行更細(xì)微的選擇。
補(bǔ)充——是我們看到顏色與其他顏色相互作用的方式。當(dāng)您匹配色輪兩端的顏色時(shí)，您將獲得視覺上吸引人的效果，因?yàn)樗梢蕴峁┢胶猓驗(yàn)橐环N顏色可以增強(qiáng)另一種顏色。
對(duì)比——通過在頁(yè)面上清晰地劃分元素來集中訪問者的注意力，或者支持文本的可讀性或者將眼睛吸引到頁(yè)面的特定部分。
活力——可以影響游客的情緒反應(yīng)。更明亮的色彩可以讓您感覺更有活力，深色調(diào)可以讓您放松，并幫助您更專注于內(nèi)容。
選擇原色
為了開始混合您的網(wǎng)頁(yè)設(shè)計(jì)的顏色，您的首要任務(wù)是為您的品牌建立主要顏色。這應(yīng)該根據(jù)您的徽標(biāo)或其他品牌材料確定，但如果不可能，請(qǐng)使用顏色心理學(xué)和關(guān)聯(lián)來選擇一個(gè)。
該網(wǎng)頁(yè)設(shè)計(jì)從品牌標(biāo)識(shí)中汲取了原色
開發(fā)色調(diào)和色調(diào)
一旦您的網(wǎng)站有了主要顏色，您就可以開始使用顏色方案了。有些網(wǎng)站可以使用單一顏色進(jìn)行設(shè)計(jì)，但大多數(shù)情況下，您需要至少使用一些色調(diào)或色調(diào)。
在整個(gè)設(shè)計(jì)中使用原色并不總是最好的解決方案。您可以調(diào)低或增亮色調(diào)，以在網(wǎng)站上創(chuàng)建微妙的變化，同時(shí)保持相同的基色。例如，如果您為網(wǎng)站的各個(gè)部分選擇一種顏色的淺色調(diào)，那么您可以使用主要或最突出的色調(diào)來創(chuàng)建CTA按鈕，以便它們更突出。看看設(shè)計(jì)師UI Maniac如何在下面的例子中做到這一點(diǎn)。
原色橙色以不同的色調(diào)出現(xiàn)
Adobe Color Wheel是用于顏色選擇的最佳工具之一 。您可以將中間選擇器設(shè)置為主色，然后使用顏色規(guī)則來獲取一些選項(xiàng)。此工具易于使用，在您探索網(wǎng)站的配色方案時(shí)可以提供很多幫助。
60-30-10規(guī)則
一個(gè)執(zhí)行60-30-10規(guī)則的好例子
該技術(shù)簡(jiǎn)單但有效地混合不同的顏色。為了創(chuàng)造和諧，顏色通常應(yīng)該以60％-30％-10％的比例組合。你并不總是需要三種顏色，但這是一個(gè)安全和平衡的好數(shù)字。使用這種方法，60％應(yīng)該是主色，30％是次要色，10％是強(qiáng)調(diào)色。這個(gè)比例對(duì)人眼來說是令人愉快的，因?yàn)樗试S視覺元素逐漸出現(xiàn)。
對(duì)比
高對(duì)比度，容易識(shí)別
色彩對(duì)比度是視覺構(gòu)圖中非常重要的一部分。例如，如果您需要訪問者特別關(guān)注網(wǎng)站的特定區(qū)域（例如CTA按鈕），您可以使用兩種高對(duì)比度的顏色，例如橙色和綠色，或紅色和藍(lán)色作為背景和按鈕。
雖然對(duì)比可能有用，但應(yīng)謹(jǐn)慎使用。如果您在整個(gè)網(wǎng)站上使用高對(duì)比度，則難以閱讀或查看文本。我建議你為大多數(shù)設(shè)計(jì)創(chuàng)建一個(gè)中級(jí)對(duì)比度，并且只有在突出顯示關(guān)鍵元素時(shí)才應(yīng)用高對(duì)比度。
使用圖像
在某些情況下，從圖像開始可能會(huì)有所幫助。如果您有一個(gè)可以定義品牌的圖像或客戶已經(jīng)選擇了圖像，您可以從那里拉出主要顏色。
此設(shè)計(jì)中有多種顏色，中性色調(diào)可提供平衡
使用多個(gè)圖像可能會(huì)非常棘手，因?yàn)槟仨氄业揭环N在設(shè)計(jì)中創(chuàng)建色彩和諧的方法。在這種情況下，有幾種方法可以平衡圖像：
- 調(diào)整圖像的透明度以降低色調(diào)
- 或者使用您為網(wǎng)頁(yè)設(shè)計(jì)選擇的調(diào)色板創(chuàng)建漸變疊加層
根據(jù)哪種解決方案最適合您的項(xiàng)目，您可以輕松地使您選擇的圖像協(xié)調(diào)一致。
顏色將網(wǎng)頁(yè)設(shè)計(jì)變?yōu)楝F(xiàn)實(shí)
顏色無處不在，如果使用得當(dāng)，它們可以促進(jìn)您從訪客那里獲得的任何類型的情感或動(dòng)作。雖然顏色在網(wǎng)頁(yè)設(shè)計(jì)中起著非常重要的作用，但它們并不是完美布局的唯一關(guān)鍵。色彩理論只是無數(shù)工具的一個(gè)工具，您可以使用它來創(chuàng)建出色的網(wǎng)頁(yè)設(shè)計(jì)。
希望您發(fā)現(xiàn)這些提示很有用，但請(qǐng)記住，在設(shè)計(jì)中沒有嚴(yán)格的規(guī)則。事實(shí)上，最好的設(shè)計(jì)經(jīng)常違反規(guī)則。使用色彩心理學(xué)作為你的指南，但不要害怕相信你的創(chuàng)作天賦。
上海網(wǎng)站設(shè)計(jì)建設(shè)公司尚略廣告發(fā)布。