如何(he)在(zai)(zai)(zai)你(ni)(ni)的(de)(de)網(wang)頁(ye)(ye)設(she)計(ji)中使(shi)用(yong)正確(que)的(de)(de)顏(yan)色(se)(se)疊加(jia)(jia)  在(zai)(zai)(zai)網(wang)頁(ye)(ye)設(she)計(ji)中，顏(yan)色(se)(se)幾乎是(shi)(shi)任何(he)設(she)計(ji)的(de)(de)重(zhong)要組成部分。無(wu)論你(ni)(ni)是(shi)(shi)那些明亮(liang)，大膽(dan)色(se)(se)調(diao)的(de)(de)“忠粉”，還是(shi)(shi)喜歡更(geng)(geng)簡約(yue)的(de)(de)黑色(se)(se)和白色(se)(se)，你(ni)(ni)所使(shi)用(yong)的(de)(de)顏(yan)色(se)(se)可(ke)以對整體設(she)計(ji)產生很大的(de)(de)影響。顏(yan)色(se)(se)疊加(jia)(jia)的(de)(de)作(zuo)用(yong)之一在(zai)(zai)(zai)于，你(ni)(ni)可(ke)以在(zai)(zai)(zai)你(ni)(ni)的(de)(de)網(wang)頁(ye)(ye)設(she)計(ji)中使(shi)用(yong)顏(yan)色(se)(se)進行強調(diao)聲(sheng)明。這(zhe)意味著你(ni)(ni)可(ke)以使(shi)用(yong)半帶有(you)透明度的(de)(de)顏(yan)色(se)(se)塊來覆蓋圖片或視頻。這(zhe)種效(xiao)果可(ke)以增加(jia)(jia)圖像的(de)(de)意義，使(shi)其在(zai)(zai)(zai)整體的(de)(de)設(she)計(ji)中引起更(geng)(geng)多(duo)的(de)(de)關(guan)注，并幫助你(ni)(ni)在(zai)(zai)(zai)大部分有(you)限的(de)(de)藝術中做出選擇。

1.使用純色來設置你的“主調”

純色(se)(se)(se)覆蓋層可以(yi)像(xiang)梯度(du)(du)圖(tu)案一(yi)樣(yang)(yang)醒目，但通常，顏色(se)(se)(se)的(de)(de)選擇具有(you)更(geng)(geng)多(duo)不同意義的(de)(de)關(guan)聯性。例如，考慮一(yi)個棕褐色(se)(se)(se)疊(die)加，它能(neng)夠(gou)立即引起(qi)舊時代(dai)和(he)(he)歷史的(de)(de)感(gan)覺(jue)。同樣(yang)(yang)的(de)(de)原理可以(yi)用(yong)在使(shi)用(yong)那些(xie)流行趨勢色(se)(se)(se)上面(mian)。通過(guo)使(shi)用(yong)與平面(mian)或(huo)材料設計相關(guan)的(de)(de)明(ming)(ming)亮，飽和(he)(he)的(de)(de)顏色(se)(se)(se)，你可以(yi)喚起(qi)現(xian)代(dai)主義或(huo)高級時裝(zhuang)的(de)(de)感(gan)覺(jue)。當(dang)使(shi)用(yong)單一(yi)顏色(se)(se)(se)作(zuo)為顏色(se)(se)(se)疊(die)加的(de)(de)覆蓋層時，請(qing)一(yi)定要考慮顏色(se)(se)(se)的(de)(de)飽和(he)(he)度(du)(du)和(he)(he)透明(ming)(ming)度(du)(du)。這些(xie)元素同樣(yang)(yang)可以(yi)添加不同意義。更(geng)(geng)重(zhong)的(de)(de)顏色(se)(se)(se)組（更(geng)(geng)少的(de)(de)透明(ming)(ming)度(du)(du)和(he)(he)更(geng)(geng)飽和(he)(he)度(du)(du)）比起(qi)它背后(hou)的(de)(de)圖(tu)像(xiang)，更(geng)(geng)多(duo)的(de)(de)關(guan)注(zhu)點在于(yu)顏色(se)(se)(se)本身(shen)上。相反，更(geng)(geng)輕，更(geng)(geng)細微的(de)(de)顏色(se)(se)(se)組合更(geng)(geng)加專注(zhu)于(yu)圖(tu)像(xiang)上。

2.考慮暗(an)色或亮色 

