近年來，在背景圖上添加文本的方式變得越來越流行，融入文本在圖片中滲入情感。在早期，圖像不得不做得很小以適應(yīng)明顯低速的帶寬，隨著網(wǎng)速和顯示屏的快速提升，我們可以在設(shè)計中自由地使用更多圖片。
一、色彩與亮度的對比
使用與文本有鮮明對比的圖片很有重要，比如深色背景搭配亮色文本，或者深色背景使用濾鏡或疊加元素處理，這樣就能確保有足夠?qū)Ρ榷取?
獲取合理色彩與明亮對比的小技巧：
第一看不出字形，說明對比度偏低了；對比不只是深淺之間，互補(bǔ)色也可提供自然對比；如果圖片復(fù)雜全焦，利用疊加或編輯圖像應(yīng)該是最有效的選擇。
本例中，通過WebKtit濾鏡巧妙的放置以及使用額外的<div>.來處理圖像的明亮對比，請看下例：亮度（40%）對比度（70%）；
辨識度差，文本與圖像均無焦點(diǎn)。
使用CCS濾鏡后，易于辨識。
優(yōu)秀實(shí)例：Ayr
Geckoboard
Anodpixels
Obakkifoundation
二、尺寸與位置的對比
色彩不是唯一增強(qiáng)圖片與文本對比度的方法，選擇圖片的尺寸也很重要。
本例中，選取一個相對均勻，開闊的天空區(qū)域，這是放置文本的極佳位置。相反，將文本直接放置在圖片中間，有地平線的位置，將致使文本的辨識度差。
失敗案例：差的對比度和錯誤的位置。
優(yōu)秀案例：對比度明顯且位置更加合適。
優(yōu)秀實(shí)例：Eup.volkswagen
Dtelepathy
三、利用景深
利用圖片的景深不同，在失焦的地方置放文本也能突出文字，增加可讀性，達(dá)到效果。
優(yōu)秀實(shí)例：Une.ch/creation
Gloriasrestaurants
Atelier
四、圖片選擇
圖片會傳遞情感，所以選擇圖片的時候，要聯(lián)系設(shè)計中的場景，文本也要切合圖片。
小建議:
一句話表達(dá)內(nèi)容，讓訪客知道點(diǎn)擊圖片會發(fā)生什么。不要選擇有聚焦有問題的圖片。圖片要高清大圖，如果有必要，可以選擇濾鏡或者磨砂。
優(yōu)秀實(shí)例：Pixelgrade
Formula1data
五、層次感
具體是文本相對于圖像中其他元素的位置，是在圖像之后，還是圖像之前？是融入其中？還是獨(dú)占一方？進(jìn)一步分析，如何將文本關(guān)聯(lián)到圖像的聚焦元素？
經(jīng)驗(yàn)法則：文本越小，空間上顯得越遠(yuǎn)。
本例中，盡管背景圖細(xì)節(jié)豐富，但我們的視覺會停留在超長的文本上，忽略了圖像。同時人物與文本看起來像在同一水平線上，層次感弱。
將文本放大后，層次感立刻就出來了。
優(yōu)秀實(shí)例：Danielladraper
Vivaco
河南億恩科技股份有限公司(www.vbseamall.com)始創(chuàng)于2000年，專注服務(wù)器托管租用，是國家工信部認(rèn)定的綜合電信服務(wù)運(yùn)營商。億恩為近五十萬的用戶提供服務(wù)器托管、服務(wù)器租用、機(jī)柜租用、云服務(wù)器、網(wǎng)站建設(shè)、網(wǎng)站托管等網(wǎng)絡(luò)基礎(chǔ)服務(wù)，另有網(wǎng)總管、名片俠網(wǎng)絡(luò)推廣服務(wù)，使得客戶不斷的獲得更大的收益。
服務(wù)器/云主機(jī) 24小時售后服務(wù)電話：
0371-60135900
虛擬主機(jī)/智能建站 24小時售后服務(wù)電話：
0371-55621053
網(wǎng)絡(luò)版權(quán)侵權(quán)舉報電話：
0371-60135995
服務(wù)熱線：
0371-60135900
