我們日常所看到的網頁設計大多是淺色系和亮色系,作為神秘色系的黑色總給人一種嚴肅的感覺,它可以很低調,也可以很奢華,但永不過時。
深色網站總是給人以個性而充滿高品質的感覺。淺色或亮色文本或圖片,搭配深色背景,起到視覺上的層級呼應,突出主題的同時,瞬間吸引用戶注意,賦予界面生命力。
雖然深色背景容易給人壓抑的感覺,但是把深色背景運用到白色文字上面則是另外一種視覺效果差的呈現,白色的文字顏色和深色的背景可以形成鮮明的對比,這樣就能突出文本內容,根據人們視覺聚焦法則人們很容易把視覺停留在文字上,引起人們對文字的關注,這也是諸多企業和高端產品網站偏愛的設計風格。
Coleweber
Delete agency
Envy?labs
The?diligence?company
Eat?the?ordinary
深色的背景搭配其他亮色瞬間打破由于主色帶來的視覺疲勞,讓網站看起來更容易的被人接受。簡潔的色彩和對比度以及明暗度的搭配,讓網站的主要信息:導航欄,按鈕,文字內容更加突出,使得網站不再枯燥乏味。
Snkrs
Meaning?conference
Mo?by?digital
Mcchill
在深色網頁設計中最常見也是最必要的元素就是留白,留白越多,留給字體和設計作品的空間就越多越多,能夠保持很好地層次感。留白區域能夠很好的指引用戶,如果元素過多,那么用戶的注意力會分散。留白能夠讓用戶盡快的尋找到所需要的信息,提高用戶體驗。
通過黑白可以創建具有對比性的背景。使用一個白色或黑色的背景可以讓你的網站看起來更現代一點。
Eat?genesis
Wmnvm
M-mediagebouw
Two?chimps?coffee
Demain?jarrete
在深色系網頁設計中我們會發現很多設計師都采用動畫效果來增強頁面的交互效果,打破深色系的沉悶感。簡單的動畫效果營造的視覺體驗是非常吸引人的,可以引導用戶不斷探索網頁呈現的神秘感。切記不要使用復雜的動效,不但不會給予用戶非常驚艷的效果,反而會干擾用戶。
Priscofrancesco
Tenco
Max-agency
Garden-eight
Higher?ground?melbourne
Jonathandacosta
Paradoxcreates
Abstraction
Flamboyamedia
Rule-of-three
Creativepark
Crypton
TTmm
Pieromilano
Aghost
Computerizedforms
用戶對顏色的認知往往是類似的,無論是哪一類的網頁,如果頁面太過花哨,不僅不會帶給用戶視覺的享受,還會干擾視覺。無論選擇深色系還是淺色系,都要經過明確的用戶體驗和合理的決策共同完成。網頁在明亮的顏色方面配色最好不要超過三種,以免造成頁面視覺體驗的混亂。
或者在自己選擇好的主色中參考類似網站案例,就可以簡單完成配色。
以下兩個配色指南可以給大家一些參考:
https://visme.co/blog/website-color-schemes/
https://www.websitebuilderexpert.com/designing-web...
“色彩影響人類心情與思考,當眼睛看到某種顏色時,會將此訊息傳回大腦的下視丘,經由一系列的神經傳達,刺激甲狀腺分泌賀爾蒙,進而造成情緒、情感或是實際反應。”——《網頁設計中的色彩心理學》
設計師日常設計中最核心的部分就是配色,這也是每個設計師的基本功。為網頁選擇一種基礎色并不難,但是想要一套可用的色彩組合,卻不是那么容易的事情。所以,很多時候,設計師會借助配色工具來尋求配色方案。
配色方法和配色工具有很多,有的工具需要配合特定的方法,而有的工具則只能應對特定的需求。這個合集主要是為網頁設計師所準備的配色工具,希望能夠幫助你。
深色系的網頁并不適用于每一個行業,但如果色彩運用的好,它可以讓你的網站更加簡潔,高級。