對任何字體工作者而(ér)言，在(zài)移動設備上(shàng)要(yào / yāo)面臨與生俱來(lái)的(de)挑戰：空間有限，環境光通常比較微弱。不(bù)過将已經用于(yú)web端的(de)技巧稍加調整，我們就(jiù)可以(yǐ)提升移動設備的(de)易讀性。

一(yī / yì ／yí)、留足空間

與普遍觀點恰好相反，字體并非屏幕上(shàng)彎彎曲曲的(de)線條排列；它主要(yào / yāo)在(zài)于(yú)周圍和(hé / huò)相互間的(de)空間。

字母本身對字體的(de)影響，與構成它的(de)空間相比，要(yào / yāo)小得多。

要(yào / yāo)理解這(zhè)一(yī / yì ／yí)點，了(le／liǎo)解字體從何而(ér)來(lái)很有幫助：字母o（還有b、c、p等等）中間的(de)圓孔被稱作“凹槽”。在(zài)最原始的(de)印刷機上(shàng)，鉛字由金屬雕刻而(ér)成，這(zhè)些 凹槽來(lái)自雕刻成型、排列在(zài)盤中的(de)金屬活字。第一(yī / yì ／yí)個(gè)字體設計師所處理的(de)模具，實際上(shàng)并不(bù)能用于(yú)印刷。字母本身對字體的(de)影響，與構成它的(de)空間相比，要(yào / yāo)小得多。

談到(dào)層次時(shí)，我們通常指的(de)是(shì)h1到(dào)p，有時(shí)候還會到(dào)h6。但另外還有一(yī / yì ／yí)種層次在(zài)影響着行或段落的(de)視覺流，這(zhè)是(shì)特殊的(de)層次：字母間距小于(yú)字間距，字間距小于(yú)行間距，以(yǐ)此類推。

要(yào / yāo)在(zài)移動端創造最佳易讀性，尤其要(yào / yāo)注意這(zhè)些特殊層次，這(zhè)些格式塔式的(de)詞語、行、段落的(de)文字組合，在(zài)自然光環境下同樣至關重要(yào / yāo)。

二、行寬

行寬是(shì)一(yī / yì ／yí)行文字的(de)長度。或者确切的(de)說(shuō)，是(shì)一(yī / yì ／yí)行文字的(de)理想長度，因爲(wéi / wèi)很難讓每一(yī / yì ／yí)行都精确吻合。

衆所周知，舒适閱讀的(de)理想行寬是(shì)65個(gè)字符左右。行寬産生的(de)物理長度，取決于(yú)字體的(de)設計、字間距（見下文）和(hé / huò)你使用的(de)具體文字。本文開篇的(de)65個(gè)字 符（譯者注：此處請參見英文原文），用PT Serif字體是(shì)26.875em寬，用Open Sans是(shì)28.4375em寬，用Ubuntu字體是(shì)27.3125em寬。如果再加入斜體、大(dà)小寫和(hé / huò)一(yī / yì ／yí)大(dà)堆其他(tā)字體細節，還會有更大(dà)的(de)差異。

在(zài)桌面端浏覽器中，65個(gè)字符很難觸及邊緣，但在(zài)移動設備上(shàng)，65個(gè)字符（如果至少大(dà)到(dào)看得清）會超出(chū)浏覽器的(de)邊界。所以(yǐ)，在(zài)移動設備上(shàng)，你必須得縮減行寬。

移動端并沒有普遍認可的(de)行寬标準。不(bù)過傳統上(shàng)，報紙或雜志上(shàng)每一(yī / yì ／yí)個(gè)窄列都會趨向于(yú)39個(gè)字符。鑒于(yú)這(zhè)個(gè)理想行寬已經經曆了(le／liǎo)數個(gè)世紀的(de)考驗，它在(zài)移動端字體上(shàng)也(yě)運轉良好。

三、寬松行距、緊湊行距

行距是(shì)行之(zhī)間的(de)空間，行距太緊湊，會讓視線難以(yǐ)從行尾掃視到(dào)下一(yī / yì ／yí)行首。行距太寬松，字間距會開始形成隊列，産生了(le／liǎo)我們通常意義上(shàng)的(de)河流，阻斷了(le／liǎo)行的(de)視覺流。

從左至右：理想行距、太緊湊、太寬松。

