深色調(diào)的網(wǎng)站設(shè)計是比較流行的，它能營造出簡潔、富有創(chuàng)造性的效果，

簡潔富有創(chuàng)造性的深色調(diào)網(wǎng)頁設(shè)計

    它能滿足一些客戶對網(wǎng)頁設(shè)計風格的要求。然而，它并不能適用于每一個客戶對網(wǎng)站設(shè)計風格的要求，設(shè)計師應(yīng)根據(jù)實際情況而定。

    盡管深色調(diào)的設(shè)計風格能做到引人注目的效果，但很多設(shè)計師不知道如果有效的使用它來打動、吸引瀏覽者。

    深色調(diào)網(wǎng)頁設(shè)計經(jīng)常出現(xiàn)的問題是不易讀、沒有吸引力、很少打破傳統(tǒng)的設(shè)計模式。

    這片文章，我們將討論一些如何讓你的下一個深色調(diào)網(wǎng)頁設(shè)計更能吸引、打動廣大瀏覽者的方法和技巧，真正做到讓你的設(shè)計表達你的創(chuàng)意。

    最近的調(diào)查顯示有超過47%的大眾用戶更喜歡亮色調(diào)的網(wǎng)頁設(shè)計。內(nèi)容的可讀性是主要原因。大多數(shù)的用戶不喜歡亮文字內(nèi)容顯示在深背景上，這樣的對比效果是比較刺眼的，給人不舒服的感覺。

    相比之下，有10%的設(shè)計師通常選擇深色調(diào)來設(shè)計網(wǎng)頁，同時36%的人認為應(yīng)該根據(jù)網(wǎng)頁的具體風格要求進行選擇。

    那么，哪個是正確的答案那？歸結(jié)起來，每一個人都有自己的意見，事情就是這樣。

    但是有相當一部分用戶認為重色調(diào)的設(shè)計是可以接受的，有時是設(shè)計首選。作為網(wǎng)頁設(shè)計師，我們不得不考慮如何有效的設(shè)計深色調(diào)的網(wǎng)頁給我們客戶與自己。

    相信亮色調(diào)網(wǎng)頁設(shè)計的愛好者們希望深色調(diào)的網(wǎng)頁設(shè)計應(yīng)該更易閱讀、有好的用戶體驗。

    多使用留白

    或者應(yīng)該叫“留黑”？合理有效的使用留白對于任何風格的設(shè)計來說都是非常重要的。但對于深色調(diào)的網(wǎng)頁設(shè)計來說它則是必須的。

    深色調(diào)的網(wǎng)頁設(shè)計給人總體的感覺是“沉重的”，如果整體布局結(jié)構(gòu)凌亂更增強了給人沉重的感覺。下面展示了一些比較受大眾喜歡的深色調(diào)網(wǎng)頁設(shè)計，他們合理使用了留白達到很好的設(shè)計效果。

    Black Estate是互聯(lián)網(wǎng)里深色調(diào)網(wǎng)頁設(shè)計的一個而已，設(shè)計確實很棒并值得我們研究學習。設(shè)計自始自終都在合理、有效的使用留白，如何在設(shè)計元素周圍有效的使用了留白，從而設(shè)計出了這樣講究的網(wǎng)頁。

    logo標志周圍留有大量的“留白”，作為瀏覽者我們首先看到的就是它，其次看到的才是主要內(nèi)容與右邊的瓶子。正如你所看到的，留白是用來突出瓶子上的亮文字內(nèi)容與內(nèi)容標題。

    Tictoc的主要特點就是它在內(nèi)容、裝飾圖片周圍留用了大量的“留白”，當我們繼續(xù)往下瀏覽時，我們看到使用了很少的留白，從而將我們的注意力集中在到下面的具體內(nèi)容上面。

    這里的關(guān)鍵是，留白起到了引導的作用，逐步引導用戶瀏覽這個頁面。

    網(wǎng)站通過使用大量的留白從而增加了深色調(diào)設(shè)計的層次，留白僅僅是為了實現(xiàn)深色調(diào)的效果而已

    Mark Dearman網(wǎng)站的框架結(jié)構(gòu)自始自終采用靈活的、均勻的分布式布局進行留白。

    留白為每一個相鄰的內(nèi)容板塊里面的內(nèi)容提供了大量呼吸、停頓的空間。當進入到下一板塊內(nèi)容的時候，它們之間的留白是一個很好的休息地點。

    留白對于深色調(diào)網(wǎng)頁設(shè)計來說是必須的，它不但有助于解決布局的凌亂、散亂，同時也是網(wǎng)頁設(shè)計增強整體感很重要的元素。

    正文內(nèi)容留白

    深色調(diào)網(wǎng)站內(nèi)容的易讀性是不喜歡深色調(diào)網(wǎng)頁用戶所擔心的問題，

