本文轉(zhuǎn)自設(shè)計師的私人日記，要查看更完整的文章內(nèi)容，請前往原文查看，傳送門：
https://mp.weixin.qq.com/s/zXijE9Wf7jPwUn9sAlsS6g

// 前 言 //

字體，只要不是特殊裝飾性的文字，都不至于發(fā)生無法閱讀的狀況。字體的設(shè)計人員都預(yù)先做了某種程度的設(shè)定，但是這種設(shè)定只能是達(dá)到“可以閱讀”。

在設(shè)計作品過程中，若要求達(dá)到“容易閱讀”的文字組合，字體和字號的選擇、文字和文字的間隔、行和行的間隔、字號的變化，都得依據(jù)版面來設(shè)計。

那究竟怎么樣才算是“容易閱讀”的文字編排呢？

“容易閱讀”包含兩個要素：“容易看”和“容易理解”。

“容易看”，是指閱讀文字的時候遇到的障礙少。字號過小、行間距過窄、顏色刺眼等等，這些對閱讀者來說都是障礙。要減少這些障礙，我們就必須要了解如何去配置易讀的文字。

“容易理解”，是指我們在看到文字的一瞬間，就能理解大概其內(nèi)容。我們站在讀者的角度去考慮版面的設(shè)計，考慮如何去引導(dǎo)讀者視線的順暢移動，尋求用文字進(jìn)行溝通交流的能力。

// 文字編排的工作 //

首先，我們根據(jù)設(shè)計對象去理解版面，有一個大致的版型構(gòu)建在我們的腦海中。根據(jù)版型去決定文字的組合方向，是橫排還是豎排更合適這個設(shè)計。

接下來，配合文章的氛圍選擇適合的“字體”，決定文字的“字號”。到了這個階段，也就可以設(shè)定出“版心”，也就是頁面上空白的部分。

最后，設(shè)定一行文字的“行長”，段落之間間隔的“欄距”，行之間間隔的“行距”，以及文字之間的“字距”。這些都是細(xì)微的部分，也是我們使文字更容易理解的必經(jīng)過程。

通過以上這些步驟，我們大概就能理清，要設(shè)計一個容易閱讀的文字版面，需要做的事情。接下來，讓我們逐一來解決它們。

// 字號//

容易閱讀的字號，會根據(jù)文字的目的、作用、讀者對象而改變

文字大略可以區(qū)分成標(biāo)題部分、正文部分以及補充說明部分。

標(biāo)題部分必然是版面中最顯眼的地方，尤其是大標(biāo)題，文字的尺寸必須比其它文字大且具有強調(diào)性。在大標(biāo)題之外，還有誘導(dǎo)視線的“小標(biāo)題”、補充內(nèi)容的“副標(biāo)題”、以內(nèi)概述部分的“前言”。這些字號都要求比正文的大。

在印刷物中，我們推薦正文為9pt的字號；

在web設(shè)計中，1920px分辨率下，12px的字號為最小字號；

而在移動端設(shè)計中，小字一般為20px。

當(dāng)然，以上都不是規(guī)定必須得這樣設(shè)定，只是在經(jīng)驗的總結(jié)下得出的結(jié)論。

// 邊界 //

“邊界”也就是我們所理解的左右留白，這些留白不僅能幫助閱讀，也會影響頁面?zhèn)鬟_(dá)出的印象。

設(shè)定邊界的目的，一方面為了防止頁面元素在邊界上導(dǎo)致的不完整呈現(xiàn)；

另外一方面，也是來自設(shè)計上的觀點，為了防止在視覺上因為邊界上的元素導(dǎo)致不整齊。

在印刷物中，我們要保證最少有5毫米左右的留白；

在web設(shè)計中，考慮到自適應(yīng)，頁面元素基本都在居中的750px里面；

而在移動端設(shè)計中，不同的產(chǎn)品有不同的風(fēng)格，基本上有24px、40px的邊界留白。

