起因是很久之前看到了Ant Design 3.0 背后的故事后，覺得驚嘆又有趣，去年偶然得知螞蟻團隊，在關(guān)于字階這一塊推導(dǎo)的計算的公式便是參考的這一篇文章，便將其翻譯出來與大家分享。這篇文章比較老了，原作者在2011年11月發(fā)布在他的個人網(wǎng)站上（文末附鏈接），文章可能有些枯燥，耐心看下來還都是挺有趣的小知識。

印刷字號比例尺（字階）被用作營造頁面版面平衡與和諧已經(jīng)有好幾個世紀(jì)了。它是現(xiàn)代印刷業(yè)的基石，下圖Bringhurst先生在《字體排印風(fēng)格要素The Elements of Typographic Style》（見文末介紹）中記錄的經(jīng)典的印刷字階。

經(jīng)典印刷字階中的字體尺寸是保持一定韻律變化的，好似音階的音符。因為經(jīng)典印刷字階是一個比例關(guān)系，必須遵守一定的比例關(guān)系r，比如：在這個字階中x是一個字號大小，那么r*x對應(yīng)的字號大小也一定也在這個字階里，這里的r就是這個字階中的比例關(guān)系。該比例就是這個字階中的定義屬性，我們可以使用這個屬性把經(jīng)典印刷字階中的尺寸拓展到更大的字體尺寸上。

經(jīng)典印刷字階的拓展

6pt、12pt、24pt和48pt的字號尺寸都出現(xiàn)在這個字階中，這個字階中，字號大小的比例都是2倍的關(guān)系。在古典音階中，這個比例關(guān)系也是2。在鋼琴上彈C調(diào)時，每一個音符震動的速度，是前一個的兩倍，經(jīng)典字階和古典音階非常像。

字階中的第二個定義屬性是數(shù)字n，在經(jīng)典印刷字階中，每一個間隔區(qū)間有5個字體尺寸，經(jīng)典印刷字階與爵士或者絕大部分傳統(tǒng)音樂中的五音階的十分相似。

第三個，也是最后一個字階的定義屬性是字階中的基頻（基準(zhǔn)頻率） f0，在經(jīng)典印刷字階中，基頻就是“派卡”，一派卡=12pt，這個是印刷中的基礎(chǔ)字體大小，在這些比例當(dāng)中，第i個字號的與頻率fi滿足以下的通用公式：

使用這個公式，我們可以推導(dǎo)出經(jīng)典印刷字階中的每一個字體大小，同時我們也可以將這些值與傳統(tǒng)排版師依靠經(jīng)驗得出的值進(jìn)行比較。

（上：經(jīng)典印刷字階 下：排版師經(jīng)驗得出的值）

這么看來人本身的直覺還是相當(dāng)不錯的：這些依靠經(jīng)驗得出字體大小和經(jīng)典印刷字階的字體大小十分相似，他們之間僅有非常小的差異。

• 首先，有四個字號不在表中，分別是：28pt、32pt、42pt、55pt這四個字號，在字階中其他的字號大小都能夠相互完美的一一對應(yīng)上，不過這些丟失的字號與前面的字號基本上滿足一定的縮放比例關(guān)系，比如：16pt的字號的兩倍就是32pt。
• 其次，60pt和72pt這兩個字號被近似的調(diào)整為最接近的12pt倍數(shù)（1派卡）的大小，最后的結(jié)果就是現(xiàn)代的排版師采用了兩個比原先更小的近似字號。
• 最后一個問題是，有兩個額外的字號根本就不在字階中，經(jīng)典印刷字階中每五個字號為一組，但是在傳統(tǒng)的字階表中第一組有六個字號，11pt的字號并不在這個比例中，如果用樂器來演奏的花，這個會聽起來刺耳或沉悶，因為11pt恰好介于兩個字號中間，在音階中看的話，它是一個半音。（30pt的字號也是一樣）

在設(shè)計中的應(yīng)用：

pt是在印刷中的字號單位，但是在別的媒介中更適合用其他的字號單位，比如：在網(wǎng)頁設(shè)計中一般會用em和px作為字號單位，如果我們能將經(jīng)典印刷字階的大小擴展至更多的媒介上面，也會很有幫助的。

此外，我們知道在為樂曲選擇不同的音階可以讓聽眾產(chǎn)生不同的感受，那么我們選擇不同的字階是不是也會影響我們的視覺感受？

我們可以通過更改公式中的基頻f0，或者數(shù)字n，以及比例關(guān)系r這三種方式來變更字階。

1. 通過變更基頻f0，我們可以讓字階適用于新的媒介，比如：當(dāng)f0 = 12 pt時我們可以生成適用印刷的字階，但是當(dāng)f0 = 1em時我們可以生成適用于網(wǎng)頁的字階。
2. 通過改變刻度區(qū)間數(shù)n，我們讓變更字號數(shù)量變成可能。舉例：當(dāng)刻度區(qū)間中有n個字號時，我們會得到n+2個有用的字號數(shù)量（算上一頭一尾）：最小的尺寸，中間的基準(zhǔn)尺寸和其他一系列大小的字號。在經(jīng)典印刷字階中的n比較大，所以生成了數(shù)量較多的字號。但在有的設(shè)計中會更加的簡潔，n值會比較小，畢竟有時候少即是多。
3. 通過改變比例關(guān)系r，你就能調(diào)整字號變更的的速率。一般有兩個常見的比例：古典音階比例r=2或黃金比例r=1.618034。在我們平時上網(wǎng)的時候，網(wǎng)頁上標(biāo)題的字號一般都是正文的兩倍大，這意味著任何基于音樂比例的設(shè)計都會看起來比較漂亮，標(biāo)題和正文之間看作是音符，那么他們之間正好似乎二倍頻程的關(guān)系。

這里列出了一些基于最美音階的字階變換：

音樂三聲音階

音樂四聲音階

音樂五聲音階（也被稱為“經(jīng)典印刷字階”）

黃金比例音階

不過在不同的情況下，還是要根據(jù)場景采用不同的最合適的方式。比如：網(wǎng)頁中短小精悍的標(biāo)題可能更適合采用更大的比例（比如r=4），這樣會讓標(biāo)題更加的有沖擊力，并且和頁面上的其他元素保持平衡。

譯注：《字體排印風(fēng)格要素》是設(shè)計師Robert Bringhurst用詩意唯美的語言深入淺出簡潔凝練介紹了字體排印的歷史源流、理論實踐以及技術(shù)革新，此書被譽為字體排印最具權(quán)威指南。

原文鏈接：http://spencermortensen.com/articles/typographic-scale/

原文作者：Spencer Mortensen

翻譯：Mr.李lee（已獲原作者授權(quán)），微信公眾號：李李先森的康

本文由 @Mr.李lee 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自Unsplash，基于CC0協(xié)議