文字设计和视觉文化

目录归档: 细节

字距危机

好的。信贷危机(Credit Crunch)如火如荼的本周,爱字体的人(OK,我是学经济的)仍然可以给自己找乐子。实在忍不住全文翻译下 Noisy Decent Graphics 这篇文章。

作者/ Author: Ben Terrett © 2008

原载于/ Original from: Noisy Decent Graphics,2008年9月18日;
图片/ Images: Noisy Decent Graphics
翻译/ Translation: 经作者授权,由 Rex Chen 翻译

现在大概无人不知银行界产生的危机了,所有家喻户晓的大银行都受到牵连。危机正逐渐吞噬我们并且一天一天逼近我们的家园。尽管很长一段时间以来,我都尽量避免这个话题,但我现在实在不能再等了。

女士们先生们请让我介绍——字距危机(Kerning Crunch)。

让我们先看看雷曼兄弟(Lehman Brothers)。字体设计大气、强壮、信心十足。仿佛在船头直挺挺地站着,紧盯着对手们的脸:伙计放心,这儿没问题!

但离近一点看,尤其是字母「A」。

这能接受吗?靠近一点寻求安慰?有关部门是不是该过来查一查有没问题?

「O」和「T」倒是收敛一点,但我觉得还是有点太亲近了。字距危机的问题在于它让我们对自己的价值观产生质疑。我们是不是乘风破浪的时候离风太近的太久了?我们到底还要多亲近?

劳埃德(Lloyds)大概是这些倒霉蛋里面比较好的。他们成功解救了「O」、「Y」和「D」,但他们还是救不了所有人。

犯规最明显的已经被主流媒体忽视了,但我们不怕,有尊严的 blog 就是做这种事的。所以我们靠近点看看巴克莱(Barclays)的「L」和「A」吧。

前面都是艰难险阻,朋友们。

这些银行中的一些的名字本身就是自己最大的敌人,调好「L」、「A」、「Y」和「S」的字距从来都不是什么容易的事。但这些人还真是喜欢冒风险,是不是?

Basics:拼写与翻译、字体使用及其他

仍然继续一些「基础系列」的指引。不知道是不是知道一些 Typography 的人都有或多或少的强迫症,日常看到一些 Typo 错误就会抓狂,于是生活痛苦不堪。在回国一段日子之后,强迫症终于迫使我写下这个注意事项的系列文章。这个指引针对西方文字的排版,部分规则对中文排版有借鉴作用。

注:本文原文为十条,写下后发现漏洞较多,激烈争论后决定将后七条比较复杂的分开详细写,以不致草率和业余。

1. 避免错误的拼写和翻译

这一点无需多说,可笑的例子太多太多。最近极端的例子是一间叫「翻译服务器错误」(Translation Server Error)的中国餐馆。想说 Chinglish 是一个新文化的另当别论,但对于严肃的英文使用场合,翻译的错误是致命的。

另一个是拼写问题,比如左图消失的空格,或者无数名片上的 「Http:www.xxx.com」,以及莫名奇妙的忽然大写和小写,都是英文排版里的硬伤,不但影响阅读,而且影响理解。对于名字的翻译,中国的标准应该是:Beijing、Hu Jintao、David Zhang 和 Heping Road,而不是 Bei Jing、Jin Tao Hu、David zhang 和 HE PING Road。因此要避免翻译和拼写错误,唯一的建议是在使用英文前请尽量请专业人士校对,至少绝对避免用软件直接翻译。

2. 避免挤压或拉长字体

Image: Life in [email protected],左:Helvetica Neue Condensed Bold;右:Helvetica Neue Bold Extended

很多情况下英文由于配合空间的需要,被任意的挤压或拉伸,这都是非常不可取的。事实上,很多常用的英文字体大多已经精心设计了不同宽度的字型,比如较窄的 Condensed 系,和较宽的 Extended 系。这些特定的系列都是设计师最大化地保留了字体的特色,以及对于可读性、识别性等等上进行了优化所生成的,比设计软件机械地缩短拉伸的结果要理想得多。这一点对于中文字体也同样适用。

