網站設計之哪些色彩搭配應該拉入“黑名單"
2017.02.28
色彩搭配是一門非常有深度的學問，每個人每天都在進行著與色彩搭配有關的選擇，如今天衣服穿什麼顏色，辦公桌上插花的色彩選擇、對午餐搭配的選擇等等，這些都是我們日常生活中最為常見的色彩搭配選擇。在網站設計中色彩搭配和選擇主要體現在網站頁麵的設計上，如頁麵各個部分色彩的搭配、文字顏色的選擇、按鈕顏色的選擇等。
接下來就一起和分形科技看一看在網站設計中哪些色彩搭配是應該拉入“黑名單”的吧！
第一，將太亮的霓虹色拉入黑名單
閃(shan)亮(liang)的(de)霓(ni)虹(hong)色(se)一(yi)直(zhi)是(shi)夜(ye)色(se)下(xia)裝(zhuang)點(dian)城(cheng)市(shi)的(de)主(zhu)色(se)，霓(ni)虹(hong)燈(deng)可(ke)以(yi)組(zu)成(cheng)各(ge)種(zhong)肖(xiao)趣(qu)的(de)圖(tu)案(an)，很(hen)多(duo)設(she)計(ji)師(shi)會(hui)想(xiang)到(dao)將(jiang)這(zhe)些(xie)受(shou)人(ren)喜(xi)歡(huan)的(de)顏(yan)色(se)應(ying)用(yong)於(yu)網(wang)站(zhan)設(she)計(ji)。但(dan)是(shi)在(zai)實(shi)際(ji)生(sheng)活(huo)中(zhong)受(shou)歡(huan)迎(ying)的(de)霓(ni)虹(hong)色(se)在(zai)網(wang)站(zhan)中(zhong)並(bing)不(bu)受(shou)用(yong)戶(hu)的(de)喜(xi)歡(huan)，它(ta)往(wang)往(wang)會(hui)讓(rang)用(yong)戶(hu)有(you)“閃瞎了”的不適感。
所(suo)以(yi)建(jian)議(yi)將(jiang)霓(ni)虹(hong)色(se)接(jie)入(ru)黑(hei)名(ming)單(dan)，原(yuan)因(yin)在(zai)於(yu)霓(ni)虹(hong)色(se)的(de)文(wen)字(zi)內(nei)容(rong)不(bu)好(hao)識(shi)別(bie)，不(bu)利(li)於(yu)閱(yue)讀(du)，尤(you)其(qi)是(shi)和(he)暗(an)色(se)調(tiao)的(de)背(bei)景(jing)搭(da)配(pei)的(de)時(shi)候(hou)這(zhe)種(zhong)晃(huang)眼(yan)的(de)感(gan)覺(jiao)更(geng)加(jia)明(ming)顯(xian)。如(ru)果(guo)用(yong)霓(ni)虹(hong)色(se)做(zuo)背(bei)景(jing)的(de)話(hua)，我(wo)們(men)可(ke)以(yi)想(xiang)象(xiang)那(na)是(shi)怎(zen)樣(yang)一(yi)個(ge)眼(yan)花(hua)繚(liao)亂(luan)的(de)效(xiao)果(guo)，簡(jian)直(zhi)一(yi)片(pian)閃(shan)耀(yao)什(shen)麼(me)都(dou)看(kan)不(bu)清(qing)楚(chu)。
合理規避“震顫”色的方法：
1、不要將高飽和度的色彩放在一起；
2、不要將在色輪上是互補色或是相隔180度處理對稱位置的兩種色彩放在一起；3、將兩種色彩轉化為灰度之後，兩者灰度非常接近的色彩不要放在一起。
建議解決方法：在必須用時加入中性的色彩將兩者分隔開來。
第三，將淺色+淺色的色彩搭配拉入黑名單
色+淺色的色彩搭配是網站設計中非常常見的一種錯識的色彩搭配方式，這樣的設計會讓用戶很難閱讀其中的內容。在網站Banner圖的設計中經常出現這種色彩搭配錯誤，即文字的色彩正好和背景色彩中最淺的部分疊加在一起，造成了閱讀障礙，降低了Banner應該起到的作用。
建議修複方法：選擇色彩均勻統一的背景，文字部分的色彩要與背景色之構成對比，或是嚐試調整整個背景圖片的色調、明暗、飽和度等，以達成提升對比度的效果。
第四，將“K”黑色拉入黑名單
“K”黑指的是CMYK中的K黑(hei)色(se)，很(hen)網(wang)設(she)計(ji)網(wang)站(zhan)設(she)計(ji)時(shi)用(yong)的(de)圖(tu)很(hen)可(ke)以(yi)會(hui)被(bei)使(shi)用(yong)到(dao)印(yin)刷(shua)品(pin)上(shang)，但(dan)是(shi)我(wo)們(men)需(xu)要(yao)知(zhi)道(dao)網(wang)頁(ye)中(zhong)使(shi)用(yong)的(de)黑(hei)色(se)與(yu)印(yin)刷(shua)品(pin)中(zhong)使(shi)用(yong)的(de)黑(hei)色(se)是(shi)不(bu)一(yi)樣(yang)的(de)，二(er)者(zhe)有(you)碰(peng)上(shang)巨(ju)大(da)的(de)差(cha)別(bie)。
網頁用的純黑的色值為#000000，而印刷品中的純黑的色值是C75、M68、Y67、K90，這種色彩使用到印刷品中會有微微泛藍的現象。
建議解決方法：網站設計在使用黑色時可以挑選一個帶有你的品牌色調的黑色，而不是色值為#000000的純黑色，這樣可以在用到印刷品上時更容易協調。薦讀文章：網站設計中如何讓你的網站色彩會說話
色彩搭配選擇在網站設計工作中是非常得要的，它是網站設計師們的必備技能之一就是色彩搭配，一個和諧的、合理的色彩搭配方案可以讓企業網站在吸引用戶和推廣宣傳上更具優勢。這裏設計師需要注意的是：並(bing)不(bu)是(shi)所(suo)有(you)的(de)色(se)彩(cai)搭(da)配(pei)都(dou)是(shi)合(he)理(li)的(de)，如(ru)果(guo)你(ni)在(zai)網(wang)站(zhan)設(she)計(ji)中(zhong)的(de)色(se)彩(cai)搭(da)配(pei)不(bu)當(dang)，那(na)麼(me)很(hen)容(rong)易(yi)為(wei)企(qi)業(ye)網(wang)站(zhan)帶(dai)來(lai)不(bu)良(liang)好(hao)用(yong)戶(hu)體(ti)驗(yan)，這(zhe)樣(yang)用(yong)戶(hu)將(jiang)會(hui)放(fang)棄(qi)你(ni)的(de)網(wang)站(zhan)。
接下來就一起和分形科技看一看在網站設計中哪些色彩搭配是應該拉入“黑名單”的吧！
第一，將太亮的霓虹色拉入黑名單
閃(shan)亮(liang)的(de)霓(ni)虹(hong)色(se)一(yi)直(zhi)是(shi)夜(ye)色(se)下(xia)裝(zhuang)點(dian)城(cheng)市(shi)的(de)主(zhu)色(se)，霓(ni)虹(hong)燈(deng)可(ke)以(yi)組(zu)成(cheng)各(ge)種(zhong)肖(xiao)趣(qu)的(de)圖(tu)案(an)，很(hen)多(duo)設(she)計(ji)師(shi)會(hui)想(xiang)到(dao)將(jiang)這(zhe)些(xie)受(shou)人(ren)喜(xi)歡(huan)的(de)顏(yan)色(se)應(ying)用(yong)於(yu)網(wang)站(zhan)設(she)計(ji)。但(dan)是(shi)在(zai)實(shi)際(ji)生(sheng)活(huo)中(zhong)受(shou)歡(huan)迎(ying)的(de)霓(ni)虹(hong)色(se)在(zai)網(wang)站(zhan)中(zhong)並(bing)不(bu)受(shou)用(yong)戶(hu)的(de)喜(xi)歡(huan)，它(ta)往(wang)往(wang)會(hui)讓(rang)用(yong)戶(hu)有(you)“閃瞎了”的不適感。
所(suo)以(yi)建(jian)議(yi)將(jiang)霓(ni)虹(hong)色(se)接(jie)入(ru)黑(hei)名(ming)單(dan)，原(yuan)因(yin)在(zai)於(yu)霓(ni)虹(hong)色(se)的(de)文(wen)字(zi)內(nei)容(rong)不(bu)好(hao)識(shi)別(bie)，不(bu)利(li)於(yu)閱(yue)讀(du)，尤(you)其(qi)是(shi)和(he)暗(an)色(se)調(tiao)的(de)背(bei)景(jing)搭(da)配(pei)的(de)時(shi)候(hou)這(zhe)種(zhong)晃(huang)眼(yan)的(de)感(gan)覺(jiao)更(geng)加(jia)明(ming)顯(xian)。如(ru)果(guo)用(yong)霓(ni)虹(hong)色(se)做(zuo)背(bei)景(jing)的(de)話(hua)，我(wo)們(men)可(ke)以(yi)想(xiang)象(xiang)那(na)是(shi)怎(zen)樣(yang)一(yi)個(ge)眼(yan)花(hua)繚(liao)亂(luan)的(de)效(xiao)果(guo)，簡(jian)直(zhi)一(yi)片(pian)閃(shan)耀(yao)什(shen)麼(me)都(dou)看(kan)不(bu)清(qing)楚(chu)。
建議解決方法：適當的降低霓虹色的亮度，讓它看起來不那和閃耀讓用戶感覺到和諧。
第二，將“震顫”的色彩拉入黑名單
“震顫”的色彩指的是那些高飽和度的色彩，這些色彩搭配在一起時會產生一種“震顫效應”，讓看到的人產生兩種色彩之間會產生模糊、震顫或者發出光暈的視覺效果。這種色彩會讓人暈眩產品生不適，所以建議將其收入黑名單。
合理規避“震顫”色的方法：
1、不要將高飽和度的色彩放在一起；
2、不要將在色輪上是互補色或是相隔180度處理對稱位置的兩種色彩放在一起；3、將兩種色彩轉化為灰度之後，兩者灰度非常接近的色彩不要放在一起。
建議解決方法：在必須用時加入中性的色彩將兩者分隔開來。
第三，將淺色+淺色的色彩搭配拉入黑名單
色+淺色的色彩搭配是網站設計中非常常見的一種錯識的色彩搭配方式，這樣的設計會讓用戶很難閱讀其中的內容。在網站Banner圖的設計中經常出現這種色彩搭配錯誤，即文字的色彩正好和背景色彩中最淺的部分疊加在一起，造成了閱讀障礙，降低了Banner應該起到的作用。
建議修複方法：選擇色彩均勻統一的背景，文字部分的色彩要與背景色之構成對比，或是嚐試調整整個背景圖片的色調、明暗、飽和度等，以達成提升對比度的效果。
第四，將“K”黑色拉入黑名單
“K”黑指的是CMYK中的K黑(hei)色(se)，很(hen)網(wang)設(she)計(ji)網(wang)站(zhan)設(she)計(ji)時(shi)用(yong)的(de)圖(tu)很(hen)可(ke)以(yi)會(hui)被(bei)使(shi)用(yong)到(dao)印(yin)刷(shua)品(pin)上(shang)，但(dan)是(shi)我(wo)們(men)需(xu)要(yao)知(zhi)道(dao)網(wang)頁(ye)中(zhong)使(shi)用(yong)的(de)黑(hei)色(se)與(yu)印(yin)刷(shua)品(pin)中(zhong)使(shi)用(yong)的(de)黑(hei)色(se)是(shi)不(bu)一(yi)樣(yang)的(de)，二(er)者(zhe)有(you)碰(peng)上(shang)巨(ju)大(da)的(de)差(cha)別(bie)。
網頁用的純黑的色值為#000000，而印刷品中的純黑的色值是C75、M68、Y67、K90，這種色彩使用到印刷品中會有微微泛藍的現象。
建議解決方法：網站設計在使用黑色時可以挑選一個帶有你的品牌色調的黑色，而不是色值為#000000的純黑色，這樣可以在用到印刷品上時更容易協調。薦讀文章：網站設計中如何讓你的網站色彩會說話
