網(wǎng)頁設(shè)計(jì)師總是在討論網(wǎng)站的視覺配色，因?yàn)轭伾珜?duì)于網(wǎng)站質(zhì)量至關(guān)重要。在建設(shè)旨在安撫目標(biāo)受眾的網(wǎng)站時(shí)，您需要簡(jiǎn)單的導(dǎo)航，整潔的布局和足夠的重要信息，以保持您的流量投入并返回足夠的時(shí)間以成功轉(zhuǎn)換。然而網(wǎng)站設(shè)計(jì)的一個(gè)方面非常重要，但卻很容易出錯(cuò)。

當(dāng)然我們談?wù)摰氖蔷W(wǎng)站配色，只有正確的顏色才能為您的挑剔觀眾所做。

“我應(yīng)該為我的網(wǎng)站選擇什么顏色?”

當(dāng)問自己這個(gè)問題時(shí)，請(qǐng)考慮您的品牌標(biāo)識(shí)LOGO以及您產(chǎn)品的顏色以獲得靈感。

例如：如果您的公司生產(chǎn)拖拉機(jī)，車輛可能是華麗的紅色;那么你的下一個(gè)工作是要找到其他顏色來補(bǔ)充紅色專業(yè)名詞叫輔助色。

無論你做什么，都要花很多時(shí)間在這個(gè)問題上;顏色的選擇在網(wǎng)頁設(shè)計(jì)中很重要，可能比你想象中的還要多一點(diǎn)。

您選擇的網(wǎng)站顏色是如何影響網(wǎng)站的轉(zhuǎn)化和銷售

普通人需要大約90秒才能與你的網(wǎng)站形成積極或消極的互動(dòng)。根據(jù)溫尼伯大學(xué)在加拿大進(jìn)行的一項(xiàng)研究，一個(gè)人對(duì)您網(wǎng)站的評(píng)估高達(dá)90%僅基于顏色。

此外如果你的網(wǎng)站是一個(gè)電子商務(wù)網(wǎng)站，您會(huì)發(fā)現(xiàn)近90%的購物者將顏色作為大多數(shù)產(chǎn)品購買決策的基礎(chǔ)，這一點(diǎn)令人著迷。顏色還可以幫助人們識(shí)別您的品牌。事實(shí)上，研究表明，顏色有助于品牌識(shí)別80%。

如何為您的網(wǎng)站選擇顏色組合

您應(yīng)該做的第一件事是在網(wǎng)上搜索與您類似的公司。研究他們的網(wǎng)站，并嘗試確定組織選擇他們所做顏色的原因。

請(qǐng)注意Material UI創(chuàng)建的圖形，它顯示了來自世界各地的頂級(jí)網(wǎng)站使用的所有顏色。

您可以從這些網(wǎng)站中獲取很多靈感，從而到為何選擇獨(dú)自的顏色會(huì)有所幫助。

在我們了解一些網(wǎng)頁設(shè)計(jì)師使用某些顏色而不是其他顏色的原因之前，有助于理解顏色協(xié)同工作的方式，以實(shí)現(xiàn)更加和諧和更具吸引力的設(shè)計(jì)。

使用原色突出

原色獨(dú)立于色彩世界。也就是這些鮮明的藍(lán)色、黃色和紅色不是通過將任何其他顏色混合在一起而產(chǎn)生的。

通過將兩種基色混合在一起來創(chuàng)建二次色。例如：結(jié)合藍(lán)色和黃色使得綠色就像紅色和黃色一起形成橙色。

通過混合一次和二次顏色制成三原色。例如，這是您獲得藍(lán)綠色組合或紅橙色的地方。

既然您知道顏色類型之間的差異，那么如果您希望煽動(dòng)行動(dòng)，請(qǐng)專注于原色，特別是對(duì)于您網(wǎng)站的戰(zhàn)略部分，例如您的號(hào)召性用語。