電腦資料

    在整個設(shè)計上，通過調(diào)整段落與段落之間的距離大小、行距來增加留白是提高重背景網(wǎng)站文字內(nèi)容可讀性的一種方式。

    下面展示的例子介紹了元素與元素之間留白、元素本身周圍留白在深背景和亮背景上的對比情況。

    增加字體大小是提高深色調(diào)網(wǎng)頁內(nèi)容可讀性的另外一種方式，同文章以上介紹的方法一樣，大號的字體能增加其本身及周圍的留白，字體越大其周圍的留白空間就會越大。

    比如下面的字母“a”，當字體增大時，其周圍的留白就會隨著增大。無論是a周圍的空間還是其內(nèi)部的空間，還是與上下內(nèi)容之間的空隙留白都跟著一起變化。

    注意，在淡色調(diào)上閱讀小文字內(nèi)容要比深色調(diào)上容易的多。當在新的網(wǎng)站上設(shè)置字體的時候，一定要事先虛擬一些內(nèi)容以確保其清楚易讀。如果不清楚的話，可以嘗試增加一下字體的大小來調(diào)整。

    文字對比

    一些人普遍認為大多數(shù)的深色調(diào)的網(wǎng)站容易導致眼睛疲勞。設(shè)計師們或多或少的忽視了對比。如何找到一個平衡點那？

    如果你在一個漆黑的屋子里，突然遇到很強的亮光你會感覺不適應(yīng)的。但是，如果你在一個稍微有點弱光的屋子里再遇到亮光的話應(yīng)該會好一些兒。這個規(guī)則同樣使用于網(wǎng)頁設(shè)計。

    找到一個完美的對比，也就是說在深背景于亮字之間找到一個對比平衡點。

    下面的例子簡單的說明這點，如何平衡字體與背景之間的對比度。注意當讓背景顏色變淺時其上面的文字也會一起變淺的。

    找到文字與背景的對比平衡點是比較困難的。

    為了找到最終的平衡點，我們使用不同的程度的背景顏色做試驗。背景不要是純黑色，文字不是純白色是試驗的最終平衡點。

    字體的處理

    字體在設(shè)計里面扮演著非常重要的角色，尤其在深色調(diào)布局設(shè)計里面更應(yīng)該深思熟慮的。下面的圖片展示了14點大小的serif和sans-serif字體在深背景上的效果。

    sans-serif字體明顯更清晰、易讀一些。但是一部分設(shè)計師讓然是應(yīng)用serif字體。

    僅僅放大sans-serif字體這一個方法，從而讓其周圍留有更多的留白，并讓其清晰易讀。

    下面是在寫此文之前的網(wǎng)站論壇的界面截屏。網(wǎng)站同時使用了serif和sans-serif兩種字體，但是使用它們是有技巧的。

    大字體比如標題、導航等使用了serif字體來增加其效果。為了比較好的對比、提高可讀性，body里面定義了sans-serif字體。

    使用少的配色方案

    為了讓深色調(diào)的設(shè)計看起來更干凈、整齊，設(shè)計師應(yīng)盡量選擇少的配色方案。

    通過一下幾個簡單的例子，過多的顏色配色方案針確實無意于深色調(diào)設(shè)計的，因為這樣的配色對比太強烈了。

    保留一種或二種顏色系

    部分設(shè)計師喜歡用對比強烈、刺激的配色方案，當然這樣也是可以的，但要能夠恰如其分的使用好。

    總體來說，顏色很容易讓網(wǎng)頁界面花、雜亂，本來深色調(diào)的網(wǎng)站顏色就很重了。所以在用色方面更應(yīng)該慎重一些！

    中文原文：深色調(diào)網(wǎng)頁界面設(shè)計注意事項

    英文原文：The Do’s and Don’ts of Dark Web Design