中英文网站的差异化

英文网站与中文网站的差异绝非仅仅在于语言的不同。由于中文字形较为复杂,且电脑上的中文字体设计相对滞后,这使得中文网页的设计难度远高于英文网页。若忽视中文字体的独特性,盲目照搬英文网页的设计方法,常常会降低中文网页的易读性。以下列举三个因照搬英文网页设计方法而引发的中文网页易读性问题。

一、相对大小的字号

在英文页面中,固定字号被称作 “frozen font sizes”,使用固定字号是明显的错误,众多交互设计专家对此已有深入研究。相对字号在英文网页中被广泛认为是正确的做法,于是中文网页的文字也被设计成相对字号。这种情况主要出现在英文网站的中文版设计中。然而,对于中文而言,相对字号的效果并不如预期。

许多字号下的中文无法清晰显示。例如,10px 的 Arial 字体显示英文清晰,但 10px 的宋体中文却变成一个黑疙瘩;20px 的英文大而清晰,而 20px 的中文则会出现明显锯齿,笔画粗细不均。在《文字,你到底能多大?》一文中曾对中文字号进行过探讨,12px、14px、16px(或 18px)显示中文较为理想。实际上,12px - 16px 大小的宋体显示效果都很不错。

相对字号允许文字以多种实际字号(以像素为单位)显示,通过调整浏览器设置,文字大小可缩放。下面看看相对字号显示的中文模样:

相对字号分为:-7、-6、-5、-4、-3、-2、-1、标准大小、+1、+2、+3、+4、+5、+6、+7,共 15 种。其中 “-2” 以下字号与 “-2” 一样小,“+4” 以上字号与 “+4” 一样大,实际只剩下 -2、-1、标准大小、+1、+2、+3、+4 这 7 种相对字号。我们逐一试验每个相对字号的显示效果。

以 IE 浏览器为例,若页面文字设置为相对字号,可进行五种不同大小的缩放:“最小、较小、中、较大、最大”。下表为不同相对字号在 IE 浏览器不同设置下所显示的实际字号(以像素为单位)。

从表中可以看出,没有一种相对字号能始终落在 12px - 16px 区间内。也就是说,若将 IE 浏览器的 “文字大小” 选项从 “最小” 逐步调整为 “最大”,无论相对字号如何设置,都无法始终保持理想显示效果。同时,表中也显示,设置为 “-2、-1、标准大小、+1、+2” 的文字,在调整浏览器 “文字大小” 过程中,有时显示的字号会落入 12px - 16px 区间。在一个页面中,往往需要不同大小的字号来区分不同内容,那么中国设计师的选择并不多。

采用相对字号的设计方式虽将自主权交给了用户,但在中文网页中却达不到英文网页的效果。实际上,中文用户并未获得像英文用户那样大的自主权,中文用户在浏览器中选择 “文字大小” 时,不仅要考虑哪种大小适合阅读,还需关注所选字号的显示效果。

一些英文网站的中文版按照英文原版的相对字号进行设计,会产生糟糕的效果:用户无论如何调整浏览器的 “文字大小” 选项,都无法使网页上的所有文字清晰显示(即在 12px - 16px 区间内显示)。


二、斜体字

斜体字在英文中是常用的表现方式,对于英语用户来说,“斜体” 和 “加粗” 的使用频率几乎相同。从微软的 office 系列软件设计可以看出,“加粗” 功能 “B” 按钮和 “斜体” 功能 “I” 按钮都放置在易于点击的位置。然而,中文自古以来就没有斜体的概念。或许是近代革命家的行书、草书给我们留下了深刻印象,使得我们轻易接受了斜体的表现方式。

对于打印文稿,斜体中文问题不大,因为打印是以较高分辨率显示。但在显示器上则不同,显示器的显示分辨率为 72 像素 / 英寸。这种差异几乎每个使用过 word 软件的人都有体会,在显示器上阅读文档中的斜体非常吃力,而打印出来则好多了。

网页浏览主要以显示器为主,因此斜体中文是一种糟糕的表现方式。但这种糟糕的方式却在照搬英文网站的过程中被不假思索地采用。

博客的 BSP 是这一做法的先锋,几乎所有中文博客在撰写新文章的工具栏中都有 “斜体” 功能按钮。增加一个功能会增加用户学习界面的难度;增加一个无用功能会降低用户的使用效率;增加一个糟糕的功能会误导用户编辑出糟糕的文章。“斜体” 就是一个很糟糕的功能。

在英文博客中,trackback 地址往往使用斜体,这是一个约定俗成的表现方式,于是中文博客也照搬了这种方式。糟糕的表现与糟糕的功能相互配套,目前大多数中文博客提供的服务中 traceback 功能都无法使用,开发者恐怕是这样考虑的:反正用户也看不清文章最下面那一行字写的是什么,自然也不会需要使用这个功能。

我们可以品尝西餐,但没必要像西方人那样饭前祈祷。学习的目标是青出于蓝,而不是东施效颦。

三、过小的字号

过小的文字常常出现在英文网站的中文版上。如前所述,英文字体在 10px 大小就能清晰显示,在设计中文版时,只是机械地照搬英文版设计,将文字翻译成中文后仍使用 10px 的样式。


标签 : 网站知识