顏色不僅影響網(wǎng)站的外觀,而且影響它的有效性。這意味著,網(wǎng)站人均瀏覽時(shí)長(zhǎng),訪問者的回頭率,甚至網(wǎng)站轉(zhuǎn)化都取決于顏色方案的選擇。此外,考慮到現(xiàn)代技術(shù)的可視化,色彩扮演了互聯(lián)網(wǎng)上的主要角色之一。當(dāng)你開始自己的網(wǎng)站,你不應(yīng)該忘記這個(gè)規(guī)則。
然而,我們中的一些人很難找到一件和牛仔褲顏色相配的T恤,所以并不是所有人能夠完全清楚如何為你的網(wǎng)站選擇合適的配色方案。但不要放棄,因?yàn)槲覀冇猩实睦碚?。通過深入研究色彩理論的基本知識(shí),你將能夠創(chuàng)造美麗和有效的顏色組合。所有有經(jīng)驗(yàn)的網(wǎng)頁設(shè)計(jì)師都依賴于理論,這意味著你也可以做到這一點(diǎn)!讓我們來談?wù)勊闹饕瓌t,你會(huì)發(fā)現(xiàn)一切都比看起來容易得多。
工作工具色相環(huán)是色彩理論的基本要素。設(shè)計(jì)師應(yīng)該沒有哪個(gè)不認(rèn)識(shí)它吧?
色相環(huán)是您的主要工作工具,清晰地演示了如何創(chuàng)建和組合顏色。所有的顏色被分為三個(gè)基本色-紅色,藍(lán)色和黃色,可以用來創(chuàng)建額外的顏色,如綠色,橙色和紫色。
然而,色相環(huán)并不總是由六個(gè)部分組成,他們可以包括十二個(gè)或更多的變化。在這種情況下,六種顏色被作為主和副顏色進(jìn)行添加混合。比如黃綠色、綠藍(lán)色、藍(lán)紫色、紫紅色、桔紅色和橙黃色。因此色相環(huán)包含24個(gè)部分,甚至更多的額外色調(diào)。
冷暖色所有色相環(huán)都可以分成兩半。其中一半為暖色,如黃色,橙色和紅色(大多色相環(huán)的棕色也屬于暖色調(diào)色板)。另一半是冷色,如藍(lán)色,綠色,紫色和灰色。可能在這里會(huì)有人問:“哪種顏色更好–溫暖還是涼爽?”答案是顯而易見的——沒有“更好”的顏色。你的選擇應(yīng)該取決于你要達(dá)到的效果以及與某一特定感覺或想法的關(guān)聯(lián)。暖色被認(rèn)為是愉快的,友好的和刺激的;冷色在大多數(shù)情況下是平靜和放松的。
因此,顏色的選擇取決于你的公司風(fēng)格,需要和你想創(chuàng)造的氛圍。如果你不是很理解,不妨自己進(jìn)行實(shí)驗(yàn),你可以混合暖色和冷色可能會(huì)這樣做),來看一下效果。但關(guān)于色彩混合,我們?cè)诤竺鏁?huì)詳細(xì)地講解。
混色的基本知識(shí)根據(jù)顏色在色相環(huán)中的位置,有幾種配色方案案。讓我們先從最簡(jiǎn)單的一個(gè)開始,然后轉(zhuǎn)向更復(fù)雜的方案:
1.Complementary color scheme互補(bǔ)配色方案互補(bǔ)配色方案——你可以結(jié)合位置彼此相對(duì)的兩個(gè)對(duì)比色。例如,你可以使用紅色和綠色,或黃色和紫色。如果要得到一個(gè)更優(yōu)雅的組合,建議添加中性附加色調(diào)-米色,淺棕色,淺灰色,黑色或白色,這些都可以是背景顏色。
2.Analogous color scheme近似色配色方案近似色配色方案——一般地選取三個(gè)在色相環(huán)上位置相近的三個(gè)顏色。舉例:橙色,橙黃色和黃色;或者紫色,藍(lán)紫色和藍(lán)色。所有這些顏色都會(huì)很好地結(jié)合在一起,因?yàn)樗鼈冊(cè)谏喹h(huán)有著“鄰居”的關(guān)系。
3.Color triad三角對(duì)立配色方案說到這個(gè)方案,有必要提醒你一些基本的幾何規(guī)則。也不是什么深?yuàn)W的東西,其實(shí)沒有什么復(fù)雜的:你從色環(huán)中選取任何彼此等距三種顏色。如果你用線將它們連接起來,你會(huì)得到一個(gè)等邊三角形??赡艿慕M合是:黃綠色,橙紅色和紫藍(lán)色;黃橙,紅紫和藍(lán)綠色。這是一個(gè)非常豐富的對(duì)比方案,所以你需要找到一個(gè)平衡點(diǎn),選擇一種顏色作為主要顏色,然后再選擇另外兩種顏色。
4.Split-complementary color scheme分散互補(bǔ)色系配色方案在這個(gè)方案中,你選擇一種顏色作為主要顏色,并將其與其他兩種顏色相結(jié)合,即顏色輪上的補(bǔ)色。這個(gè)方案,如果你把選中的顏色和線條連接起來,你會(huì)得到一個(gè)等腰三角形。可能的選擇是:紅,黃綠色和藍(lán)綠色,或紫色,黃色,橙色和黃綠色。這是一個(gè)不同的方案,它比上面第一個(gè)互補(bǔ)方案的張力小。
5.Rectangle color scheme矩形配色方案這里你需要選擇兩對(duì)互補(bǔ)色。如果你用線連接它們,你會(huì)得到一個(gè)矩形。例子:黃橙,黃綠色,藍(lán)紫色和紅紫色。這個(gè)方案是不同尋常的組合,是創(chuàng)意網(wǎng)站配色的完美選擇。不過,如果你擔(dān)心創(chuàng)建一個(gè)混亂的顏色,你可以選擇一種顏色作為基礎(chǔ),然后用其他三種顏色來作為補(bǔ)充強(qiáng)調(diào)。
6.Monochromatic color scheme單色調(diào)配色方案從這個(gè)名字可以清楚地知道,這個(gè)方案結(jié)合了近似色。你既可以混合深色和淺色,也可以只選擇深色或淺色。
從理論到實(shí)踐好了,現(xiàn)在你大概了解了主要的配色方案,了解它們的優(yōu)缺點(diǎn)。讓我們看看如何在實(shí)踐中使用這些知識(shí)。這里是一些 TemplateMonster 使用不同的配色方案創(chuàng)造優(yōu)質(zhì)的 WordPress 主題。這些都是很好的例子,也是靈感的源泉。如果你仔細(xì)閱讀上面理論,試試猜一下每一個(gè)網(wǎng)站都使用了哪些顏色方案,可以在評(píng)論中與大家一起分享。
除此之外,中國(guó)設(shè)計(jì)之窗的設(shè)計(jì)欣賞頻道也分享了全球許多優(yōu)秀的網(wǎng)站設(shè)計(jì)案例。
Houston Business WordPress TemplateDetails | Demo
Bright Print Shop WordPress DesignDetails | Demo
Fast Cleaning Service WordPress ThemeDetails | Demo
Bellaina – Realtor Services WordPress TemplateDetails | Demo
Sweet Cakes and Bakery WordPress ThemeDetails | Demo
Wine Store WooCommerce ThemeDetails | Demo
Fashionable Apparel WooCommerce WebsiteDetails | Demo
Sketchfield – Web Design WordPress SiteDetails | Demo
SEO Agency WordPress ThemeDetails | Demo
Elegant Photography WP DesignDetails | Demo
WordPress Theme for Professional DesignerDetails | Demo
Reliable Financial Company WordPress ThemeDetails | Demo
Bright and Fashionable WordPress TemplateDetails | Demo
Vegetarian Restaurant WordPress ThemeDetails | Demo
Best Event Planner WordPress DesignDetails | Demo