網站設計的空間問題

今天新加一節，本來計劃好的，昨天寫的時候又忘了。這里的空間指的是 letter-spacing 和 line-height，也就是字間距和行間距。首先，良好的行間距是排版最重要的地方，你可能不能自由選擇字體，字號的選擇也受諸多限制，但至少行間距的選擇是可以完全由自己控制的。

所謂的 line-height，指的是兩行字基線 (base-line) 之間的距離，什么是基線?下面圖中的紅線便是，對于漢字，則應該就是底部的水平線。在印刷排版中，習慣用 pt 來指定行高，比如所謂采用 12/14pt 排版，就是字號 12pt，行高 14pt;而 Web 中似乎習慣用百分比來設置，這個見仁見智，只要自己看得順眼就行。但必須注意的是，瀏覽器默認的行高一定是不夠的，尤其對于希望瀏覽者長時間閱讀的內容，行高 - 字號至少要有 2pt 以上。更苛刻的排版學家通常推薦 3pt 以上，但畢竟 Web 上可以隨意一點。

但 letter-spacing 又是另一回事，我沒學過書法，漢字的間距不好多說，但英文字母的間距卻不應該隨便調整，尤其不宜統一調整。因為實際上，Type1、TrueType、OpenType 這些字體格式中都包含了一個叫做 kerning table 的東西，也就是字母間距的微調。為什么要做這種微調?兩個簡單的例子是 AV 和 We，如果不做微調，A和V之間的距離就會過寬，e也不會像我們平常書寫的那樣和W契合得那么自然，下圖顯示了 Adobe Reader 中，使用 sabon Next 字體時的 kerning 效果：

大部分的 User Agent，當然也包括你的瀏覽器，都會根據字體的 kerning table 自動做這個微調工作，但倘若你使用 CSS 來修改 letter-spacing，這個工作就白費工夫了。所以我才建議不要隨便調整 letter-spacing。比如 WordPress 原來的 Classi c Theme (Dave Shea 設計，Matt 修改)，就犯了這個毛病。