在用戶界面中使用暗色和暗色的背景，現(xiàn)在仍然屬于較具有爭議的問題。難怪它是如此的真實：例如在音樂播放軟件中使用合適的播放背景，對于功能效率都有著至關(guān)重要的作用。反之，也可以造成界面中周邊布局和功能的解決方案，現(xiàn)在就說說采用暗色背景的一些利用和陷阱，對暗色調(diào)的使用更加運用自如。
在以前的文章中，曾經(jīng)分析過可能會影響到配色方案以及背景顏色的選擇的一些提及到一些，這一次將會詳細(xì)討論暗色調(diào)的使用：在網(wǎng)站和移動端應(yīng)用的優(yōu)缺點，對于Tubik工作室的客戶測試分析和實際工作投入，在暗色背景方面可以提供良好的用戶體驗和強大的吸引力解決方案。現(xiàn)在就讓我們進入正題吧！
暗色調(diào)
2009年在ProBlogger就公布過一份調(diào)查報告，其中可以看到一些比較有趣的觀點，例如詢問訪客喜歡在所訪問的博客上看到什么樣的背景顏色，結(jié)果幾乎一半的讀者回答到背景合理就是最好的，因為博客是傳統(tǒng)平面的傳承，可讀性勝過其他。然而有10%的受訪者表示：更喜歡暗色背景，另外還要取決于博客的內(nèi)容和性質(zhì)。所以設(shè)計師在尋找相應(yīng)的解決方案時，不應(yīng)該忽略掉這么大用戶的想法，特別時在數(shù)字化產(chǎn)品中文本內(nèi)容占據(jù)主導(dǎo)地位的情況下，從另一個方面也可以看出用戶研究和調(diào)查也是設(shè)計過程的重要組成部分，了解了用戶所希望或訴求，我們就能在這方面推動到傳統(tǒng)平面印刷所未達到的高度。
其中 Richard H. Hall 和Patrick Hanna就對背景顏色的視覺呈現(xiàn)做出來一個合理的解釋，其中對于視覺的感知中的應(yīng)用場景就是一個因素，在很早以前就實際中網(wǎng)頁性能和可讀性領(lǐng)域做了不同的科學(xué)分析，作者總結(jié)出《設(shè)計中合理的色彩組合可以造成更好的效果》，并強調(diào)更好的色彩組合的實際效果要高于單純的視覺對比度。因此暗色調(diào)的背景在一定程度上是有效的，特別是當(dāng)其他元素在淺色的時候。在元素之間進行布局時，特定的對比度和清晰度，設(shè)計上是相對而言很有效的方式。這項研究調(diào)查包含了多個不同顏色組合之間的就有效性的角度對于用戶的反饋，因此強烈建議設(shè)計師參考一下。
可讀性
Jacob Nielsen 是一位很知名用戶體驗師，他曾說：由于背景和文字之間使用高對比度，對于可讀性最佳的就是在白色背景上使用黑色文字，另外在黑色背景上使用白色文字效果一樣。當(dāng)文字的對比度是相同的，反而是顏色會影響我們的可讀性，所以可讀性受到顏色的影響，只是在文本使用黑色的相對于使用白色要感覺到輕，相對于白色背景，暗色更加感覺重。
由此，可讀性是影響產(chǎn)品性能很重要的一個方面，不僅僅涉及到文字本身。它超越了簡單的復(fù)制粘貼以及其他所有的符號意義，例如字母、數(shù)字、象形和ICON。因此使用深色背景應(yīng)該做好比較全面透徹的思考分析，并在不同的設(shè)備上測試字體、icon和圖片的可讀性情況。
關(guān)于網(wǎng)站和應(yīng)用，有一個很好的設(shè)計方法：在Awwwards上收集關(guān)于暗色調(diào)的最佳網(wǎng)站設(shè)計，這些都是擁有成功的的設(shè)計解決方案，但是在暗色背景的基礎(chǔ)之上依然存在不可讀性的案例，為了避免這些問題，在設(shè)計中應(yīng)該是牢記的。
a、暗色背景會從其它元素中吸收部分光，因此需要留有足夠的空間和元素之間的透氣性；
b、合理的使用分割線可以有效的增強用戶的可讀性；
c、字體選擇使用深色的背景；
d、行間距和行高都對可讀性有影響，特別是在暗色背景下，所以字體的段落大小，字間距和行高都應(yīng)該仔細(xì)考慮；
e、暗色并不只是黑色，所以在設(shè)計每一個元素的時候，都應(yīng)該仔細(xì)在不同的暗色調(diào)上測試內(nèi)容和顏色的呈現(xiàn)；
f、色相、漸變和投影發(fā)光都會影響可讀性；
g、非襯線字體通常比較清晰，而襯線字體看起來更加優(yōu)雅，所以在實踐中可以使用這個原則來增強可讀性。
對比度
在視覺方面還要考慮另外一個由webdesign.about.com 公布的有趣表格，表中展示了不同的顏色組合在對比度和功能上的關(guān)系：黑色部分幾乎與所有顏色都具有良好的對比度，在設(shè)計界面中每一個特定情況下仔細(xì)測試，這個因素可以嘗試使用暗色背景作為設(shè)計方案的重要依據(jù)。
在可讀性方面，對比度也是能夠使內(nèi)容更容易識別和保持清晰度的因素之一。
根據(jù)早期的調(diào)查表明：在暗色的背景中要避免使用過于明亮的文字，可以進行適當(dāng)?shù)牡蓽\灰色。或者減少比較極端的對比和較沉悶的顏色和投影；特別時做幻燈片背景時，使用白色背景，至少要用5%的灰色，用于分散亮眼的白強光，有趣的是，這種情況下依然會被看成“白色”，此外使用文字加粗，保證白色不會被背景吸收掉太多；這個原則在網(wǎng)頁和移動屏幕上依然有效，并也會產(chǎn)生很多新的變種。
另外一個需要注意的就是暗色調(diào)使得頁面看起來較重，通常用于呈現(xiàn)圖形內(nèi)容，例如照片、圖片、插圖，海報和廣告提供了更多的機會。元素色彩之間的良好組成和一定的視覺層次可以顯著的提高視覺感受。這一因素使得暗色的背景高效和有吸引力的情況下，更加凸顯出來圖片所要傳達的內(nèi)容。
色彩傳達情感
色彩心理學(xué)是另一個重要選擇，這將不僅在有效的區(qū)域呈現(xiàn)，而其自身就會作為信息載體的背景。暗色通常是優(yōu)雅和神秘感的。此外還與高雅、形式、權(quán)威、聲望等有關(guān)，這或許是為什么許多著名時尚的品牌圍繞著深色而設(shè)計，并使用黑色和白色作為對比的視覺變現(xiàn)的重要原因之一，在界面設(shè)計中可以從這一方面提供設(shè)計解決方案。
使用暗色背景的好處
根據(jù)上述各點，可以在用戶界面采用深色背景可以提供一定的幫助，其中包括：
a、風(fēng)格和優(yōu)雅；
b、感受神秘；
c、奢華與比較知名的效果；
d、對比上選擇更加豐富多彩；
e、支持視覺層次的體現(xiàn)；
f、對內(nèi)容有較高的可讀性；
g、視覺吸引力。
但是我們在設(shè)計時，還需要考慮以下方面：
a、用戶研究：用戶研究、實際調(diào)查、理論研究和實驗數(shù)據(jù)都是目標(biāo)用戶的重要數(shù)據(jù)來源，而這些是目標(biāo)用戶所期望的有效行和有吸引力的設(shè)計方案的基礎(chǔ)；
b、競品研究：接近競爭對手的，并對設(shè)計方案作出適當(dāng)?shù)恼{(diào)整，使得應(yīng)用相對于競爭對手更具有優(yōu)勢；
c、用戶測試；在暗色背景下可讀性和易讀性方面會受到各種不同設(shè)備以及不同分辨率的影響；
d、環(huán)境因素；產(chǎn)品被用戶使用表示贊成或反對的深色背景的選項之外的其他典型條件分析；
e、內(nèi)容數(shù)量；元素和模塊之間的布局，屏幕上功能受到背景影響的數(shù)量多少：使用暗色背景，而元素之間非常擁擠會影響到用戶體驗；
f、內(nèi)容性質(zhì)；暗色的背景可以根據(jù)圖形元素，提供更好的功能呈現(xiàn)。
作者：Marina Yalanska
http://tubikstudio.com/dark-side-of-ui-benefits-of-dark-background
