使(shǐ)用(yòng)半(bàn)透(tòu)明元素來設計(jì)網頁很美(měi)觀也很(hěn)需要技巧(qiǎo)。半(bàn)透明效果(guǒ)是(shì)指(zhǐ)色(sè)塊(kuài)，文字或圖(tú)片被“稀釋(shì)”或者衝(chōng)淡，使(shǐ)得顏(yán)色減淡，並且(qiě)透(tòu)出(chū)後方(fāng)內容
執行(háng)到位的話，這種效果會非常(cháng)震(zhèn)撼(hàn)，能(néng)劃(huá)出一塊絕佳的文字(zì)展示區域(yù)，或(huò)者(zhě)作為(wéi)吸引(yǐn)注意力至(zhì)圖(tú)像(xiàng)某(mǒu)部分的手段
但是(shì)使(shǐ)用(yòng)半透(tòu)明時(shí)，設(shè)計師(shī)必(bì)須小心謹慎。這種(zhǒng)效(xiào)果很(hěn)難處(chǔ)理得當，因(yīn)為(wéi)事(shì)關(guān)可讀性(xìng)。透(tòu)明度使(shǐ)用(yòng)錯(cuò)誤的(dí)半(bàn)透(tòu)明塊和文字也(yě)，會(huì)能散注意力(lì)，並(bìng)且破壞整體(tǐ)設計效(xiào)果
接下來(lái)看一套行為(wéi)準(zhǔn)則，附(fù)帶一(yī)些(xiē)半透(tòu)明效果(guǒ)在(zài)網站上的優秀(xiù)執行(háng)案例
通(tōng)過半透明來形成(chéng)對比
選(xuǎn)用(yòng)半透(tòu)明設(shè)計技巧(qiǎo)的(dí)最大好(hǎo)處，是(shì)創(chuàng)造(zào)對(duì)比(bǐ)。這種(zhǒng)效(xiào)果(guǒ)可(kě)以讓設(shè)計師通過(guò)色塊，圖片(piàn)上的(dí)大字體或(huò)多(duō)種(zhǒng)顏色(sè)層(céng)次來(lái)創造(zào)視覺焦(jiāo)點(diǎn)
半透明也(yě)可以在(zài)背景圖(tú)不(bù)能很好(hǎo)展現上(shàng)方(fāng)文字時，將(jiāng)文字分離開來
使用(yòng)半(bàn)透明(míng)設計時尤其需(xū)要考(kǎo)慮(lǜ)對比。隻(zhī)有(yǒu)圖片(或(huò)背景(jǐng))和(hé)文字都可讀(dú)時(shí)，半透明(míng)效(xiào)果才是有(yǒu)意義(yì)的。當你考(kǎo)慮使(shǐ)用(yòng)半(bàn)透明(míng)效果時，問(wèn)問自己(jǐ)：這是否有(yǒu)助(zhù)於(yú)用(yòng)戶對圖文(wén)的理解?
避免(miǎn)遮擋(dǎng)圖(tú)片的(dí)重要部(bù)分(fēn)
半透(tòu)明(míng)效(xiào)果不應該遮(zhē)擋其下(xià)方背景或(huò)圖片(piàn)的重要(yào)部分(fēn)。決(jué)定半透(tòu)明層位(wèi)置(zhì)的時(shí)候，要清楚(chǔ)你“犧牲”了什麼內(nèi)容
用不同的透(tòu)明度
沒有完美的(dí)透明(míng)度(dù)值(zhí)。對於(yú)某些(xiē)項目，80%透明(míng)度比較理(lǐ)想(xiǎng);對(duì)於(yú)其(qí)他的也許15%才是最(zuì)佳選擇。對每(měi)個(gè)項(xiàng)目采用不(bù)同的透明(míng)度
不要覺得半透(tòu)明(míng)就能讓文字更易讀
使用(yòng)半透明色(sè)塊(kuài)來襯托文字並不(bù)意味(wèi)著(zhuó)文字會自動(dòng)變得易(yì)讀(dú)。要考(kǎo)慮對比——半透(tòu)明色塊與文字(zì)，背(bèi)景圖(tú)與半(bàn)透(tòu)明色塊兩(liǎng)方麵(miàn)都(dū)要考慮
半透(tòu)明(míng)效果(guǒ)用在(zài)圖片，色塊或文字上時(shí)，考慮(lǜ)文字(zì)的可讀(dú)性(xìng)至(zhì)關重(zhòng)要。切記，如果設計(jì)效果(guǒ)致使文字難以(yǐ)辨(biàn)認，你的(dí)信(xìn)息將無從(cóng)傳(chuán)達(dá)
在細節(jié)處使用半透明效果
半(bàn)透明並(bìng)非(fēi)隻適用(yòng)於(yú)網站(zhàn)的主體(tǐ)部(bù)分。這種(zhǒng)效果(guǒ)在細節處也能大放異(yì)彩(cǎi)
可(kě)以考(kǎo)慮用(yòng)半(bàn)透(tòu)明來(lái)展示(shì)導航工(gōng)具欄，或者作(zuò)為(wéi)按鈕和可點(diǎn)擊元素(sù)的鼠標懸停效(xiào)果。多種透明度不要使用(yòng)過度。選定(dìng)一種元(yuán)素(sù)和透明度樣式，然(rán)後(hòu)使(shǐ)它貫(guàn)穿(chuān)整個(gè)網站的(dí)設計(jì)
不(bù)要在對比強烈的(dí)圖片上放置(zhì)半透明元(yuán)素
處於可(kě)讀性考慮，最好(hǎo)避免在(zài)已經(jīng)包含(hán)強烈(liè)對比(bǐ)的(dí)元素(sù)上使用半(bàn)透明(míng)效(xiào)果——比如(rú)黑(hēi)白(bái)對(duì)比或(huò)色(sè)盤上(shàng)的互(hù)補色
因(yīn)為(wéi)要在(zài)背景的各個(gè)部分都達到(dào)正確的效果(guǒ)很難，想在這類(lèi)元素上(shàng)使用(yòng)半透(tòu)明效果，除(chú)非(fēi)強烈對(duì)比在你(nǐ)的設(shè)計(jì)中真的隻起到(dào)負麵作用。考慮用淺(qiǎn)色(sè)塊(kuài)代(dài)替(tì)吧(bā)
將半透明作(zuò)為一種(zhǒng)藝術手法(fǎ)
半透明(míng)不隻是(shì)次要效(xiào)果。可以考慮用這(zhè)個(gè)效果(guǒ)為(wéi)你的網站設計(jì)主(zhǔ)畫麵(miàn)
大尺寸(cùn)半(bàn)透(tòu)明創造(zào)的(dí)對比，強調和視覺吸引令(líng)人震撼
不要將半(bàn)透明作為(wéi)裝飾物使用
半透明效(xiào)果(guǒ)並非(fēi)為了打(dǎ)破(pò)設計(jì)中的單調。把(bǎ)這種效(xiào)果作(zuò)為裝(zhuāng)飾物使用，注(zhù)定會(huì)導(dǎo)致(zhì)糟(zāo)糕(gāo)的(dí)設計
半(bàn)透(tòu)明(míng)效(xiào)果的(dí)使(shǐ)用應該事先考(kǎo)慮和規(guī)劃(huá)好。半透(tòu)明(míng)不(bù)是(shì)加(jiā)粗這類簡(jiǎn)單效果，處(chǔ)理不當(dāng)看(kàn)起來(lái)會很(hěn)草率(shuài)且不專(zhuān)業(yè)
在背景中使(shǐ)用(yòng)半(bàn)透明
不(bù)隻是(shì)設計(jì)前景元素(sù)時(shí)可(kě)用(yòng)半(bàn)透明(míng)效果，它(tā)也(yě)能(néng)用在背景圖(tú)上(shàng)。有些(xiē)非常棒的(dí)半(bàn)透明(míng)元素精(jīng)細(xì)微妙(miào)
還有(yǒu)些(xiē)半(bàn)透明(míng)效果(guǒ)夾(jiā)在圖像層(céng)之(zhī)間。例如Tony Chester的(dí)網站(zhàn)，就用了絕(jué)妙(miào)的(dí)半(bàn)透明分層技巧打造了(liǎo)一件多維度的設計
不要同時(shí)運用過(guò)多半透明(míng)效(xiào)果
在(zài)每個項(xiàng)目(mù)中有節製地使用(yòng)不(bù)同(tóng)類型(xíng)的半(bàn)透明(míng)效果(guǒ)。透(tòu)明度(dù)要能製造反差對比，產生(shēng)視覺吸引(yǐn)力。這樣使用(yòng)過(guò)多的(dí)差(chà)異化(huà)效(xiào)果，會分散用戶(hù)注意力
在(zài)輪播(bō)圖片上使(shǐ)用(yòng)半透明元(yuán)素(sù)
半透明(míng)的使(shǐ)用不限(xiàn)於(yú)單(dān)頁網(wǎng)站或靜(jìng)止(zhǐ)網站。它在變(biàn)化(huà)的圖片和背景(jǐng)上也(yě)起作用。兩種(zhǒng)方(fāng)式都可以用上半(bàn)透(tòu)明效果(guǒ)
在輪播(bō)圖(tú)片(piàn)上使用(yòng)半(bàn)透明，是(shì)該(gāi)效果最棘手(shǒu)的(dí)用法之(zhī)一。卻也(yě)最令(líng)人(rén)印(yìn)象深(shēn)刻(kè)。慎(shèn)重(zhòng)考(kǎo)慮多(duō)張(zhāng)背景圖(tú)的情況(kuàng)。選(xuǎn)用(yòng)顏色和(hé)對(duì)比搭(dā)配(pèi)相(xiāng)近的圖片，這樣(yàng)隻(zhī)需一(yī)種半透明效果即可應對後方移動變(biàn)換的背景
格外注(zhù)意(yì)半(bàn)透(tòu)明效果與每張圖的(dí)匹(pǐ)配(pèi)程(chéng)度，才能(néng)保證(zhèng)每張(zhāng)圖(tú)的(dí)整體性，並(bìng)創(chuàng)作(zuò)出易(yì)辨認(rèn)的(dí)照片或其他背(bèi)景與文(wén)字(zì)，保(bǎo)持視覺(jué)統(tǒng)一
小(xiǎo)結
嘗(cháng)試半(bàn)透明(míng)效果，是拓(tuò)展(zhǎn)設(shè)計技巧的(dí)一(yī)個(gè)絕(jué)妙方法。像很多(duō)其(qí)他(tā)效果(guǒ)一樣，要(yào)有節製(zhì)地使用(yòng)這個技巧，並(bìng)且(qiě)在(zài)多種環境(jìng)下實驗這(zhè)種設計，來確保它按你的(dí)意圖運作和展(zhǎn)現(xiàn)
半透明(míng)設(shè)計(jì)的最(zuì)大挑戰(zhàn)，是(shì)在(zài)輪播(bō)圖(tú)片上使用時(shí)確保文字清(qīng)晰(xī)可讀(dú)，和避(bì)免半透(tòu)明(míng)元素錯(cuò)誤地(dì)遮擋(dǎng)下方圖片(piàn)
嘗試(shì)多(duō)種透明度(dù)和使用方式——用於圖片(piàn)，背(bèi)景，遮罩效果(guǒ)——來決定那種效果(guǒ)最適合(hé)某個項(xiàng)目
轉載請(qǐng)保留(liú)原(yuán)文地址(zhǐ): https://antelcom.cn/show-18.html