請(qǐng)注意Exxon官網(wǎng)是如何使用主要顏色藍(lán)色作為其SLOGAN用語按鈕來吸引訪客免費(fèi)加入。

使用顏色組合將陰影結(jié)合在一起

要了解顏色組合的概念，建議您轉(zhuǎn)向色輪。

這個(gè)節(jié)日的輪子可以幫助您了解顏色彼此之間的關(guān)系，并可以幫助您創(chuàng)建為轉(zhuǎn)換而設(shè)計(jì)的令人矚目的網(wǎng)站。

以下是使用色輪選擇網(wǎng)站顏色以獲得效果的一些方法。

1、主色與輔色

將主色與其互補(bǔ)色匹配可以使您的網(wǎng)站更加賞心悅目。一旦你挑選出顏色，只需在色輪上畫一條直線到另一邊。例子包括藍(lán)色和橙色以及綠色和紅色。

2、類似的顏色

此配色方案涉及選擇輪子上與您選擇的顏色直接相鄰的顏色。例如，如果您的主要顏色為藍(lán)色，則選擇藍(lán)紫色和藍(lán)綠色可以幫助您的網(wǎng)站產(chǎn)生細(xì)微差別。

3、三基色

通過這種方案，您可以將原色中的等邊三角形繪制成另外兩個(gè)，以增加美學(xué)效果。在您的選擇之間始終保持三種顏色。例如，如果您的主要顏色是藍(lán)色，那么您的其他顏色可能是黃色和紅色。

4、顏色是觀眾心理學(xué)的全部

大多數(shù)人都喜歡顏色，有些人喜歡某些顏色而不是其他顏色。顏色的選擇實(shí)際上可能有很大差異，具體取決于一個(gè)人的年齡，性別以及他們來自哪里。

因此，在選擇配色方案時(shí)，您必須考慮您的受眾。男性傾向于喜歡更明亮的顏色，而女性喜歡更柔軟的網(wǎng)站顏色。

這只是一個(gè)例子，說明如果您希望增強(qiáng)網(wǎng)站的成功，您的買家角色會(huì)如何影響您使用的顏色選擇。

然而，無論你是針對(duì)哪種性別，或者即使你碰巧都是針對(duì)兩者，當(dāng)涉及到男性時(shí)，27%的人表示棕色是他們不喜歡的顏色，而女性則是20%。將這些類型的靜力學(xué)考慮在內(nèi)，以避免關(guān)閉您的買家角色。

想要高轉(zhuǎn)換率的網(wǎng)站的10種配色設(shè)計(jì)

考慮到所有這些知識(shí)，讓我們開始討論。

以下是您可能希望為您的網(wǎng)站選擇的各種顏色，以及為什么要獲得更多流量，參與度和銷售額。

白色

白色對(duì)于以恰當(dāng)?shù)膶?duì)比度顯示文本至關(guān)重要，這樣可以使您網(wǎng)站的單詞，句子和段落更清晰易讀。

如果沒有空白區(qū)域，您可能會(huì)讓觀眾感到壓力并導(dǎo)致他們反彈。

事實(shí)上，白色可以變得純潔干凈，但過多可以讓你的網(wǎng)站有一種傲慢，幾乎不友好的感覺，當(dāng)觀眾參與，重復(fù)訪問和轉(zhuǎn)換代表你的終目標(biāo)時(shí)，這幾乎不是你想要的。

Skype自由地使用白色空間來引起人們對(duì)其標(biāo)題，圖像和原色藍(lán)色號(hào)召性用語的關(guān)注。

Word-Form利用白色來展示他們的專業(yè)攝影，設(shè)計(jì)效果很好。這對(duì)眼睛來說簡(jiǎn)單易行。

有些人可能會(huì)發(fā)現(xiàn)過度使用白色過于無聊。如果您的觀眾情況如此，請(qǐng)考慮使用剃刀公司Harry"s使用的技術(shù)。