行距的(de)标準通常是(shì)1.4em，但以(yǐ)我的(de)經驗，這(zhè)對于(yú)屏幕來(lái)說(shuō)太緊湊了(le／liǎo)：在(zài)屏幕上(shàng)表現良好的(de)字體都有一(yī / yì ／yí)個(gè)關鍵特征——大(dà)的(de)凹槽，大(dà)凹槽需要(yào / yāo)更大(dà)一(yī / yì ／yí)些的(de)行距來(lái)保持空間層次。

反過來(lái)，更短的(de)行寬需要(yào / yāo)更小的(de)行距。所以(yǐ)你可能需要(yào / yāo)将桌面端的(de)行距設得寬松點，同時(shí)記得将移動端的(de)設置得緊湊些。

四、找到(dào)最佳狀态

所有字體至少都有一(yī / yì ／yí)種最佳狀态，在(zài)屏幕上(shàng)展現最佳的(de)尺寸，還有在(zài)浏覽器中最能保持字形的(de)抗鋸齒選項。

最佳狀态下，多數筆畫通常都能排列在(zài)像素網格中——像素字體，如果你還記得的(de)話，那些字體僅僅在(zài)字号調整到(dào)最佳狀态下才有效。

将字體設爲(wéi / wèi)最佳狀态能形成更強烈的(de)對比。爲(wéi / wèi)移動端設計時(shí)，對比尤其重要(yào / yāo)，因爲(wéi / wèi)戶外的(de)強光可能分散注意。

你會發現，微調行距會使每行脫離完美像素匹配。我覺得，在(zài)移動設備屏幕上(shàng)，對比的(de)重要(yào / yāo)性勝過行距。所以(yǐ)如果你不(bù)得不(bù)在(zài)行距上(shàng)妥協，來(lái)保持每行契合像素網格，那就(jiù)這(zhè)麽做吧。

通常設計師通過基線網格來(lái)排列文字。但在(zài)移動設備上(shàng)，我們需要(yào / yāo)使用x高度來(lái)代替（x高度顧名思義，就(jiù)是(shì)小寫字母x的(de)高度）。從易讀性研究中，我們知道(dào)大(dà)腦識别的(de)是(shì)文字頂部，而(ér)不(bù)是(shì)底部。所以(yǐ)要(yào / yāo)成就(jiù)更加平順的(de)視覺流，我們要(yào / yāo)确保字符頂部最契合像素網格。

五、不(bù)要(yào / yāo)忽視起伏邊

起伏邊是(shì)一(yī / yì ／yí)段文字的(de)邊緣。你讀的(de)多數内容是(shì)居左對齊的(de)（至少對于(yú)拉丁語系而(ér)言），導緻右邊沿參差不(bù)齊。

當視線從行尾跳至下一(yī / yì ／yí)行首時(shí)，大(dà)腦最好要(yào / yāo)能判斷出(chū)下一(yī / yì ／yí)次跳躍的(de)角度和(hé / huò)距離。把每次跳躍都想象成跑過跳闆，如果間距保持一(yī / yì ／yí)緻，就(jiù)會快很多。因此，文字左側邊緣應該是(shì)平的(de)，每行從同一(yī / yì ／yí)個(gè)地(dì / de)方開始（對于(yú)從右至左的(de)語言，恰好相反）。

因此你絕不(bù)應該将兩三行以(yǐ)上(shàng)的(de)文字居中對齊。

通常文字會設置成兩端對齊，這(zhè)意味着每行文字所占空間相等，所以(yǐ)兩側都不(bù)會有起伏邊。我懷疑兩端對齊的(de)流行和(hé / huò)響應式設計有關，它教設計師們以(yǐ)塊狀形 态思考。兩端對齊的(de)文字産生的(de)留白不(bù)統一(yī / yì ／yí)。最糟的(de)情況會導緻一(yī / yì ／yí)行中隻有幾個(gè)字，相當不(bù)協調。更窄的(de)行寬會加重兩端對齊的(de)問題，所以(yǐ)兩端對齊的(de)文字在(zài)移動端 是(shì)難以(yǐ)閱讀的(de)。

從左至右：左對齊、居中對其、兩端對齊。

如果整潔真的(de)非常重要(yào / yāo)，那麽使用連字符号來(lái)讓起伏邊更平滑，絕不(bù)能在(zài)移動端使用兩端對齊。

