四、字型與排版 Typography
Roboto和Noto是Android和Chrome的預設字型。
Roboto是Android的預設字型。Roboto字型沒有完全支援所有語言。
Noto是一個包含所有語言的字型，它是Chrome的預設字型。
文字型別
- 英文和類似英文的(例如拉丁文、希臘文和西里爾文)
- 密集型（例如漢文、日文和韓文）
- 高長型（南亞、東南亞和中東的語言）
應用欄
標題型別，Medium 20sp
按鈕
英文：Medium 14sp，全部大寫
密集型：Medium 15sp，全部大寫
高長型：Bold 15sp
副標題
英語：Regular 16sp（移動裝置），15sp（桌面端）
密集型：Regular 17sp（移動裝置），16sp（桌面端）
高長型：Regular 17sp（移動裝置），16s裝置（桌面端）
正文（body）1
英文：Regular 14sp (移動裝置)，13sp (桌面端)
密集型：miRegular 15sp (移動裝置)，14sp (桌面端)
高長型：Regular 15sp (移動裝置)，14sp (桌面端)
文字對比度
最少：4.5:1
優先：7:1
語言分類(Language categorization)
可分為三類:
英文和類似英文：拉丁文（越南語除外）、希臘文和西里爾文，Roboto和Noto都支援。Roboto已經完全覆蓋到在Unicode 7.0中已被定義的所有拉丁文、希臘文和西里爾文。目前被支援的文字數已經翻了一倍，從以前的版本中大約2000字到目前大約4000字。
文字高長型：這一類的語言需要更大的行距以適應更大的字形，這類文字的國家包括南亞、東南亞和中東地區（像阿拉伯文、印地文、泰盧固文、泰文、越南文）。Noto支援這些語言。
文字密集型：這一類語言也需要更大的行距以適應更大的字形，這類文字的國家包括中國、日本和韓國。Noto支援這些語言。
你可以在這裡檢視 完整列表 。
字型（Typeface）
Roboto
Roboto已經能夠很好的支援跨平臺運用。Roboto略有點寬和圓，這可以使它在平臺上顯示得更加清晰，這也是它能夠被廣泛運用的原因。
Roboto字重
Roboto有六種粗細: Thin、Light、Regular、Medium、Bold 和 Black。
Noto
Noto的垂直度量與Roboto一致。
Noto字重
Noto中的CJK（中文，日文和韓文）有7種粗細： Thin、Light、DemiLight、Regular、Medium、Bold 和 Black。Regular粗細的Noto CJK字重與Roboto Regular相同。
Noto中泰文、梵文和所有其他主要生活語言都有Regular和Bold字重。
Google font directory（A directory of open-source web fonts）
Hinted字型
字型hinting（也被成為instructing）是用來調整（扭曲）一個字形，以便在低解析度螢幕中生成更加清晰的文字。但作為取捨，hinted字型要比unhinted版本消耗更多的空間。
所有的Roboto和Noto字型都有hinted版本和unhinted版本。在此，Google建議：
在 Android和Mac OS X系統上使用unhinted版本的字型，因為兩者不支援hinted版本。
在 Chrome OS、Windows以及 Linux系統上使用hinted版本版本。
Font stack（字型堆疊，是CSS字型系列宣告中的一份字型清單）
對於Android和web屬性，font stack應該先指定Roboto、Noto字型，然後再指定字型無襯線。
樣式（Styles）
過多的使用字型和字型樣式非常容易毀掉佈局。網格可以幫助你更好的在有限的範圍內進行文字排版。
在典型使用場景下，字型和字型樣式能夠平衡內容密度和閱讀舒適度。字型的單位sp（安卓開發用的字型大小單位，scaleable pixels），它能讓大型字號獲得更好的 可訪問性
英文和類似英文文字
拉丁文、希臘文和西里爾文。
基本樣式是基於 12、14、16、20 和 34sp的字型進行排版的。
就構成因素來說，應用欄中出現的文字需要使用“標題”樣式，Medium 20sp。
在某些情況下, 使用較大的“副標題”樣式而不是較小的“正文”樣式。這些情況包括了資訊以小片段的形式呈現或標題搭配了“正文”樣式文字等。
按鈕樣式（Medium 14sp，全部大寫）適用於所有按鈕。對於那些沒有大寫的語言，考慮使用有色文字使它們從普通文字中突顯出來。
密集型文字
中文、日文、韓文。
字重：Noto CJK文字有七種粗細，就像Roboto中的英語一樣。
字型大小：對於需要大寫的標題，可以使用比同等英文字型大1px的字型作為大寫。對於字型大小大於標題字型的，英文型別的大小正合適。
高長型文字
南亞、東南亞和中東地區（像阿拉伯文、印地文,泰盧固文,泰文,越南文）
字重：使用Regular，因為Medium在Noto中不可用。Google建議不要使用Bold，因為從母語者反饋回來的資訊表示Bold會顯得字型太重。
字型大小：對於需要大寫的標題，可以使用比同等英文字型大1px的字型作為大寫。對於字型大小大於標題字型的，英文型別的大小正合適。
行距
為了達到最佳的閱讀效果和合適的間距，行高要根據每個字型的大小和粗細來決定。只有“正文”、“副標題”、“標題”和較小的文字型別中才允許換行。其它文字型別應以單行形式出現。
英文和類似英文文字
密集型和高長型文字
對兩型別的所有語言文字，其行高都要大於英語語言文字0.1em。英語及其類似語言一般只使用到em box中的一部分，通常是x-height下方的部分。但是如中文、日文和韓文（CJK）這樣的象形文字就會用到整個em box。字型高的語言中通常會有降部或/和升部。為了CJK達到和英文一樣設計目的-避免高長型字型因行高的原因出現被“剪掉”的現象，高長型字型的行高必須大於英語及其類似語言以及密集型語言（CJK）。
其他排版指南
顏色＆對比
文字顏色與背景顏色太像會導致使用者很難閱讀。但是，對比過於強烈的文字也會導致很難閱讀。這一點在淺色文字與深色背景的組合上尤其明顯。
要獲得良好的辨識度，文字應當滿足一個最低的對比度，也就是 4.5:1（依據亮度值計算）。其中，7:1的對比度是最適合閱讀的。
這些色彩組合同樣要考慮到使用者對於不同文字對比度的不同反應。
大號文字與動態型別
為了更好的使用者體驗，使用動態型別文字代替小號文字或允許進行省略的大號文字。
如果使用得當，大號文字會讓應用顯得更加有趣，更容易對頁面佈局進行區分，以及更有助於使用者快速理解內容。
動態型別文字能使大號文字可以在文字允許長度未知的情況下顯示在其範圍之內。動態型別下文字的大小會根據可用空間和字型大小來選擇排版模式。
換行
下圖展示了換行的最佳案例：
字間距
行的長度
Baymard的研究給了我們一些有關行的長度和文字可讀性方面的建議：
“如果你想擁有良好的閱讀體驗，建議每行大約60個字元。每一行的適量字元數是保證文字可讀性的關鍵因素。”
“太長——如果一行文字太長，使用者的注意力會很難集中在文字閱讀上。這是因為文字過長導致使用者很難看清楚一句話的開頭和結束在哪裡。”
“太短——如果一行文字太短，眼睛需要經常來回觀看（換行），這樣會打破讀者的閱讀節奏。文字太短的話也會讓人產生壓力，會使他們還沒讀完當前行的文字就去讀下一行的文字（因此會有潛在跳過重要詞句的問題）”
來源: “Readability: the Optimal Line Length,”
baymard.com/blog/line-l…
語言類別參考
為了便於國際化，Google已將語言分為三個類別：英文和類似英文的、高長型的、密集型的。
英文和類似英文的：拉丁文（越南文外）、希臘文、西里爾文、希伯來文、亞美尼亞文和喬治亞文。
高長型的：此類文字需要更高的行高以適應更大的字形，這類文字包括南亞、東南亞和中東的語言，像阿拉伯文、印地文、泰盧固文、泰文、越南文。
密集型的：此類文字需要更高的行高以適應更大的字形，但與高長型的文字有著不同的標準。這類文字包括中文、日文和韓文。