該網(wǎng)站在標(biāo)題中非常保守地使用白色作為簡(jiǎn)單導(dǎo)航菜單的整潔空間。然后網(wǎng)站將白色與漂亮的藍(lán)色對(duì)比，這很有趣而且它有點(diǎn)讓你想要留下來瀏覽也許只是購買。

藍(lán)色

藍(lán)色被很多不同色調(diào)的網(wǎng)站使用，例如：Facebook、Twitter、LinkedIn、Skype、Dropbox、WordPress等等。

這是一個(gè)很好的理由，因?yàn)樗{(lán)色被視為溝通、智慧和冷靜反思的顏色。

它通常在公司業(yè)務(wù)中發(fā)現(xiàn)，因?yàn)樗軌騿酒鸢踩?，安全感，舒適感和信任感。

顏色很輕松，重要的是，它讓你網(wǎng)站的訪問者想要留下來，因?yàn)榫拖裱鐾炜找粯樱{(lán)色只會(huì)讓他們感覺很好。

黑色

你可能會(huì)認(rèn)為Black會(huì)與黑暗和寒冷聯(lián)系在一起，從某種意義上說你是正確的。

但是網(wǎng)站設(shè)計(jì)中使用的黑色也可以代表復(fù)雜性、魅力、安全性和效率。

你會(huì)發(fā)現(xiàn)黑色大量用于動(dòng)力和奢侈品牌，如梅賽德斯 - 奔馳、Under Armour、Loreal、勞斯萊斯以及其他許多品牌。

請(qǐng)注意梅賽德斯如何使用大量灰色，類似于色輪上的黑色。

灰色

代表力量、力量和權(quán)威的顏色，灰色使得大多數(shù)顏色都具有出色的色調(diào)。您會(huì)注意到灰色在今天的網(wǎng)站設(shè)計(jì)中使用了很多。以Maytag為例。

顏色使用藍(lán)色和白色，但灰色為網(wǎng)站帶來了精致的外觀，這在人們尋找高端和值得信賴的產(chǎn)品時(shí)很有用。

紅色

紅色喚起了力量和刺激，令人興奮并讓人們采取行動(dòng)。它依賴于那些依賴沖動(dòng)購物者的公司。

它也被用來喚起緊迫感，對(duì)于清倉銷售來說非常棒。

許多網(wǎng)站如豐田和Avis都使用紅色，因?yàn)樗鼫嘏錆M活力。這是運(yùn)動(dòng)的顏色。雖然太多的紅色可能會(huì)讓人眼花繚亂令人不快，但紅色確實(shí)會(huì)產(chǎn)生極好的強(qiáng)調(diào)色，讓您的網(wǎng)站看起來更加生動(dòng)活潑。

請(qǐng)注意豐田如何在其徽標(biāo)中使用紅色，如文本、主題圖標(biāo)、以及展示其新車型之一。其余部分由簡(jiǎn)單的白色和精致的灰色組成。

黃色

太陽的顏色也喚起了樂觀和自信、透明度和創(chuàng)造力。這是令人興奮和電動(dòng)的，但太多可能會(huì)分散注意力。

相反黃色應(yīng)該用于重音。注意Bestbuy如何非常謹(jǐn)慎地使用黃色但效果很好，可以展示游客希望通過點(diǎn)擊購買來節(jié)省的費(fèi)用。

Pennzoil也很好地保守地使用黃色。與豐田一樣，機(jī)油品牌采用汽車形式的黃色來突出華麗的黑色和灰色，以達(dá)到突出效果。

橙色

橙色為網(wǎng)站訪客帶來舒適和溫暖，顏色簡(jiǎn)直友好而有趣。它還可以讓人們采取行動(dòng)，因此非常適合引導(dǎo)訪問者訂閱或購買的號(hào)召性用語。

Nickelodeon和Hooters是兩個(gè)充分利用橙色來創(chuàng)造興奮和誘惑行動(dòng)的例子。

棕色

