當我們建立網站的時候，我們一般從定義正文開始。正文的定義顯示了你的主欄有多寬，其它幾欄的大小就隨它自己內容定義了。直到最近，各種螢幕解析度或多或少是同質化的。如今，我們要處理各種螢幕尺寸和解析度。這讓處理變得更復雜。
在重整旗鼓的熱情中，我寫了一篇關於響應式排版的部落格，這篇文章主要專注於我們最近的實驗：響應式字型。如果不知道IA的歷史，你可能會錯過我們新啟動的網站中的響應式排版和設計的一些關鍵點。我決定從頭做起，一步一步解釋響應式排版，而不是整理所有文章。以下是第一步。
為了防止給每個可能的螢幕尺寸做不同的層級設計，很多網頁設計師會採用響應式網站的概念。一言以蔽之，這是一種網頁佈局會自動適應螢幕尺寸的概念。有很多種方法可以定義這種概念。我喜歡用這種方法：
適應性佈局：按步驟調整佈局適應有限數量的螢幕尺寸。流體性佈局：不斷地調整佈局以適應每一種可能的寬度。兩種方式都有優勢和劣勢，我們相信佈局適應於很少的合理變化位置是我們要採用的方法，因為可讀性比佈局寬度隨時和視窗一樣寬來得重要。這是不是一個複雜的問題它本身就值得商榷，但是最優的可讀性需要在文字尺寸上一定數量的控制（欄寬），就此看來，流體式佈局會產生更多問題。
提示：響應式設計已經包含了很多巨集觀排版問題（文字大小、行高、欄寬）。於是響應式設計已然在很多方面包含了響應式排版。在我們自己網站上第一次發表關於響應式字型的文章主要針對我們使用的“階段字型”。我想要在下一篇說說關於階段的東西，現在要快速在螢幕上進入響應式巨集觀排版的問題。
選擇一種字型
正確的色調
遲早，你需要決定哪種字型是你想要用的。你選擇一種字型主要是色調上的問題，但是，因為每一款字型都有它自己的品質，都需要（或禁止）一定的處理，字型的選擇會產生很多視覺和技術上的結果。網頁字型有非常多種可以選擇，所以選擇一種適合的字型是另外一種考驗。
我們通過為自己的網站設計字型來試驗階段性字型。我們選擇了一種襯線字型因為它適合我們的色調，同時對映出我們內容的提煉。我們為IA WRITER選擇了一款等寬字型。因為我們程式的首要目的是幫你得到第一手的草稿，我們尤其選擇了nitti字型，一款讓你同時覺得很有力但是很細緻的字型。使用等寬字型的決定也是因為第一個ipad的系統不自動緊排比例字型。我們即刻決定使用等寬字型，而不是使用比例字型以至渲染效果很差。
有襯線字型還是無襯線字型
通常的選擇會在有襯線字型和無襯線字型之間。這本身是一個很複雜的問題,但是這裡有一個簡單的經驗法則可以幫你：有襯線字型是一個牧師，無襯線字型是一個黑客。沒有一個比另外一個好，但是，因為各種各樣的原因，有襯線字型有更獨裁的痕跡，而無襯線字型感覺更民主。記住，這是被包裹在兩條懶散的線裡面的五千年的排版歷史，，所以，不要太在意。
很多的人仍然認為在螢幕上的排版的問題，＂襯線或無襯線＂這個問題本身解答了它自己。事實上，沒那麼簡單。有別於一般的理念，如果你選擇大於12號的字型，有襯線和無襯線字型可以表現得一樣好。小於12號的有襯線字型渲染得不夠銳利，但是（同時，這點帶領我們進入第二點）在現代的顯示器上，12號字型絕對太小了。
什麼尺寸？
你的正文字型不是取決於你自己的個人喜好，它取決於閱讀距離。因為一般的螢幕離人會比書本遠一點，桌上型電腦字型的大小要比印刷的大一些。
下面的圖案顯示了，當你的正文字型離你的身體越遠，需要的字型更大。兩個黑色的和兩個紅色的A有一樣的度量尺寸。但是因為右邊的一副被拿在更遠的位子，感受到的尺寸會更小。右邊紅色的A和左邊黑色的A在感受上一樣的尺寸：
字型離得越遠，視覺上會顯得越小。你需要將字型設定得更大一些，當字型閱讀的距離更遠的時候。選擇多大的字型是一個科學性的問題。如果你沒有什麼經驗，有用的一個竅門是，將一本印刷很好的書放在合適的閱讀距離，然後比照螢幕字型大小。
平面設計師沒有網頁設計經驗的時候，把網頁正文字型和印刷字型相比的時候，會驚訝於網頁正文字型有多麼大。提醒下你，只有你在一排一排地作比較的時候會覺得字型很大，然而通過透視觀察就不會這樣覺得了。
如果在增加了正文字型大小之後，新的字型在一開始刺激了你，不要擔心這很正常。然而，當你習慣了它，你不會想要回到＂標準＂的小尺寸。
從2006年開始我們已經推薦了＂透視化比例＂字型尺寸。最初，我們宣告Georgia 16號字型是一個很好的正文尺寸參照，這個引起了很多的憤怒甚至一些嘲笑，但是現在這或多或少是一個普遍的標準。隨著更高階的解決方案出現，這個標準慢慢地變得老式了。
行高和對比
正文字型尺寸可以通過那個透視竅門來評估，而行高需要一些調整。隨著更遠的閱讀距離和更多的畫素汙點，給螢幕上的文字比印刷的更大一點的行高是比較聰明的方式。140%是一個好的參照，但是當然，這個需要根據你選擇的字型來定。
今天，作為一個前提是你要確定對比不會太弱（比如灰色的文字在淺灰色的底上）或者太刺眼（比如粉紅之於綠色）。自從螢幕字型的設計是黑色之於白色，用黑色的背景有點困難，但是這些做得好也會很不錯。隨著現代高對比的螢幕，選擇黑灰字型或者淺灰的背景都是可取的，而不是深黑之於白色。但是，依然，這不是重要的問題。
iPhone vs iPad
很多我們學習到的關於響應式排版的知識都是從給我們的書寫軟體尋找完美的字型中來的。當我們設計IA WRITER的時候我們花了幾個星期去尋找正確的排版解決方案。在當時，高解析度的ipad螢幕是一個全新的挑戰，它也花了我們很長時間直到我們找到它的運作方式。當蘋果提出iphone的retina螢幕以及之後的ipad的retina屏，所有東西都改變了。我們完全可以寫一本書解釋我們是如何得出IA WRITER中“令人諷刺”的字型，但是這些非常一般的事情有太多東西要說，所以我長話短說。
如果你對比我們最新版本的iphone軟體和ipad軟體，你會發現字型的尺寸是不一樣的。
為什麼用不同的字型尺寸在iphone和ipad上？如果你很認真地看了上面的解釋，你就應該已經猜到了。
當人和螢幕的距離不是經常一樣的時候，通常來說，你手持ipad在早餐桌上，當你坐在沙發上的時候在你的大腿上，或者當你躺在床上，螢幕就在你面前，這些場景會有各種不同的使用距離。這是一個全新的挑戰，因為桌上型電腦和筆記本的使用距離不會發生這麼多變化。為了讓它在各種距離中都好用我們選擇了最遠的來確定字型尺寸。這個可能會得出比床上使用的字型更大的字型，但是，這時不舒服的，同時，你一般不會在躺著的時候將ipad放在肚子上面寫文章。
iphone上面只有更少的螢幕空間，所以你需要集中來做調整。幸運的是，iphone會被放在面前很近的距離來操作，所以要用很小的文字尺寸來完美執行。從平均閱讀距離中可得到iphone和ipad的一個相似的字型尺寸。
因為iphone會被放得離眼睛很近，行高也可以緊一點，同樣也是因為螢幕小而顯得很有必要:
當你為螢幕而設計的時候不是所有東西都是隨你願的。互動設計是工程性的：這不是尋找完美的設計，者是在尋找完美的妥協。在我們的例子中，我們必須去減少行高、行間距、字間距等等
這些調整是如此精細以致於你不知道，你不會發現行距有多小。為什麼我們不直接拿掉行距？行距不是美學上的事情，它讓文字呼吸以及幫助我們的眼睛從一行跳到另一行。如果你覺得這些都聽起來很難理解：不，到現在為止我們只涉及到了初級的東西。
那桌上型電腦如何？
一些人抱怨mac上面的WRITER字型太大。和ipad一樣（ipad會被放在各種不同的距離使用），我們要尋找適合mac螢幕的最適中的字型尺寸。當時，我們的參照是24英寸的高解析度imac，得到的字型尺寸或多或少適合其他所有裝置。
因為執行IA WRITER 的MAC電腦數量是有限的，我們可以決定不同的適合的解決方案。我們檢視了各種可能的佈局以確保這個文字尺寸是各種裝置上一個最好的折中。
你可能問＂為什麼不讓使用者自己選擇字型大小？＂然而，調整字型尺寸不是一個關於興趣的問題，是一個閱讀距離的問題。自從大多數的網站和應用會有一個極其小的字型尺寸，新的使用者會從一開始就選擇他們習慣的尺寸，會有這種結果：字型太小，無法體驗我們寫作軟體的所有快感。主要原因不是我們想把一些想法強加在所有使用者上：我們想要的是，IA WRITER 不需要任何設定和摸索，你唯一要做的就是書寫。這個已經是IA WRITER成功的公開的祕密了，改變這個將改變軟體的核心。（我們要加強的是弱視人群同樣易得到的一致性設計。）
那麼好，為什麼不根據裝置的解析度自動調整呢？那不是真正的響應式排版嗎？對的，我們正在作和這個概念相似的工作。現在，通過分辨調整，你同樣需要選擇視覺上合適的權重來確保字型在各種尺寸和解析度下顯示預期的效果。字型的視覺同時也是隨著字型尺寸和解析度變化。這就是為什麼MAC、IPAD1/2、IPAD上面的IA WRITER用不同的分級顯示。想要清楚的解釋“分級數字字型”後面的邏輯性和我們網站背後的想法，我需要更多的時間和空間，所以，請等待PART II
到目前位置的反應
雖然沒有社交媒體按鈕，但是這篇文章還是得到了很多的轉載，很少的批評的點，主要圍繞流體層級和自適應層級的問題，對於這個問題，我想將它放在後面說。我表示吃驚，當我聽到Joshua Porter這樣評論：
@IA 直到我看到“互動設計是工程性的”的時候，我比較困惑。這是如何運作的呢？
.就如很多其他人想知道的，全部的引用是：“當你為螢幕設計的時候，不是所有的東西都是按你預期的運作。互動設計是工程性的：這不是關於尋找完美的設計，這是在尋找完美的妥協。”通常我會說，“網頁設計是工程性的：這不是關於尋找完美，是尋找最好的妥協。”用“網頁設計”的話這句話會表達清晰一點，因為這個設計很多明顯的技術暗示。我之所以用“互動設計”是因為這些例子中我用了app。
這個的意思是當平面設計需要以及允許你有很大程度的視覺控制，而網頁設計需要你從一開始去思考關於視覺設計和技術的相互妥協為了得到完美的結果，你需要去探索很多不同的解析度，通過每個自身的利弊在所有次優的選擇中尋找最好的折中。
在這一點上，平面設計師經常會打斷你說話，同時嘗試證明他們也處理很多技術上的問題。當然，他們是做了。所有的藝術和設計需要技術上的知識。但是就像設計汽車引擎和設計網站有個不同點，設計網站和雜誌和設計網站也有不同點。這個不同點和工程性的程度有關。
總結來說，這意味著在設計網站和app的過程中，很多我們想的東西都是關於折中和嘗試尋找沒有太多缺點的解決方案。這讓很多平面設計師選擇不幹了，因為他們習慣於有控制權。Khoi Vinh有更多精彩的演講關於螢幕和平面設計中的不同點。