你不(bu)必總是(shi)使用(yong)(yong)(yong)那(nei)些多彩的(de)(de)(de)顏(yan)色(se)本(ben)身來創建疊(die)加(jia)層(ceng)。有(you)時它(ta)也(ye)可(ke)(ke)以(yi)(yi)是(shi)黑色(se)，白(bai)色(se)或灰色(se)的(de)(de)(de)。使用(yong)(yong)(yong)這(zhe)些色(se)調和(he)主(zhu)題(ti)可(ke)(ke)以(yi)(yi)真正(zheng)改(gai)變(bian)你網(wang)(wang)站設計的(de)(de)(de)整體“情緒”。正(zheng)如(ru)你可(ke)(ke)能(neng)關(guan)聯想(xiang)到的(de)(de)(de)，顏(yan)色(se)更深的(de)(de)(de)覆蓋層(ceng)可(ke)(ke)以(yi)(yi)創建一(yi)個更弄厚的(de)(de)(de)情緒環境。亮色(se)疊(die)加(jia)與(yu)樂(le)趣之間有(you)一(yi)種獨特的(de)(de)(de)相關(guan)聯。這(zhe)里(li)還有(you)一(yi)個貢獻(xian)因素，當我們談及(ji)(ji)黑白(bai)之間搭配做(zuo)產生感覺的(de)(de)(de)時候，那(nei)就(jiu)是(shi)圖像(xiang)本(ben)身。 它(ta)是(shi)如(ru)何(he)與(yu)色(se)調或主(zhu)題(ti)協同工作(zuo)呢？圖像(xiang)、顏(yan)色(se)以(yi)(yi)及(ji)(ji)消息他們能(neng)和(he)諧的(de)(de)(de)在(zai)一(yi)起產生意想(xiang)不(bu)到的(de)(de)(de)作(zuo)用(yong)(yong)(yong)嗎？在(zai)上(shang)面Call me Ish的(de)(de)(de)網(wang)(wang)站設計中，正(zheng)如(ru)你所(suo)看到的(de)(de)(de)，整個網(wang)(wang)頁設計使用(yong)(yong)(yong)白(bai)色(se)的(de)(de)(de)覆蓋層(ceng)，以(yi)(yi)幫助將焦點(dian)放在(zai)黑白(bai)照片上(shang)的(de)(de)(de)單(dan)詞(ci)。但(dan)請(qing)注(zhu)意攝影師(shi)臉上(shang)的(de)(de)(de)表(biao)情：他笑得很開朗。顏(yan)色(se)和(he)照片組合使用(yong)(yong)(yong)形成(cheng)一(yi)種無形的(de)(de)(de)邀請(qing)，讓你更想(xiang)與(yu)攝影師(shi)互動(dong)，甚至(zhi)可(ke)(ke)能(neng)雇用(yong)(yong)(yong)他工作(zuo)。 

3.嘗(chang)試使用(yong)漸變色 

漸變(bian)(bian)又逐(zhu)漸成為流行趨(qu)勢之一(yi)。當你(ni)想使(shi)用(yong)(yong)顏(yan)色(se)(se)(se)(se)疊加層(ceng)時，漸變(bian)(bian)會創(chuang)造一(yi)個非常好的(de)(de)(de)(de)（醒目的(de)(de)(de)(de)）視覺效果。關于(yu)漸變(bian)(bian)的(de)(de)(de)(de)特(te)別好處在于(yu)，你(ni)可以使(shi)用(yong)(yong)幾種不同的(de)(de)(de)(de)顏(yan)色(se)(se)(se)(se)來搭(da)配(pei)工作（這點(dian)需要全面綜(zong)合的(de)(de)(de)(de)考(kao)慮你(ni)的(de)(de)(de)(de)品牌）或使(shi)用(yong)(yong)單一(yi)顏(yan)色(se)(se)(se)(se)創(chuang)建焦(jiao)點(dian)。明(ming)亮(liang)的(de)(de)(de)(de)配(pei)對可以幫助吸引用(yong)(yong)戶進入到你(ni)的(de)(de)(de)(de)網站設計中，給(gei)圖(tu)像制造一(yi)些閃光點(dian)。這個趨(qu)勢很大一(yi)部分(fen)可以追溯到Spotify網站，它(ta)最先開(kai)始使(shi)用(yong)(yong)漸變(bian)(bian)和雙色(se)(se)(se)(se)覆蓋來突(tu)出播放列表。顏(yan)色(se)(se)(se)(se)使(shi)用(yong)(yong)戶用(yong)(yong)于(yu)顯示的(de)(de)(de)(de)封面圖(tu)（音(yin)樂(le)家的(de)(de)(de)(de)介紹圖(tu)）提供了新的(de)(de)(de)(de)活力(li)。這是(shi)一(yi)個很容(rong)易復制的(de)(de)(de)(de)概念：· 選擇一(yi)張(zhang)照片；· 使(shi)用(yong)(yong)你(ni)的(de)(de)(de)(de)品牌色(se)(se)(se)(se)創(chuang)建一(yi)個顏(yan)色(se)(se)(se)(se)漸變(bian)(bian)；· 享受他給(gei)你(ni)的(de)(de)(de)(de)網頁(ye)設計以及(ji)你(ni)自己帶來的(de)(de)(de)(de)樂(le)趣。

