有些網(wǎng)站設計整體看起來給人的感覺很好，即使他們“無視”傳統(tǒng)的經(jīng)驗或設計理論和原則。最近正當流行的一個新的設計趨勢就展示了這種想法——用其他元素覆蓋或阻礙設計中的一些文本。

這是一個有趣的趨勢，因為它違背了我們通常在設計時所經(jīng)常強調(diào)的——設計必須能夠快速地與用戶連接。

不用說，這是一個棘手的問題如果你想將這個技術有效的落實到你的設計中。但是，同樣毫無疑問的是，如果你剛好在恰當?shù)臅r機和位置使用好這項趨勢的話，你的設計將會有驚人的效果和影響力。這里有一些關于該趨勢的細分和一些想法，你可以在你的網(wǎng)站設計或平面設計中自己動手試試看。

1.簡單的效果

如果你使用這項趨勢通過設計中的其他元素將文本元素覆蓋的話，那么最好設計中的其他一切視覺都必須是非常簡單的，這樣用戶不會在太多的效果中迷失。

Root Studio做了一個很好的示范，用戶的第一印象很容易被鮮艷的顏色和簡單的長頸鹿動畫所抓住，其中，你很容易注意到被遮蓋了一部分的超大文本。這里需要注意的是，即使有些字母被阻擋，用戶仍然可以橫容易的辨識出屏幕上的單詞是什么。由于字體的大小、字體類型的簡單和遮蓋元素的放置位置，使得這些字母仍然可讀。

設計團隊特別關注文字的遮蓋問題，以保持“基調(diào)”的完整性，這是特定網(wǎng)站的品牌。在每一個響應的斷點上，要盡量保證文本不會比其他任何文本更模糊（這正是其中許多設計功虧一簣的地方，它們在桌面版本的分辨率上看起來很棒，但是在其他小分辨率，比如移動端來說，文本太小，以至于在可讀性上大打折扣。

2.三維層

添加一個三維的分層效果可以幫助元素從屏幕上脫穎而出，這樣用戶幾乎可以感覺到他們可以伸手觸摸它們。在某些情況下，文本可以充當背景元素。

只需確保文本的上一個圖層不要遮蓋太多的單詞（或短語）。確保文本遮蓋不會影響其他元素的放置而導致不必要的詞，這一點非常重要。

Simply Chocolate很好地利用了這種分層效果。它的工作原理主要是由于超大字體的組合，使用的是粗體字中的常用詞，并在背景的文字層上使用了與糖果圖片元素中的完全相同的單詞，并且它的大小剛好。

這種處理使背景中的大字體更像是一個圖形元素而不是一個可讀的文本元素，這可以創(chuàng)造出一種新的對比和分層效果（你可能會發(fā)現(xiàn)自己正在不由自主的滾動各種不同口味的糖果，看看它們是如何以不同的方式產(chǎn)生效果的）。

3.忘掉空間（留白）規(guī)則

有時文字遮蓋并不真正意義上的覆蓋字母，而是在某個意義或維度上侵犯了原本屬于文本層的空間。

North Street在其網(wǎng)站的設計上打破了這項規(guī)則，但是打破并沒有使設計的整體被破壞，并且在感覺上你也不會有雜亂或脫節(jié)的感覺。公司的描述文本正好與屏幕上的垂直規(guī)則相沖突（設計的其余部分使用這種區(qū)格化當前頁面的美感）。

如果有人說他們將要使用這種方式，你可能會試圖說服他們不要這么做，但改效果在上面的案例中卻表現(xiàn)的很好。視覺的組成在整體上給人一種“輕”的感覺——由于大量的白色空間，他們在字體的選擇上也足夠大膽，使得盡管灰色的細線幾乎落在整個背景中，并“侵犯”了原本屬于文本的空間，你仍能閱讀的很好，不會有不舒服的體驗。

第二條灰色的線進一步分割導航中的文本，但大多數(shù)用戶可能甚至不會注意到這個遮蓋。

4.大字體Only

查看這里的所有示例，你可能會注意到一個它們都具備的共同主題——所有被阻擋的文字都相當大，并且使用的是簡單的字體。

小字體通常不會給你足夠的空間以一種有目的的方式來覆蓋部分文字。如果你計劃在你的設計中使用這個趨勢的話，它應該在感覺上有意這么做的并且有意義。

遮蓋小字體是非常困難的，在有目的的設計和可讀性方面。這就是為什么這項技術目前更多的是于超大字體搭配的原因。

這些大的，通常是無襯線的字體，很容易被閱讀，同時，往往具有中等寬度或者在“o”型區(qū)或“平臺”區(qū)具有較大寬度的企圖，使分層元素更容易實現(xiàn)。為了使這個概念發(fā)揮作用，你需要根據(jù)字母的形狀，使用自己的概念。薄的或濃縮的樣式通常不起作用，復雜的風格太難閱讀。

5.使用小對比度的元素

有時遮擋文本的元素并不是位于文本之上的元素，而是文本元素與它周圍的元素之間的關系。文本和背景元素之間缺乏對比也會導致文字被遮擋的效果。

同樣，這可能是一個很難有效解決的概念。文本的本質就是方便閱讀和識別，缺乏對比會使事情變得困難。

當與高度可讀的文本配對時，低對比度文本元素在屏幕上反倒成了一種微妙的提醒。這些元素將在其他高對比度元素被注意和讀取之后再被讀取。

在上面Anew的網(wǎng)站設計中，對業(yè)務的描述比品牌更重要。這就是設計告訴用戶的信息，通過對類型的處理。他們的關鍵詞“屋頂+測試廚房”很容易被注意和閱讀。而品牌名稱“Anew”出現(xiàn)在一個低對比度并且位置偏下的品牌logo下。由于logo本身足夠大，用戶的視覺仍然能夠被它所吸引，但在閱讀和信息收集時，它并不是主要的焦點。

這種處理在這個空間中工作的部分原因是因為設計的內(nèi)容。想想“Anew”一詞與明亮的白色餐盤之間的共生關系，它讓人感覺新鮮，不同，誘人。

總結

遮蓋文字設計越來越流行。不久前，你很難在網(wǎng)上找到這種風格的東西（因為設計人員不必擔心響應斷點的問題），打印設計的使用更為一致。

只需注意用不完全可見的文本創(chuàng)建內(nèi)容，確保這些話仍然是你打算說的意思。如果你對設計如何被察覺或閱讀時有疑問，當使用遮蓋文本時，考慮另一種選擇，你一定不想讓你的設計難以讓用戶理解。