網絡是彩虹般多姿多彩的世界。色彩是吸引用戶注意力的重要工具，提供視覺興趣和影響力，并為可讀性創造對比。顏色也是許多設計趨勢的中心，包括平面和材質樣式。

但是你可以用顏色錯誤嗎？你應該避開的色彩或組合？總而言之，是的！今天，我們正在尋找在設計網站和應用程序時應避免的顏色或顏色組合。（如果您已經犯了其中一個錯誤，我們也會提供替代建議。）

霓虹燈

 

霓虹燈的顏色可以很有趣，很炫，為設計添加大量流行元素。不幸的是，它們的眼睛非常難看，給用戶“撕心裂肺”的感覺，讓所有人都感到痛苦。

霓虹燈的問題在于它們太亮而無法輕松閱讀，并導致配合黑暗或淺色背景的問題。當與文本一起使用時，霓虹燈會呈現可讀性問題，因為字母會滲入背景。霓虹燈背景往往壓倒性的，并分散設計中的主要信息。

 

試試這個：從霓虹顏色中去掉一些亮度，使它們在屏幕上看起來更暗，更微妙。

Orange You Glad做了一項出色的工作，將幾乎所有的霓虹色彩以多種方式融入他們主頁的設計中。共同的主題是，霓虹燈用于較小的元素和微妙的顏色變化，使粉紅色，黃色和綠色更容易在眼睛上。

“振動”的顏色

 

當高度飽和的顏色配對時，它們會產生一種“振動效果”，在這種效果下，顏色似乎幾乎在模糊或發光的運動中移動。你不想這樣做。

色彩理論家約瑟夫阿爾伯斯在他的經典指南“ 色彩相互作用：”中提到，這種震動對用戶而言可能是令人不安的。“這種最初激動人心的效果也會讓人感到侵略性，甚至對我們的眼睛感到不舒服。人們發現它很少使用，除了在廣告中出現尖叫效應，結果令人不快，不喜歡和避免。“

您幾乎可以預測在將它們并排放置之前會使顏色產生振動的原因。

每種顏色的高飽和度

色輪上的補充

色輪上相隔180度

將顏色轉換為灰度，幾乎不會產生對比

一個典型的例子是明亮的紅色和綠色。流行的“圣誕節”組合是最大的（也是最廣泛使用的）顏色犯罪之一。這些組合也提出了可訪問性問題，因為它們對色盲患者無法解讀。

試試這個：如果你必須使用“振動”顏色組合，用其他東西（最好是中性）將它們分開。

燈光

 

這是一直發生的錯誤之一。也許這是因為你可以將它與打印項目結合起來，也許這是因為某些屏幕設置使其可行，但淺色組合只是不會削減它。

這些內容很難閱讀

這是最大的罪行似乎發生的地方：英雄標題，圖像和白色文字配對，但文字落在圖像的光線部分。在這一點上，這些話是不可讀的。它發生的方式比它應該更頻繁。如果每封信都不清晰可讀，則需要重新考慮。

試試這個：謝天謝地，這個問題有相當簡單的修復：

 

選擇一個顏色一致的新圖像。

 

在顏色變化很多的圖像上面使用彩色框來顯示文字。

 

考慮全彩色圖像疊加，以增加背景和文本元素之間的對比度。

任何彩虹色

 

雖然幾乎不用說，但彩虹色的網站卻不起作用。（想想現在你腦子里描繪一個以彩虹為主題的網站，你打破了多少顏色理論規則。）

彩虹的顏色組合是壓倒性的和壓倒性的。他們最初可能會抓住用戶的注意力，但一旦他或她意識到內容是無法解讀的，他肯定會反彈。

 

試試這個：如果你想使用廣泛的調色板 - 就像趨勢一樣 - 選擇顏色阻擋或卡片樣式，其中顏色可以與元素相關聯。這種容器式的設計可以讓顏色更具靈活性，同時營造組織和流動感。

明亮/黑暗

 

就像點亮燈光一樣，相似顏色飽和度的組合也會導致問題。它應該不言而喻，但避免它們。

如果您認為這不會發生在您身上，請在使用單色配色方案時小心。那時設計師傾向于在這里滑倒。（如有疑問，請使用更多對比。）

 

試試這個：相反地??思考。如果您想要使用多種明亮或深色的顏色，請將它們視為滾動網站中屏幕的選項。您可以使用您喜歡的所有黑色或亮色，并保持可讀性和可用性。（這是雙贏！）

“K”黑色

 

特別是如果你頻繁地在印刷和網絡項目之間交叉 - 正如許多設計師所做的那樣 - 純黑色可能會誤入網絡項目。在印刷項目中被稱為“K”黑色，因為它在數字項目中只使用一塊板或“純”黑色（＃000000），這種顏色只是平坦的。

想想現實，黑色的所有組合實際上都是用其他色調過濾以賦予其豐富性。（即使烏鴉的羽毛在正確的光線下經常看起來是藍色或者更多的紫色。）使用包括其他顏色的黑色組合來創建豐富的深色，并保存純黑色用于打印。

 

試試這個吧：嘗試一種與你的品牌相匹配的黑色，或添加正確的顏色內涵。黑色變為灰色越多，妝容就越容易看到。考慮周圍顏色的黑色，并考慮每種顏色的構成以及它們如何相互關聯。（例如，使用帶有稍微藍色調的黑色來抵消文字或其他元素的橙色或黃色色調。）例如，上述Wonderland的顏色為＃0a0a0b。

結論

避免這些顏色和組合的最大原因是缺乏可讀性和對比度。實際情況是，正確的顏色選擇和充足的對比度，幾乎任何色調都可以適度運作。

但是有一個問題！你可能不得不使它變得比預期的更暗或更輕，以使其工作。請記住，顏色會從周圍環境中獲取屬性（包括來自屏幕的背光），因此必須進行相應調整。

這是你今天的“訣竅：”如果你不得不斜視，質疑或移動屏幕以查看某些東西，那么顏色不起作用，你需要轉向其他東西。