相信作為設(shè)計(jì)師大家對(duì)“易讀性”這個(gè)詞一定不陌生,。之前講過(guò)的許多設(shè)計(jì)法則其實(shí)就是為它服務(wù)的，之所以需要設(shè)計(jì)師,，就是因?yàn)榇蠹倚枰腥税央y以閱讀理解的信息重新整理,、排列甚至于以插圖或影像等形式更簡(jiǎn)潔的傳達(dá)給用戶。

今天我們就來(lái)說(shuō)說(shuō)怎么做才能提高易讀性,，從視覺(jué)上取得成功,。

一、建立明確的焦點(diǎn)

無(wú)論是海報(bào),、網(wǎng)頁(yè),、還是移動(dòng)端頁(yè)面，都需要一個(gè)視覺(jué)焦點(diǎn)來(lái)吸引用戶視線,，從而讓用戶繼續(xù)下一步操作,。

那么怎么才能突出某個(gè)元素使之成為頁(yè)面的視覺(jué)焦點(diǎn)呢？在這里不得不提的就是“對(duì)比”,。想要某個(gè)元素引人注目,，對(duì)比，通常是最重要的一個(gè)法則,，它能使讀者首先看向這個(gè)元素,。永遠(yuǎn)要記得對(duì)比的金句：“如果元素不相同，那就干脆讓它們截然不同”,。

不僅僅是大小,，元素的任何方面都可以成為對(duì)比的基準(zhǔn)。

1,、字體對(duì)比

這組為豎排字體海報(bào),，在設(shè)計(jì)中使用文字豎排，除了可以更好的體現(xiàn)傳統(tǒng)主題外,，同時(shí)也會(huì)很好的形成文字對(duì)比,，讓文字更加突顯。（以下案例作者：Quim Marin）

字體大小的對(duì)比可以突出主題與信息層級(jí)。

2,、顏色對(duì)比

各種互補(bǔ)色的對(duì)比是抓住用戶眼球的關(guān)鍵之一。（案例作者：Ola Jasionowska）

相對(duì)于文字，圖像信息更容易讓用戶get信息,，搭配各種醒目的色彩對(duì)比則能有效的提高畫(huà)面易讀性,。

3、形狀對(duì)比

形狀對(duì)比加上疊色的處理，馬上抓住用戶的視覺(jué)焦點(diǎn),。

4,、空間對(duì)比

說(shuō)到空間對(duì)比，不得不提的就是留白,。通過(guò)在文字周圍留白來(lái)讓內(nèi)容更加醒目,。也能讓畫(huà)面有更多的空間來(lái)“呼吸”，也能讓觀者有更多的視覺(jué)遐想,，同時(shí)有效傳達(dá)內(nèi)容,。

二、盡量減少眼睛必需瀏覽的分組數(shù)目

在《設(shè)計(jì)師要懂的心理學(xué)》中有一章提到了“人天生愛(ài)分類”所以當(dāng)你將相似的項(xiàng)聚集在一起,，阻止負(fù)空間成為用戶的視覺(jué)障礙就避免了“亂堆亂放,，用戶不知從何看起” 這一問(wèn)題。

說(shuō)到這大家應(yīng)該想起了在以前文章中一直反復(fù)提及的“親密性”這一原則,，彼此相關(guān)的項(xiàng)應(yīng)當(dāng)靠近,，歸組在一起。如果多個(gè)項(xiàng)之間存在很近的親密性,，他們就會(huì)成為一個(gè)視覺(jué)單元,，幫用戶分類從而提高易讀性。

各種類型的設(shè)計(jì)抑或是各種設(shè)計(jì)中不同的元素都應(yīng)該遵從這個(gè)原則,。

1,、海報(bào)、網(wǎng)頁(yè)（作者Aur?lien SALOMON）

作者用形狀把信息分類,，將用戶視線固定在形狀內(nèi)，并且用長(zhǎng)方形背景連接用戶視線來(lái)引導(dǎo)視覺(jué),。

每個(gè)信息都在該在的地方看起來(lái)是不是輕松多了,？

黑色區(qū)塊的反復(fù)出現(xiàn)不僅起到強(qiáng)調(diào)的作用,，還連接了整個(gè)畫(huà)面。圖文對(duì)齊和聚集把用戶的視線鎖在圖文區(qū)域,。

2,、移動(dòng)端

卡片式設(shè)計(jì)是整理信息的有效方法。

三,、視覺(jué)引導(dǎo)

合理的視覺(jué)引導(dǎo)是提高頁(yè)面易讀性的重要因素,。視覺(jué)引導(dǎo)也分為非常多方面。

1,、對(duì)齊

將元素對(duì)齊可以使畫(huà)面形成一條隱形的線,，而這些線就是一條清晰的視覺(jué)路徑。

這邊需要注意的一點(diǎn)是：慎用居中對(duì)齊,！初學(xué)者喜歡把圖像元素,、大標(biāo)題,、正文甚至于標(biāo)簽都居中。并不是說(shuō)不能使用居中對(duì)齊,，只是居中對(duì)齊的視覺(jué)效果有點(diǎn)無(wú)聊,。

對(duì)齊的目的是使頁(yè)面統(tǒng)一且有條理。其效果類似于把桌面雜物收拾起來(lái),，并放到收納箱中,。

來(lái)上一個(gè)對(duì)齊小課堂吧！

2、字間距行間距

這兩個(gè)因素會(huì)大大影響文字易讀性,，如果兩者調(diào)用不當(dāng)會(huì)打亂讀者閱讀視線,。舉個(gè)簡(jiǎn)單的例子。

如果字間距行間距不恰當(dāng)，容易讓人不知所云,。不知怎么讀才是正確的,。

3、信息層級(jí)

想讓讀者迅速 get 信息,，并且按照信息的重要性依次引導(dǎo)讀者視覺(jué),，就要將信息合理拆分并且組合，按照設(shè)計(jì)師想要傳達(dá)的順序依次呈現(xiàn),。

想要深入了解視覺(jué)引導(dǎo)的,，可以看看K先生的這篇文章，以上兩張圖片均圖片摘自研習(xí)設(shè)K先生的文章《想成為高級(jí)視覺(jué)設(shè)計(jì)師,？先學(xué)會(huì)引導(dǎo)讀者視線的方法,！》非常全面。

4,、字體

字體數(shù)目

這也是初學(xué)者容易犯的錯(cuò)誤之一,，喜歡在頁(yè)面中堆滿各種花里胡哨的字體，導(dǎo)致視覺(jué)過(guò)載和雜亂無(wú)章,。非常容易讓讀者產(chǎn)生視覺(jué)疲勞從而放棄閱讀,。

大家觀察一些優(yōu)秀的作品也一定會(huì)發(fā)現(xiàn)頁(yè)面中的字體種類很少會(huì)超過(guò)兩種。

在使用英語(yǔ)的時(shí)候盡量避免全部大寫(xiě)

當(dāng)文字以全部大寫(xiě)的形式出現(xiàn)時(shí)，我們就要逐個(gè)字母閱讀,，而不能成組閱讀,。

確保色彩對(duì)比度合理

看看這個(gè)例子，應(yīng)該不用我多說(shuō)了吧,？

這樣是不是就好多了,？

案例來(lái)自：typography-web-design-10-tips

最后

引用《人人都是設(shè)計(jì)師中》的一句話：“保持簡(jiǎn)單,，有所克制,。”    ?