web前端網(wǎng)站配色原則

網(wǎng)頁設(shè)計(jì)不好，色彩是重中之重的因素，網(wǎng)站配色也有相應(yīng)的原則，這是web前端需要不斷學(xué)習(xí)的方面。網(wǎng)站配色除了要考慮網(wǎng)頁自身特點(diǎn)外，還要遵循相應(yīng)的配色原則，避免盲目地使用色彩造成網(wǎng)頁配色過于雜亂。網(wǎng)頁配色原則包括使用網(wǎng)頁安全色和遵循配色方案，具體介紹如下

1. 使用網(wǎng)頁安全色

網(wǎng)頁安全色是指在不同的硬件環(huán)境、不同的操作系統(tǒng)、不同的瀏覽器中都能正常顯示的顏色集合。使用網(wǎng)頁安全色進(jìn)行配色，可以避免原有的色彩失真。網(wǎng)頁安全色是指顏色十六進(jìn)制值的組合內(nèi)部含有、cc、99、66、33、00，只有含有這樣值的組合才是網(wǎng)頁安全色。

需要注意的是，隨著顯示設(shè)備精度的提高，許多網(wǎng)站設(shè)計(jì)已經(jīng)不再拘泥于選擇安全色，它們利用其他非網(wǎng)頁安全色展現(xiàn)了新穎獨(dú)特的設(shè)計(jì)風(fēng)格，所以我們并不需要刻意地追求使用局限在216種網(wǎng)頁安全色范圍內(nèi)的顏色，而是應(yīng)該更好地搭配使用安全色和非安全色。

2.遵循配色方案

1)使用同類色

同類色是指色相一致，但是飽和度和明度不同的顏色。盡管在網(wǎng)頁設(shè)計(jì)時(shí)要避免采用單一的色彩，以免產(chǎn)生單調(diào)的感覺，但通過調(diào)整色彩的飽和度和明度也可以產(chǎn)生豐富的色彩變化，可使網(wǎng)頁色彩避免單調(diào)。如下圖的網(wǎng)站選用了不同明度的藍(lán)色，不僅整體性很強(qiáng)，而且符合科技類公司自身的特色。

2)使用鄰近色

鄰近色是12色相環(huán)上間隔30°左右的顏色，色相彼此近似、冷暖性質(zhì)一致。鄰近色之間往往是你中有我、我中有你。例如朱紅色與橘黃色，朱紅色以紅色為主，里面含有少量黃色;而橘黃色以黃色為主，里面含有少量紅色。朱紅色和橘黃色在色相上分別屬于紅色系和橙色系，但是二者在人眼視覺上卻很接近。采用鄰近色設(shè)計(jì)網(wǎng)頁可以使網(wǎng)頁達(dá)到和諧統(tǒng)一，避免色彩雜亂。

3)使用對(duì)比色

對(duì)比色是24色相環(huán)上間隔120°-180°的顏色。對(duì)比色包含色相對(duì)比、明度對(duì)比、飽和度對(duì)比等，例如黑色與白色、深色與淺色均為對(duì)比色。對(duì)比色可以突出重點(diǎn)、產(chǎn)生強(qiáng)烈的視覺效果。在設(shè)計(jì)時(shí)以一種顏色為主題色，對(duì)比色作為點(diǎn)睛色或輔助色、可以起到畫龍點(diǎn)睛的作用。

以上黑馬程序員為您介紹了，web前端頁面配色原則，希望對(duì)您有所幫助。如果還有其他web前端相關(guān)問題，可以點(diǎn)擊咨詢按鈕獲得幫助。

推薦了解熱門學(xué)科
java培訓(xùn)

Python人工智能

Web前端培訓(xùn)

PHP培訓(xùn)
區(qū)塊鏈培訓(xùn)

影視制作培訓(xùn)
C++培訓(xùn)

產(chǎn)品經(jīng)理培訓(xùn)
UI設(shè)計(jì)培訓(xùn)

新媒體培訓(xùn)

產(chǎn)品經(jīng)理培訓(xùn)

Linux運(yùn)維