建站常識(shí)
網(wǎng)頁設(shè)計(jì)配色基礎(chǔ):色彩三屬性與實(shí)例剖析
2006-08-22 07:59:00
顏色可以分為非彩色和彩色兩大類。非彩色指黑色、白色和各種深淺不一的灰色,而其他所有顏色均屬于彩色。從心理學(xué)和視覺的角度出發(fā),彩色具有三個(gè)屬性:色相、明度、純度(彩度)。
基本色相環(huán) |
■ 色相(Hue): 也叫色調(diào),指顏色的種類和名稱,是指顏色的基本特征,是一種顏色區(qū)別于其他顏色的因素。色相和色彩的強(qiáng)弱及明暗沒有關(guān)系,只是純粹表示色彩相貌的差異。如紅、黃、綠、藍(lán)、紫等為不同的基本色相。 |
■ 明度(Value):
也叫亮度,指顏色的深淺、明暗程度,沒有色相和飽和度的區(qū)別。不同的顏色,反射的光量強(qiáng)弱不一,因而會(huì)產(chǎn)生不同程度的明暗。非色彩的黒、灰、白較能形象的表達(dá)這一特質(zhì)。
明度的遞增
→ 明度網(wǎng)頁例圖:http://www.once-upon-a-forest.com |
從上圖網(wǎng)頁所選取的4個(gè)主要色塊的RGB數(shù)值來看,這4塊色彩組合顯示的RGB數(shù)值很高,接近于最高值255。RGB相互間的數(shù)值相近,由于有RG的高數(shù)值與B高數(shù)值混合,整個(gè)網(wǎng)頁給人的感覺非常協(xié)調(diào),柔和雅致,心情愉悅。
結(jié)論:
RGB同時(shí)呈現(xiàn)相近的高數(shù)值時(shí),相近等量的色彩相互混合,頁面呈高明度灰色段,協(xié)調(diào)的柔和狀態(tài),令人遐想,對(duì)視覺刺激是緩慢的,適合長(zhǎng)時(shí)間觀看。但由于數(shù)值接近,因此色階平穩(wěn),同時(shí)存在著不夠醒目的狀態(tài)。
#p# ■ 純度(Chroma):
也叫飽和度,指色彩的鮮艷程度。原色最純,顏色的混合越多則純度逐漸減低。如某一鮮亮的顏色,加入了白色或者黑色,使得它的純度低,顏色趨于柔和、沉穩(wěn)。
加入黑色的純度變化和加入白色的純度變化
→ 純度網(wǎng)頁例圖:http://www.minimalweb.de |
上圖網(wǎng)頁中選取了主要的兩種色系為組合。運(yùn)用HBS數(shù)值模式更易于理解分析該網(wǎng)頁的純度情況。
我們看到藍(lán)色S數(shù)值呈現(xiàn)99%具有相當(dāng)高的飽和度,B明度為79%,玫瑰色S飽和度數(shù)值為85%,B明度為97%。當(dāng)飽和度和明度同時(shí)呈最高值時(shí),色彩對(duì)視覺的刺激強(qiáng)度到達(dá)最高狀態(tài)。由于藍(lán)色的明度稍低,飽和度較高,而玫瑰色的明度較高,該顏色純度隨之加強(qiáng),因此玫瑰色相對(duì)藍(lán)色對(duì)人的視覺刺激更強(qiáng)烈。
結(jié)論:
HSB模式中S和B呈現(xiàn)的數(shù)值越高,飽和度明度越高,頁面色彩強(qiáng)烈艷麗,對(duì)視覺刺激是迅速的,醒目的效果,但不易于長(zhǎng)時(shí)間的觀看。以上兩種顏色的S數(shù)值接近,是強(qiáng)烈的狀態(tài)。H顯示的度是代表在色輪表里某個(gè)角度所呈現(xiàn)的色相狀態(tài),相對(duì)于SB來說,意義不大。
下一節(jié)我們講:常用配色的基本概念與實(shí)例分析。
近期更新
- [2023-06-25 23:22:29] 優(yōu)秀網(wǎng)站設(shè)計(jì)的五大特點(diǎn)
- [2023-04-27 14:05:55] Html 5 響應(yīng)式網(wǎng)站設(shè)計(jì)制作
- [2023-04-10 11:07:30] 網(wǎng)站建設(shè)制作流程知多少
- [2022-10-14 10:11:30] 做網(wǎng)站設(shè)計(jì)應(yīng)該更看重框架搭建還是視覺觀感?
- [2022-08-09 15:57:48] 以“產(chǎn)品”思維搭建網(wǎng)站!
- [2022-08-08 09:12:57] 一家公司的網(wǎng)站應(yīng)該有哪些板塊內(nèi)容?
- [2022-08-05 09:28:06] 企業(yè)網(wǎng)站建設(shè)為什么要設(shè)置新聞板塊?
- [2022-07-04 15:58:06] 網(wǎng)站首頁設(shè)計(jì)的好看,這個(gè)網(wǎng)站就成功了一大半!
- [2022-05-20 09:34:19] 網(wǎng)站后臺(tái)管理系統(tǒng)是什么?有什么作用?
- [2022-05-17 11:29:32] 作為消費(fèi)者,應(yīng)該如何選擇一家水平高的網(wǎng)站建設(shè)公司
- [2022-05-17 11:27:01] 高端網(wǎng)站定制與模板化網(wǎng)站應(yīng)該怎么選擇?
- [2022-04-22 16:00:41] 現(xiàn)在高端的網(wǎng)站設(shè)計(jì)都有哪些新的趨勢(shì)?
延伸閱讀
- [2019-05-05 16:49:50] 青島網(wǎng)站改版的公司哪家好
- [2015-10-13 11:53:40] 色彩配搭與案例欣賞
- [2010-08-02 22:08:00] 為什么不要“以任務(wù)為中心”來進(jìn)行設(shè)計(jì)?
- [2011-10-25 18:55:00] 網(wǎng)站建設(shè)合同簽訂需要注意什么?
- [2007-01-15 16:12:00] 網(wǎng)頁界面設(shè)計(jì)教程二:與視覺傳達(dá)的設(shè)計(jì)
- [2007-07-11 09:21:00] 網(wǎng)站的建設(shè)方案
- [2006-09-08 08:04:00] 網(wǎng)站生命力之改進(jìn)和維護(hù)你的留言板
- [2010-03-21 17:17:00] PDD 產(chǎn)品特性驅(qū)動(dòng)設(shè)計(jì)
- [2009-09-01 14:15:00] 文案是網(wǎng)站的性格
- [2009-05-10 07:56:00] 五個(gè)為你的網(wǎng)頁設(shè)計(jì)添加光影效果的簡(jiǎn)單技巧
- [2007-01-04 15:10:00] 網(wǎng)頁設(shè)計(jì)配色應(yīng)用實(shí)例剖析——綠色系
- [2009-04-24 08:07:00] 英雄連ONLINE交易BUG聊產(chǎn)品設(shè)計(jì)
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計(jì)解決方案 機(jī)械行業(yè)網(wǎng)站設(shè)計(jì)解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 科技企業(yè)網(wǎng)站設(shè)計(jì)解決方案 電子家電網(wǎng)站設(shè)計(jì)解決方案 食品行業(yè)網(wǎng)站設(shè)計(jì)解決方案 集團(tuán)公司網(wǎng)站設(shè)計(jì)解決方案 企事業(yè)單位網(wǎng)站設(shè)計(jì)解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 健身運(yùn)動(dòng)網(wǎng)站設(shè)計(jì)解決方案 美容與化妝品網(wǎng)站設(shè)計(jì)解決方案 建筑設(shè)計(jì)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 物流行業(yè)網(wǎng)站設(shè)計(jì)解決方案
TAGS關(guān)鍵字
青島輪胎網(wǎng)站設(shè)計(jì) 微信小程序 網(wǎng)站建設(shè)的步驟有哪些 集團(tuán)官網(wǎng) 青島網(wǎng)站案例 程序開發(fā) 青島網(wǎng)站SEO 企業(yè)網(wǎng)站設(shè)計(jì) 良好的導(dǎo)航 扁平化設(shè)計(jì) 網(wǎng)站優(yōu)化 網(wǎng)站交互設(shè)計(jì) HTML5 空白和簡(jiǎn)潔的設(shè)計(jì) 青島高端網(wǎng)站建設(shè) 膠南網(wǎng)站建設(shè)公司 青島網(wǎng)站建設(shè)公司哪家好 青島網(wǎng)站營(yíng)銷 手機(jī)端的網(wǎng)站 網(wǎng)站的速度 集團(tuán)性網(wǎng)站 集團(tuán)公司網(wǎng)站建設(shè) 青島網(wǎng)頁制作 H5定制設(shè)計(jì) 手機(jī)網(wǎng)站 用戶界面 舒適的界面 中小型企業(yè)網(wǎng)站建設(shè) 網(wǎng)頁設(shè)計(jì) 頁面設(shè)計(jì)