4.選擇(ze)高(gao)對(dui)比度圖像

當你在(zai)你的(de)(de)(de)網(wang)頁設計項目(mu)中(zhong)規劃圖(tu)(tu)像(xiang)疊(die)加時，照(zhao)片（或(huo)視頻）的(de)(de)(de)組(zu)成方式是(shi)(shi)極(ji)其重(zhong)要的(de)(de)(de)。一(yi)(yi)個(ge)平(ping)淡(dan)(dan)的(de)(de)(de)圖(tu)(tu)像(xiang)結果(guo)將(jiang)留給(gei)用戶一(yi)(yi)個(ge)平(ping)淡(dan)(dan)的(de)(de)(de)顏色疊(die)加感覺。但是(shi)(shi)，如果(guo)你開始使用具有(you)大量對比度的(de)(de)(de)照(zhao)片，凸(tu)顯圖(tu)(tu)像(xiang)的(de)(de)(de)深色和(he)淺色的(de)(de)(de)空間，你將(jiang)獲(huo)得效果(guo)。如果(guo)你的(de)(de)(de)圖(tu)(tu)片沒有(you)足夠的(de)(de)(de)對比度，請考(kao)慮在(zai)照(zhao)片編(bian)輯(ji)軟件中(zhong)添(tian)(tian)加對比度或(huo)選擇(ze)其他圖(tu)(tu)片。否(fou)則(ze)，圖(tu)(tu)像(xiang)在(zai)實(shi)際中(zhong)發(fa)揮的(de)(de)(de)效果(guo)可能會過(guo)于(yu)平(ping)淡(dan)(dan)。這里還有(you)一(yi)(yi)個(ge)小竅門，并且實(shi)現(xian)這種效果(guo)是(shi)(shi)從(cong)一(yi)(yi)張(zhang)黑白照(zhao)片開始的(de)(de)(de)。特別(bie)是(shi)(shi)對于(yu)初學者，在(zai)黑白圖(tu)(tu)像(xiang)中(zhong)可以更容(rong)易(yi)地看到(dao)增強對比度將(jiang)給(gei)圖(tu)(tu)像(xiang)帶來怎(zen)么樣的(de)(de)(de)變化。Just Actions提(ti)供了一(yi)(yi)個(ge)在(zai)黑白色圖(tu)(tu)像(xiang)旁邊添(tian)(tian)加彩色疊(die)加的(de)(de)(de)一(yi)(yi)個(ge)很好的(de)(de)(de)例子（通過(guo)添(tian)(tian)加疊(die)色，是(shi)(shi)的(de)(de)(de)原本沒有(you)黑白的(de)(de)(de)，沒有(you)鮮艷對比度的(de)(de)(de)配(pei)圖(tu)(tu)產生一(yi)(yi)種極(ji)具吸引力的(de)(de)(de)效果(guo)）。

5.圖片應(ying)該(gai)看起來自然（或(huo)相(xiang)反）

當涉及到使(shi)用(yong)顏(yan)色(se)疊(die)(die)加(jia)時，你(ni)(ni)有(you)兩個選(xuan)擇：a.添加(jia)疊(die)(die)色(se)效果(guo)以(yi)后，圖(tu)(tu)片應該(gai)仍然看起來(lai)自(zi)然。顏(yan)色(se)、光照和(he)陰影應該(gai)出現(xian)在自(zi)然的(de)(de)(de)位置。疊(die)(die)加(jia)應該(gai)呈現(xian)的(de)(de)(de)微(wei)妙一(yi)些(xie)，而(er)不(bu)是過(guo)于(yu)強烈，如(ru)上(shang)面(mian)的(de)(de)(de)Abednego Coffee網站設計(ji)。b.添加(jia)疊(die)(die)色(se)效果(guo)以(yi)后，使(shi)得圖(tu)(tu)像(xiang)看起來(lai)完(wan)全改(gai)變。但是這種方(fang)式的(de)(de)(de)最好方(fang)法是你(ni)(ni)要盡量不(bu)要讓用(yong)戶猜到你(ni)(ni)在圖(tu)(tu)像(xiang)上(shang)面(mian)使(shi)用(yong)了顏(yan)色(se)疊(die)(die)加(jia)（例如(ru)本文中(zhong)的(de)(de)(de)大多數(shu)示例）。這里(li)沒有(you)真(zhen)正的(de)(de)(de)中(zhong)間地帶。如(ru)果(guo)你(ni)(ni)在圖(tu)(tu)像(xiang)上(shang)使(shi)用(yong)的(de)(de)(de)不(bu)屬于(yu)這些(xie)“極端”方(fang)式之一(yi)，用(yong)戶可(ke)能會偏(pian)向對顏(yan)色(se)太過(guo)認真(zhen)，而(er)不(bu)會專注于(yu)網站的(de)(de)(de)內(nei)容。你(ni)(ni)不(bu)會想用(yong)彩色(se)疊(die)(die)加(jia)技(ji)術來(lai)分散(san)注意力(li)的(de)(de)(de)，相反，它應該(gai)增強整體網站設計(ji)。