文字右側是(shì)起伏邊在(zài)移動端還有一(yī / yì ／yí)項額外好處：人(rén)們通常在(zài)易分心的(de)場合閱讀文字，讀者視線頻繁地(dì / de)從文字上(shàng)移開——查看站名，或是(shì)接電話。起伏邊創造了(le／liǎo)一(yī / yì ／yí)個(gè)随機形狀，讓右撇子(zǐ)的(de)視線可以(yǐ)通過重讀最少的(de)文字，回到(dào)剛才的(de)位置。

六、減少反差

增強文字與背景對比的(de)同時(shí)，我們也(yě)要(yào / yāo)減少不(bù)同層次文字間的(de)反差。

在(zài)移動端，實際可見的(de)文字更少，所以(yǐ)反差被放大(dà)了(le／liǎo)。

其原因是(shì)我們的(de)大(dà)腦基于(yú)環境來(lái)判斷重要(yào / yāo)性。在(zài)桌面端，标題可能是(shì)正文字号的(de)兩倍甚至三倍，因爲(wéi / wèi)屏幕上(shàng)有更多文字，所以(yǐ)這(zhè)是(shì)有效的(de)。在(zài)移動端，實際可見的(de)文字更少，所以(yǐ)反差被放大(dà)了(le／liǎo)。

多數設計師使用斐波那契數列式的(de)字号組合。在(zài)移動端，應該縮小比率來(lái)減少字号間的(de)反差。比如，如果你使用黃金比例1.618與字号相乘。在(zài)移動端，應該用更小的(de)比例1.382來(lái)替代。

桌面端屏幕比移動端容許更誇張的(de)字号縮放。

七、按比例調整字間距

爲(wéi / wèi)移動端調整字号時(shí)，我們要(yào / yāo)意識到(dào)字間距發生了(le／liǎo)必要(yào / yāo)的(de)變化。

（先說(shuō)一(yī / yì ／yí)句，不(bù)應該調整固有字距。固有字距是(shì)兩個(gè)字母相互組合時(shí)的(de)距離，使它們的(de)間距與其他(tā)字母間距在(zài)視覺上(shàng)統一(yī / yì ／yí)。創作字體時(shí)，就(jiù)納入了(le／liǎo)固有字距的(de)考量，這(zhè)個(gè)過程可能要(yào / yāo)花上(shàng)數月。如果你選用了(le／liǎo)一(yī / yì ／yí)款專業的(de)字體，它的(de)固有字距就(jiù)是(shì)合适的(de)，如果你覺得不(bù)對，請換一(yī / yì ／yí)個(gè)字體。）

字間距并不(bù)是(shì)固有字距。字間距是(shì)字體中應用在(zài)所有字符上(shàng)的(de)間距。通常你也(yě)不(bù)應該調整字間距。

大(dà)字号是(shì)個(gè)例外，拿标題和(hé / huò)小号文字（比如腳注）舉例。大(dà)号文字需要(yào / yāo)減少字間距，小号文字需要(yào / yāo)增加字間距。前者是(shì)考慮到(dào)分組，後者則是(shì)爲(wéi / wèi)了(le／liǎo)增強對比。如果你在(zài)調整标題，或是(shì)用了(le／liǎo)通常字間距緊密的(de)藝術字體，縮小時(shí)可能就(jiù)需要(yào / yāo)把字間距放開一(yī / yì ／yí)點。

總結

字體是(shì)一(yī / yì ／yí)門工藝，設計師終其一(yī / yì ／yí)生都在(zài)精心打磨。的(de)确如此，因爲(wéi / wèi)每個(gè)文字、每種字體和(hé / huò)每項技術都帶來(lái)了(le／liǎo)新的(de)挑戰。沒有一(yī / yì ／yí)成不(bù)變的(de)普适規律。

假如你追求易讀性，要(yào / yāo)牢記三條原則：行内的(de)視覺流要(yào / yāo)平順，空間層級要(yào / yāo)清晰，要(yào / yāo)有足夠的(de)對比。這(zhè)尤其适用于(yú)移動端頁面。

沒有不(bù)可撼動的(de)規則，全憑你雙眼決斷。不(bù)過本文的(de)指南可以(yǐ)作爲(wéi / wèi)理想的(de)出(chū)發點，讓你在(zài)移動設備上(shàng)優美地(dì / de)排列文字。