沒有多少網(wǎng)站大量使用棕色。正如我們已經(jīng)討論的那樣，兩性都傾向于非常不喜歡它。然而，UPS不怕這個(gè)統(tǒng)計(jì)數(shù)據(jù)。

該品牌已成為其棕色卡車和類似裝飾的送貨司機(jī)的代名詞。

因此，該品牌在其網(wǎng)站設(shè)計(jì)中大量使用該顏色。只有正確的測(cè)試才能確定此配色方案是否適合您的組織。

紫色

這種顏色通常用于促進(jìn)抗衰老產(chǎn)品，因?yàn)樗哂惺婢徍玩?zhèn)靜作用。它與皇室、財(cái)富和成功息息相關(guān)。

許多品牌使用紫色如雅虎，但只有少數(shù)品牌會(huì)像啟動(dòng)網(wǎng)絡(luò)服務(wù)Big Top那樣大量使用它。

IBM Watson使用紫色，但它更像是一種口音，讓位于黑色、白色和藍(lán)色。

綠色

這種顏色有助于人們感到和諧和平衡，綠色是平衡、和平和環(huán)保意識(shí)的顏色。如果您的公司涉及農(nóng)業(yè)，綠色可能是使用的顏色?？纯碕ohn Deere的網(wǎng)站就是一個(gè)很好的例子。

大石油公司BP希望傳達(dá)一種環(huán)境友好的形象，因此很好地利用格林作為其白色背景的對(duì)比。

如何發(fā)現(xiàn)哪種顏色的吸引和轉(zhuǎn)換多?

為了幫助您為您的網(wǎng)站創(chuàng)建配色方案，請(qǐng)使用Sessions College for Professional Design提供的顏色計(jì)算器等便利工具。

該工具可以輕松確定正確的主要，互補(bǔ)、類似、三元組和其他顏色組合。

找到似乎運(yùn)作良好的那些，然后與您的觀眾一起嘗試。將您的網(wǎng)站滲透到在線流量流中，確實(shí)是了解受眾群體響應(yīng)方式的唯一且方式。

了解您的用戶如何互動(dòng)

在向觀眾展示新設(shè)計(jì)的網(wǎng)站時(shí)，請(qǐng)簡(jiǎn)單介紹一下。從蘋果的書中拿出一頁。

這個(gè)網(wǎng)站很簡(jiǎn)單。黑色背景，白色文本與一些藍(lán)色和灰色來圍繞它全部。然而，該網(wǎng)站流行起來并且看起來很花哨。在顏色和設(shè)計(jì)方面，通常更少。

Sun Trust是一個(gè)簡(jiǎn)單網(wǎng)站的另一個(gè)很好的例子，它使用藍(lán)色和橙色來吸引動(dòng)作但是通過大量的空白來保持簡(jiǎn)單。

A/B測(cè)試各種顏色和組合

據(jù)說突出的顏色是被點(diǎn)擊的顏色。雖然這在理論上可能是正確的，但只有您的網(wǎng)站訪問者真正知道他們喜歡哪種顏色。

出于這個(gè)原因，我們鼓勵(lì)您測(cè)試原色，顏色補(bǔ)充，重疊和其他所有顏色選擇，以找到觀眾常響應(yīng)的顏色。

結(jié)論

確定您網(wǎng)站的顏色可能非常耗時(shí)，也應(yīng)該如此。

網(wǎng)站顏色選擇不是任何方式可以輕易做出的決定。

另一方面，在網(wǎng)站設(shè)計(jì)時(shí)選擇合適的顏色組合可能很有趣。

使用顏色創(chuàng)建工具并使用各種方案，直到找到一個(gè)讓您的網(wǎng)站真正脫穎而出的方案。

您的觀眾一定會(huì)注意到。

但是，請(qǐng)繼續(xù)測(cè)試您的網(wǎng)站以獲得效果。很快，您就會(huì)知道您網(wǎng)站的正確顏色，讓您的觀眾留下來，參與并轉(zhuǎn)換以獲得更大的銷售和收入。