pt, px, DPI: 关于长度单位的误解

在印刷排版中,“point”是一个绝对的单位,它等于 1/72 英寸,可以用尺子丈量的,物理的英寸。但在 CSS 中 pt 的含义却非如此,例如我们指定一个字体是 9pt,我们会以为按照 CSS 规范,它等于:

9 * 1/72 = 1/8 inch

这是一个误解,因为我们的显示器被分割为了一个个的像素,单个像素只能有一种颜色 (为了简化,这里暂不讨论次像素反锯齿技术),要在屏幕上显示,必须先把以 pt 为单位的长度转换为以像素为单位的长度,这个转换的媒介,就是 DPI (事实上,这里的所谓的 DPI,是操作系统和浏览器中使用的术语,即为 PPI, pixels per inch,和扫描仪、打印机、数码相机中的 DPI 是不同的概念)。

例如,无论在哪个操作系统中,Firefox 浏览器默认的 DPI 都是 96,那么实际上 9pt = 9 * 1/72 * 96 = 12px。

所以,虽然“DPI”中的“I”和“1pt 等于 1/72 inch”中的“inch”,都不代表物理上的英寸,但这两个单位互相之间是相等的,也就在相乘中约掉了。

那么,真实的物理长度怎么计算呢?请拿出一把尺子,丈量你的显示器的可见宽度 (我这里是 11.2992 英寸),除以横向分辨率 (我这里是 1024 像素),得到的就是每个像素的物理长度。

现在我们可以回答这样一个问题,网页上 9pt 的字体究竟占用了多宽的空间?答案是:

9 * 1/72 * 96 * 11.2992 / 1024 = 0.1324 英寸 = 0.3363 厘米。

有兴趣的朋友可以自己查证一下。

说说 Prince

Prince 的运行

其实在 ALAPrinting a Book with CSS: Boom! 这篇文章出现的时候就想写篇文章说说这个东西了,拖到现在实在有点不好意思。

简单的说,Prince (可能这个网站在国内被封禁了) 是这么个工具,你可以在用简单的 (X)HTML 和 CSS 来描述自己的文档之后,把它转换成适合打印的 PDF。

乍看起来,Prince 是一个近乎完美的工具,优秀的 CSS 支持——它甚至已经 Pass 了 Acid 2,支持透明 PNG,能够自动探测并支持 HTML 和 XML 格式,对 CSS 3 Page Media 的创新性实现,Prince 对非营利的学术使用是免费的……等等。CSS 的创始者,Bert Bos 和 Håkon Wium Lie 已经用这种方式完成了一本书。

那是不是它就没有缺陷了呢?正相反,缺陷也同样明显——对基本的印刷排版的支持还是太少,毕竟 CSS 相比书面排版,已经是一个简化而又简化的模型了,最大的问题是缺乏自动断字 (hyphening),如果不能断字,左右对齐 (justify) 的文本中每个单词之间就会有过大的间隙,这是印刷排版中最致命的地方。(顺便说说,TeX 中最有趣的一个算法就是创新的断行算法,当时为了看这个算法专门复印了 70 来页的论文,555..)

此外还有边界出血、色彩使用等许多问题,导致 ALA 上这篇文章的评论中纷纷表示“Not the right tool”。但作者的看法也有其道理:你可以创建这样的书,在支持绝大多数浏览器阅读的情况下,还有能力转换成 PDF 供纸上阅读,不是很方便的吗?对于不愿意深入了解 LaTeX 或其他专业排版工具的 CSS 专家们来说,这也是很趁手的工具,就像大家喜欢使用 S5 这样的幻灯片制作工具而宁愿放弃 PowerPoint 这样的专门工具一样。

总结起来,Prince 是两位 CSS 创始人作的非常有趣的尝试,它在易用性上已经远远超过 DocBook – XSL-FO – FOP 这种传统的由 XML 生成 PDF 的过程,虽然现在还不能和 TeX 的效果相比,假以时日,排版的效果必会更加出色。

w3c’s presentations

W3C 的东西太学究,估计大家都不喜欢,但世上有一物名幻灯片,特点是简洁明了,大家想必都不讨厌——此物最适合一个学期没看书,临时抱佛脚的偶们。

w3c 近期的一些 presentation,多为介绍技术的趋势,宣讲一些大家平时不大注意的东西,我选了几个不太酸的,有时间不妨看看:

* Tutorial: Ruby Markup and Styling, Ruby 标记的使用教程,International 工作组刚刚提供的一个教程,这个东西和汉语的关系也比较大,加上实用性较高,可以了解一下。
* The device-independent browser: CSS and grid layout, 副标题叫做“CSS 布局的过去、现在与未来”,演讲者是 CSS 的创建者之一 Bert Bos,核心是介绍 CSS3 中的网格式布局 (grid layout) 方式。
* An Introduction to Writing Systems, 多种书写系统的异同,及其带来的问题。这个演讲比较长,不过对东亚、拉丁、阿拉伯等各种书写系统在 Web 上的呈现有比较详尽叙述,也涉及一些 Unicode 的内容,与此有兴趣的朋友可以读读。
* XHTML & XForms, 这个演讲主要是介绍下一代的 XHTML 在语义表达方面的改进。

Recent News

临近半个学期一度的考期,blog 的频率不得不降下来,好几天没上网,确实也出现了不少新的东西。

定位总是一个热门话题,近来,Tommy 的两篇文章:[Relatively Absolute](http://www.autisticcuckoo.net/archive.php?id=2004/12/07/relatively-absolute) 和 [Float Layouts](http://www.autisticcuckoo.net/archive.php?id=2004/12/10/floating) 相信能给你一点启发。

Marek 的 [CSS Workshop](http://www.sovavsiti.cz/css/),介绍关于 CSS 的有趣实践,比如纯粹用 CSS 做一个 W3C 的验证标志,给水平线 `


` 设定样式等。

Roger 的 [Quotations and citations: quoting text](http://www.456bereastreet.com/archive/200411/quotations_and_citations_quoting_text/) 是关于如何正确地在 (X)HTML 中引用别人的文本的一篇解释性文章,而他的 [The alt and title attributes](http://www.456bereastreet.com/archive/200412/the_alt_and_title_attributes/) 则是就 `alt` 和 `title` 属性的正确使用这个老话题而写的。Dave Shea 说得不错,Roger 完全可以就如何正确使用标记写本书了。

最近一期 ALA 的 [Invasion of the Body Switchers](http://www.alistapart.com/articles/bodyswitchers) 是先前流行的 Paul Sowden 版本样式表切换器的一个更新版本,更关心与亲和力方面的应用。

来自 Mozilla 方面的消息,则是 [Thunderbird](http://www.mozilla.org/products/thunderbird/releases/) 和 [Nvu](http://www.nvu.com/) 分别发布了 1.0 版本和 0.6 版本,不过似乎 nvu 还没有成为 mozilla 的 HTML 编辑器的下一代版本,或许它更愿意作为一个独立软件提供?

时间有限,不得不在这里打住。