6.嘗試疊(die)加強調口(kou)號

雖然前面(mian)(mian)的(de)(de)(de)例(li)子(zi)顯示了(le)對(dui)大圖(tu)像使(shi)用(yong)顏(yan)色(se)(se)(se)(se)疊加(jia)的(de)(de)(de)方(fang)(fang)(fang)法，例(li)如在(zai)(zai)banner圖(tu)上(shang)添加(jia)，但這并(bing)不(bu)是充分(fen)利用(yong)這種(zhong)技術(shu)的(de)(de)(de)方(fang)(fang)(fang)法。顏(yan)色(se)(se)(se)(se)疊加(jia)效果也(ye)可以很好地(di)使(shi)用(yong)在(zai)(zai)強調(diao)口號性的(de)(de)(de)文案上(shang)。上(shang)面(mian)(mian)的(de)(de)(de)兩個例(li)子(zi)顯示了(le)有(you)(you)(you)效地(di)實現這些的(de)(de)(de)不(bu)同方(fang)(fang)(fang)式。在(zai)(zai)上(shang)面(mian)(mian)的(de)(de)(de)例(li)子(zi)中，Knot Clothing的(de)(de)(de)網(wang)(wang)站設(she)(she)計(ji)(ji)使(shi)用(yong)明亮的(de)(de)(de)綠色(se)(se)(se)(se)的(de)(de)(de)，并(bing)帶有(you)(you)(you)透明度(du)的(de)(de)(de)導航欄(lan)。它進一(yi)步突出了(le)在(zai)(zai)它之上(shang)的(de)(de)(de)所有(you)(you)(you)實線。這種(zhong)效果有(you)(you)(you)助于在(zai)(zai)整(zheng)個網(wang)(wang)頁設(she)(she)計(ji)(ji)中保持統一(yi)的(de)(de)(de)品(pin)牌(pai)調(diao)色(se)(se)(se)(se)板，同時展示各種(zhong)其他顏(yan)色(se)(se)(se)(se)。簡單的(de)(de)(de)效果，有(you)(you)(you)助于頁面(mian)(mian)看起來更柔軟，比導航在(zai)(zai)一(yi)個純(chun)色(se)(se)(se)(se)內，并(bing)且(qie)向下瀏覽，全部(bu)網(wang)(wang)站設(she)(she)計(ji)(ji)一(yi)覽無余以及平淡來說(shuo)，更具質(zhi)感和設(she)(she)計(ji)(ji)感。Nuts and Woods的(de)(de)(de)網(wang)(wang)站設(she)(she)計(ji)(ji)則采(cai)取(qu)另(ling)一(yi)種(zhong)方(fang)(fang)(fang)法。該設(she)(she)計(ji)(ji)使(shi)用(yong)顏(yan)色(se)(se)(se)(se)疊加(jia)層(ceng)作為(wei)懸停效果，以便(bian)用(yong)戶(hu)能更多地(di)了(le)解網(wang)(wang)站上(shang)的(de)(de)(de)特(te)定(ding)項目(mu)。獲(huo)取(qu)紅色(se)(se)(se)(se)疊加(jia)層(ceng)的(de)(de)(de)任何元素也(ye)是可點(dian)擊元素。這個設(she)(she)計(ji)(ji)值得注意的(de)(de)(de)是，顏(yan)色(se)(se)(se)(se)疊加(jia)層(ceng)為(wei)用(yong)戶(hu)提供了(le)一(yi)個視覺提示，告(gao)訴他們他們想要知道什么(me)，并(bing)為(wei)整(zheng)個內容提供鏈接的(de)(de)(de)路(lu)徑。