《
Web設(shè)計(jì)師應(yīng)遵循的高效設(shè)計(jì)原則之一:對(duì)比_網(wǎng)站建設(shè)公司》文章地址:http://www.tfxk.com/zixun/040235YH013.htm
在網(wǎng)頁中,文本跟排版元素的顏色值可以很好地體現(xiàn)“對(duì)比&rdquo,網(wǎng)站建設(shè)公司;。須要測(cè)試的遠(yuǎn)景色就是文本自身,而背景色則是文本之下的任何元素,無論是圖片、漸變,抑或RGB顏色。
用顏色實(shí)現(xiàn)對(duì)比
原文鏈接:
這些工具可以輔助你設(shè)計(jì)網(wǎng)站,使你的網(wǎng)站有一個(gè)適合的前景色與背景色的對(duì)比度。某些工具可以檢測(cè)色差和亮度差的均衡性,并顯示出結(jié)果,包括亮度差、色差、顏色匹配、比對(duì)度,及相應(yīng)的從AA到AAA等級(jí)的WCAG 2值。
重要針對(duì)酒店行業(yè)和聯(lián)邦政府進(jìn)行Web開發(fā)的Ryan Boudreaux針對(duì)四大設(shè)計(jì)準(zhǔn)則寫了一系列文章,本文為第一篇《Effective design principles for web designers: Contrast》的譯文,內(nèi)容如下:
假如你接收過設(shè)計(jì)方面的正規(guī)課程,你可能已經(jīng)懂得了高效設(shè)計(jì)原則,它包括四個(gè)有名的標(biāo)準(zhǔn)概念:對(duì)比(Contrast)、反復(fù)(Repetition)、對(duì)齊(Alignment)和密切性(Proximity)。良多人簡(jiǎn)稱為PARC或CRAP。這四個(gè)設(shè)計(jì)原則是印刷行業(yè)設(shè)計(jì)的標(biāo)準(zhǔn)常識(shí);實(shí)事上,有幾本書已被請(qǐng)求作為該科目(包括非設(shè)計(jì)職員的設(shè)計(jì)課程)的教科書,好比Robin Williams寫的第三版《寫給大家看的設(shè)計(jì)書》(The Non-Designer’s Design Book)。
Luminosity Colour Contrast Ratio Analyse由Web開發(fā)者Gez Lemon提供,通過輸入十六進(jìn)制顏色碼,可以盤算出前景色與背景色的亮度對(duì)比度。如下圖。
原文:
Colour Contrast Check由加拿大的Web開發(fā)者Jonathan Snook提供,該工具容許你指定一個(gè)前景色和背景色,并斷定它們是否有足夠的對(duì)比度,以滿意有視覺障礙人的閱讀,或合適于在黑白屏上瀏覽。下圖展示了該工具。
從一個(gè)全新的角度來看,網(wǎng)站制作,當(dāng)兩個(gè)或更多相干元素以不同方法顯示出來時(shí),就會(huì)發(fā)生對(duì)比,差別越顯著,對(duì)照也就越顯明。把類似的元素放在Web頁上,并把它們轉(zhuǎn)化為獨(dú)一的實(shí)體、局部,或者容器,這是高效對(duì)比的要害點(diǎn)所在。打造具備比較性的元素最廣泛的方式包含創(chuàng)立元素的不同屬性,比方色彩&mdash,網(wǎng)站設(shè)計(jì);—它仿佛已得到最普遍利用。其它的屬性包括大小、外形、紋理、方位、地位及活動(dòng)。但有較大對(duì)比度的兩個(gè)元素不必定會(huì)帶來存在吸引力的視覺休會(huì)。
本文將重點(diǎn)探討“對(duì)比”這一設(shè)計(jì)原則,它與Web設(shè)計(jì)中的顏色及如何測(cè)試顏色匹配水平有關(guān)。
Check My Colours工具由自在Web開發(fā)者Giovanni Scala供給,它可以用來檢測(cè)網(wǎng)頁中所有DOM元素的前景色與背景色的組合情形。只要要輸入待測(cè)網(wǎng)站的URL,該工具即可顯示出頁面中DOM元素是否有充足的對(duì)比,以知足有視覺阻礙人群的閱讀。Check My Colours所有的檢測(cè)成果均基于W3C所倡議的算法。下圖展現(xiàn)了某簡(jiǎn)略網(wǎng)站中DOM元素的檢測(cè)結(jié)果。
在Web設(shè)計(jì)中,好的顏色對(duì)比是非常主要的,不僅僅是為了美學(xué)價(jià)值,還為了Web的可訪問性。有些人擁有視覺障礙,或是色盲,應(yīng)確保網(wǎng)站的顏色對(duì)比可以相應(yīng)地調(diào)劑,以增添響應(yīng)性和可拜訪性。所以測(cè)試網(wǎng)站的顏色對(duì)比是一個(gè)很好的抉擇,下面列出多少個(gè)工具可以提供頁面的亮度對(duì)比度。對(duì)比度在4.5:1或者更高是比擬幻想的,合乎W3C的WCAG 2.0標(biāo)準(zhǔn)。
顏色對(duì)比檢測(cè)工具
對(duì)比
WebAIM Color Contrast Checker能夠調(diào)暗或調(diào)亮最初的前風(fēng)景與背景色(十六進(jìn)制的RGB值),直到它滿意AA尺度。你可以用這個(gè)工具來改變顏色、轉(zhuǎn)變亮度。如下圖。
(責(zé)任編輯:網(wǎng)站建設(shè))
Web設(shè)計(jì)師應(yīng)遵循的高效設(shè)計(jì)原則之一:對(duì)比_網(wǎng)站建設(shè)公司相關(guān)文章