留白是影響頁面印象的最主要的元素，根據(jù)不同的需求去做相應(yīng)合適的處理。

// 行長與分欄 //

為了讓長篇的文章更容易閱讀，在正文部分必須設(shè)定合適的行長與分欄。

在確定好字號和頁邊距之后，一行可以容納多少個字符也相應(yīng)確定了。如果只是簡單的排成最多字?jǐn)?shù)，那樣就會因為一行過長而難以閱讀。這個時候就必須要分“區(qū)塊”，也就是“欄”。

在閱讀的時候，我們的視線從一行的開頭部分到另外一行的開頭部分逐行移動，如果單行過長，可能視線就會弄錯，導(dǎo)致閱讀障礙。

如果是印刷物，每一行35毫米～55毫米左右的長度會比較容易閱讀；

在web設(shè)計中，欄目可以根據(jù)頁面柵格化去設(shè)定；

而在移動端，因為屏幕較小，可以不做考慮。

// 行距 //

行距的大小，是為了讓人感受到文章的“間距”的重點。

行距的確定要素很多，需要根據(jù)橫排還是豎排、字號、字體、行長而去整體考慮設(shè)定。

正文部分的行距，一般設(shè)定為正文的半個字到一個字左右的尺寸。

// 字間距 //

字間距可以制造出閱讀文章的韻律感。

不同的字體有不同的默認(rèn)字間距的的設(shè)定，同一套字體里面，不同字的字間距也不同，以外文來說，“W”和“I”的字間距相差很大。如果不是有特殊的要求，一般對某套字體的字間距不做調(diào)整。

如果字間距設(shè)定很狹窄時，會呈現(xiàn)出密度感和張力；

如果希望有舒適悠然的感覺，可以嘗試讓字間距看起來寬松些。

// 視覺導(dǎo)向 //

隨著視線自然流動來配置版面，就會讓文字變得容易閱讀。

我們在閱讀的時候，都會無意識的按照某種順序來瀏覽。圖片和插圖首先吸引了注意力，其次才開始閱讀文字。

版面的文字以橫排為主時，視線從左上到右下移動；

豎排時，視線從右上到左下移動。

整體文字部分來說，標(biāo)題部分必須突出；

正文部分分欄排列，并且視線的折返應(yīng)該是有規(guī)律的。

依照視線的流暢移動而形成的版面配置，是很標(biāo)準(zhǔn)的容易閱讀的配置。有時候也可以突破標(biāo)準(zhǔn)，營造出歡樂氣氛的方式。

// 對比 //

給文字加點適度的變化，整個版面就能顯現(xiàn)出強弱節(jié)奏，也更易讀。

通過對照和比較來對元素進(jìn)行差異化的表達(dá)，從而將差異的部分強調(diào)出來。

想要讓文字有對比效果：

第一，改變文字本身設(shè)定的方法，如長、寬、字體以及色彩等，只要將一部分加以變化，就會和其它文字產(chǎn)生對比。

第二，改變文字的組合方法，如改變留白的空間、加上橫線、改變行長和對齊方式等。

加上適度的對比，可以使文章的文字間出現(xiàn)強弱對比。強弱變化可使閱讀文章時有韻律感，避免讓讀者覺得無聊。

// 小 結(jié) //

以上部分都是如何讓文字更易讀，那有哪些是需要在設(shè)計的時候避免的呢？

這些不能做的約束，稱為“禁忌”，也就是設(shè)計規(guī)范了。

如：在一行的開頭不能出現(xiàn)句號、逗號、冒號等等標(biāo)點符號；

同樣，在一行結(jié)束的地方不能放置前引號、前括號等等；

同時，也不能將公司名稱、產(chǎn)品名稱之類的固有名詞拆開。

最后，官方的提一句，文字的設(shè)定沒有固有的規(guī)律，不是說你必須如何如何，只是你需要在充分理解這些規(guī)范的情況下，結(jié)合具體的設(shè)計需求，去做相應(yīng)的調(diào)整，這才叫文字設(shè)計。