3. 避免 Windows 系统自带的中文字体的英文部

具体参见之前的文章

中国公共用字:广州地铁

如果说在中国大陆公共设计中想看到一些比较好的英文设计,鉴于政府根本没有设计的概念,就只能在半商业的环境如地铁和机场这样的现代化交通设施寻找了。即使在这样的地方,英文设计的杂乱和低质量也是不堪入目的。本简评系列旨在搜寻一些大城市包含英文的公共设计,当代中国设计对细节的追求也可见一斑。(要说明的是,由于说的是中国的英文设计,免不了各种各样的翻译笑话,这个各位权当乐子,我们不做评论)

今天看广州地铁的用字。

Images: Flickr

Helvetica、Times New Roman 和宋体英文混用,很难说出标准字是哪一种(注意在这三个例子中,中文字体亦不同)。在广州地铁自豪的电子显示系统上,英文字尺寸不一,松紧不规律,可读性差,视觉上十分混乱。

Images: Flickr

左下为广州地铁的标准 logo,其中英文字体在其视觉系统里都罕见使用。上图同样的设计,左边的设计进行了简化,可笑的是地铁的 logo 被简化为「V」。虽然这三个例子中都用了无衬线,但无论从字体、字距、尺寸和与中文搭配都做的相当差。

Images: Flickr

以上是东京地铁类似用途的设计,设计的美观度、可用性和一致性显然更胜一筹。

FontExplorer X for PC Beta1 版提供下载

这个新闻有 N 个属性,首先是个好消息,然后是个老消息(迟了4个月,消息来自 Allen.Blog),最后我希望是最后一个关注 PC 的文章,希望尽快转到 Mac 平台。anyway..

在 Windows 上迟迟没有没找到优秀的字体管理软件,因此一直在被迫用 Adobe Type Manager。版本老的不行,功能也很差,只能用来安装和分类,预览很麻烦。不知道 Adobe 为什么停掉了 ATM 的研发。而好消息是,由字体商 LinoType 开发的著名的字体管理软件 FontExplorer X 已经提供了 PC 版的下载,网页中还列明了一系列可能出现的问题。尽管该版本在3月份就已经发布了 Beta1版,但至今没有更新的版本。软件使用了仿 Mac 的界面,提供现在购买。具体大家使用看看了,我试用了一下感觉很棒。

Web Typography Sucks 演讲

三月份的SXSW2007的一个演讲「Web Typography Sucks」,讲了在Web上的字体排印的现状和一些解决方法。

我基于有注解的演讲演示稿PDF,加入了中文的注释。在简体中文系统下Adobe Reader 8下没有问题,不知道会不会因为系统语言的差异而出现乱码。
点击这里下载(大小:4.11M)

这个演示稿主要讲了一些很基本的东西,比如标点符号、网格、排版和字体。Web 网格的部分以 HTML 和 CSS 做到了如印刷品般的严格对齐,很有意思。

演讲人的网站 The Elements of Typographic Style Applied to the Web 很有用,他们计划将 Robert Bringhurst 著名的《The Elements of Typographic Style》一书关于字体排印的指导应用于网络环境,已经发布了一部分内容,旨在指导web设计者使用代码达到严格的字体排印的要求,这个计划正在进行中。

Typography 常见的错误(一)

标点符号

  • 连字号/Hyphens (-):用以连接、分开单词
  • 短破折号/En dashes (–):用来表示「到」,从……到……
  • 长破折号/Em dashes (—):类似中文的破折号,分隔短语和内容
  • Prime (′ 和 ″):用来分隔时间、尺寸,比如3′ 5″,以及一些数学用途,不是引号。
  • 撇号/Apostrophes (’):用来表示从单词中省略一个或几个字母、所有格形式及数字、字母、缩写的复数形式
  • 省略号/True ellipsis (…):不要使用三个句点(选择文本就可以看到…和. . .的不同)
  • 版权符号/Copyright symbol (©)
  • 注册商标/Registration symbol (®):已注册商标
  • 商标/Trademark (™):商标,但可能未注册

有些时候电脑会自动转换,比如将三个句点转换成省略号,只是要注意。

待补充。