前言

要聊“苹果系统字体变迁史”，本应从苹果推出的第一台计算机说起，但由于年代久远，这一方面的资料也鲜有记录，所以本文会将时间向后推移，从苹果历史上的第一台图形用户界面计算机聊起。

一、没有名份的“System”与“Icon Name”

1983年1月19日，苹果发布了其历史上第一台图形用户界面计算机 Apple Lisa，这台计算机是以乔布斯女儿的名字命名的，搭载了 Lisa Office System 操作系统。由于技术限制，这一时期的计算机字体都是“位图字体”，位图字体是由一个个像素点组合而成，在小字号下字形容易受到限制。所以这个时期的 Apple Lisa 在界面显示上用到了两种字体，一种用于系统菜单、窗口标题、对话框等场景，一种用于应用程序的图标名称。这两种字体在 Apple Lisa 中并没有正式名称，开发人员只是以使用场景进行了简单的命名，分别称为“System”与“Icon Name”。

“System”字重较粗，系统只包含了 12 Point 字号。这款字体给到用户最深刻的印象就是 W 和 V 的设计，一般字体 W 和 V 的两侧笔画都是倾斜的，但 System 却打破了常规，左侧笔画完全成垂直，右侧笔画则使用了更大的斜度。这款字体后期释出了 True Type 版本，也有了正式名称，被称为“Twiggy”。设计上保留了原始位图版本的像素感，独特的复古风格很容易让人想起早期计算机时代。

“Icon Name”系统只提供了 9 Point 字号。不同时期小写字母的字形有较大差异，如 Lisa OS 1.0、2.0 时期小写字母“i”“j”“l”是带有衬线的，而到了3.0时期却拿掉了衬线。再如1.0、2.0 时期的小写字母“p”“b”笔画更加几何化，而到了3.0时期却更具书法特征，左右笔画连接处各增加了一处缺口，还原了常规“p”“b”的字形特征，类似的还有小写字母“m”“n”等。

二、早期经典 Chicago 和 Geneva

Apple Lisa 面世的第二年，乔布斯发布了苹果早期历史上最重要的计算机 Macintosh，搭载了 System 1 操作系统。同 Apple Lisa 一样用户界面使用了两种字体，分别是用于系统菜单、窗口标题、对话框等场景的 Chicago 和用于图标名称的 Geneva。

Chicago 是第一款为 Macintosh 开发的字体，具有较粗的字重，系统只包含了 12 Point 字号。整体字形采用横平竖直的结构，减少了倾斜笔画的使用，如大写字母“A”“W”“X”倾斜的笔画完全被设计成垂直的。以今天的眼光来看，Chicago 并不算一款易读性高的字体，但早期系统字体除了传递信息外，还承担着品牌塑造的作用，所以在这种语境下 Chicago 是适用的。后来这款字体还被用在 iPod 的用户界面上，不过这都是2000年后的事情了，当时还引起了不少  Macintosh 用户的缅怀。

Geneva 的设计灵感来自 Helvetica，属于新异风无衬线体。当时系统提供了四种字号，9 Point、12 Point、18 Point 和 24 Point，9 Point 应用于图标名称。Geneva 与 Apple Lisa 的 Icon Name 一样，小写字母“i”“j”“l”等带有衬线。字母“y”则同Chicago一样采用了垂直的笔画设计，大写字母“M”的中心顶点偏高，数字“3”的顶部是水平的。

以上两款字体均来自于设计师 Susan Kare，她是第一代 GUI 设计师，被大家称为“图标之母”。早期参与了大部分 Macintosh 图标与字体设计的工作，除了上述两款字体，她还设计了 System 1 的其它内置字体，如类似于 Times Roman 的衬线字体New York，供开发环境使用的等宽字体 Monaco，模拟剪贴风格的字体 San Francisco 等等。而苹果以世界著名城市命名字体的传统也是这一时期她与乔布斯确定的。

时间来到80年代末，这一时期苹果开始了轮廓字体技术的研发，也就是后面大家知道的“Truetype”，并且计划将此项技术集成在 System 7.0 当中。有了轮廓字体技术，还必须拥有对应的轮廓字体，于是1988年字体工作室 Bigelow & Holmes 接到苹果委托，希望他们可以为 Mac 系统设计新的 Truetype 版本字体。这个项目一共需要设计4种字体，除了界面使用的 Chicago 和 Geneva，还有系统内置的 New York 和 Monaco。因为后面两款字体并不在本文探讨范围之内，所以以下只对 Truetype 版 Chicago、Geneva 进行介绍。

至80年代末位图版 Chicago 已在 Mac 系统上运行多年，给用户留下了深刻的印象，这款字体也早已成为系统的重要标志，所以设计之初苹果提出的诉求是希望可以尽量还原位图版 Chicago 的字形，太大的字形变化可能会导致 Mac 系统外观发生改变。位图版字体无法使用曲线，只有像素状锯齿，转换轮廓字体如何处理曲线是最大的难点。设计师调研之后发现早期位图字体打印时，打开“文本平滑选项”就可以得到平滑后类似圆形的效果。Truetype 版 Chicago 在设计时参考了这种特征，将笔画拐角处的曲线处理成四分之一正圆，将字怀内部的曲线处理成二分之一正圆，整个造型有种罗马石柱与拱门的感觉。除此之外还在字形上增加了一些其它细节，如小写字母“m”“n”“h”等，在竖画与拱形笔画连接处增加了一处缺口，这个缺口可以帮助用户更好的区分“n”和“o”的顶部造形，提升字体的识别性。

上文说到 Geneva 是一款新异风无衬线体，Truetype 版在设计上也遵循了这一风格特征。字符宽度略微收窄，笔画粗细更加统一，大写字母更加几何化。除此之外， Truetype 版 Geneva 也有一些自身特征，如字怀开口对比一般新异风体会更加开放，字母“m”“n”“h”的笔画连接处有更深的切口，这些都使它具有更好的易读性。还有重要的一点 Truetype 版本拿掉了小写字母“i”“j”“l”的衬线，小写字母“y”也变成了倾斜的笔画。作为系统字体 Geneva 的使用时间久于 Chicago，大约16年左右，在这期间备受用户好评，这款字体至今依旧内置在 Mac OS 系统中。

三、曾经的备胎 Espy Sans

Espy Sans 最初是作为 Apple Newton 的系统字体开发的，期间也被用于苹果的在线服务eWorld。之所以说 Espy Sans 是备胎，是因为苹果也有考虑将 Espy Sans 作为 Mac OS 的系统字体，用来代替 Chicago，并且在后续的版本 System 7.5 中内置了这款字体。时间来到1997年，苹果发布了新版系统 Mac OS 8.0，但新系统字体却并不是 Espy Sans。为此网络上还出现了一份请愿书吸引了将近2,500名支持者，希望可以扭转苹果的决定，但苹果明确表示不会在 Mac os 8.0 中使用 Espy Sans。

Espy Sans 拥有两种字重 Regular 和 Bold，当时 Newton OS 提供了5种字号，9、10、12、14和16 Point，9 Point 用于图标名称，10 Point 用于标题。这款字体属于人文主义无衬线体，笔画具有书法特征和更加开发的字怀，具有较高的易读性。

四、短暂服役的 Charcoal

刚刚提到苹果在 Mac OS 8中使用了新的系统字体，这款字体便是 Charcoal。Charcoal 同样是一款人文主义无衬线体，由设计师 David Berlow 在1994-1997年设计。设计之初苹果希望 Charcoal 可以保留 Chicago 的某些特征，但是 David Berlow 在进行数次尝试后发现了诸多限制，于是向苹果建议摒弃 Chicago 的字形特征，苹果同意后开始了全新的字形设计。由于是替换 Chicago 作为系统字体，Charcoal 设计上依旧保留了较粗的字重，且拥有一般人文主义无衬线体的基本特征。不同的笔画粗细，开放的字怀，字母降部处理的更短，多文本显示时可以预留更多行间距，提升文本易读性。另外重要的一点是 Charcoal 首先在 MacOS 上实现了字偶剧，在特定字母间可以使用更小的间距，使整个界面的字体排印更加协调一致。

Charcoal 无疑是一款优秀的字体，它拥有极佳的易读性，也为MacOS 赋予了新的视觉特征。奈何这一时期 macOS 正处于低估，市场份额被其他操作系统不断蚕食，乔布斯回归苹果后开始了新的系统研发。新系统采用了全新的视觉设计，也更换了新的系统字体，而 Charcoal 仅仅使用了 MacOS 8、9两个版本，也被称为苹果历史上服役最短的系统字体。

五、为屏幕而生的 Lucida Grande

乔布斯回归苹果后开始了新系统的研发，并于2000年发布了 Mac OS X 开发者预览版3，这一版本系统采用了全新的视觉设计，系统字体也由 Charcoal 改为了 Lucida Grande。这款字体来自一个巨大的字体家族 Lucida，它拥有衬线体、无衬线体、哥特体等数十种变体，是专门为屏幕显示而设计的，在早期大颗粒像素屏上有着极高的易读性。而它同样出自设计 Truetype 版 Chicago 和 Geneva 的字体工作室 Bigelow & Holmes。

Lucida Grande 是变体 Lucida Sans 的修改版本，是为专门 MacOS 定制的 。这款字体共有四种字重 Light、Regular、Bold 和 Black，而 MacOS 中只发布了 Regular 和 Bold。刚提到 Lucida 整个家族是专门为屏幕显示设计的，那 Lucida Grande 在设计中都有哪些优化呢？

1、X字高的设定：在字体设计中有这样一种理念，认为X字高定义的区域提供了小写字母主要的笔画特征，增加这一区域高度可以有助于区分字母形状，以便更好的识别。所以 Lucida Grande 在设计中增加了 X 字高，大约占到整个字体大小的53%。

2、开放的字怀：早期大颗粒显示屏在渲染字体时，尤其是小字号会出现像素溢出的问题，这时候对于字怀开口较小的字体会产生笔画黏连，导致部分字母识别不清。如字母“C”与字母“O”，字母“S”与数字“8”，为了解决这些问题 Lucida Grande 在设计时采用了更加开放的字怀。

3、宽松的字母间距：同样的像素溢出问题，在多文本显示下字母更容易黏连在一起，为了提升易读性，此时需要更加宽松的字母间距，Lucida Grande 在设计时考虑到了这一点，提供了大于多数现代字体的默认字母间距。

4、其他细节处理：除了以上主要特征外，Lucida Grande 还有一些其它细节上的处理。如加深了小写字母“m”“n”“h”等笔画连接处的切口，使用了更加易读的单宫“g”，而非人文主义体的双宫“g”，增高了大写字母的上行线，以更好的区分大写字母“I”和小写字母“l”等等。

Lucida Grande 从 Mac OS X 开发者预览版3到 OS X Mavericks 一共服役了16年，在这期间受到了用户的大量好评，最为大家津津乐道的就是其易读性。

六、传奇字体 Helvetica

时间来到2007年，这一年的6月29日，苹果发布了第一代智能手机 iPhone，搭载了 iPhone OS 1 操作系统，这一时期 iOS 开始使用 Helvetica 作为系统字体。

Helvetica 是一款新异风无衬线体，由字体设计师 Max Miedinger 和当时铸字厂主管 Eduard Hoffmann 共同完成。20世纪50年代 Eduard Hoffmann 在瑞士哈斯铸字厂工作，这一时期哈斯的字体销量开始下滑，Eduard Hoffmann 委托字体设计师 Max Miedinger 希望可以设计一款新的无衬线字体可以和市场上流行的 Akzidenz Grotesk 进行竞争。1957年他们完成了字体的设计工作，并取名“Neue Haas Grotesk”（拉丁文“哈斯的新无衬线体”）。后来哈斯铸字厂的母公司 Stempel 为了国际市场考虑，希望将字体名称改为“Helvetia”（拉丁文“瑞士”），不过 Eduard Hoffmann 认为用一个国家的名称去称呼一款字体是不合适的，最终改名为“Helvetica”（拉丁文“瑞士的”）。Helvetica 推出之后便迅速席卷欧美市场，它简约、理性的气质深受设计师们的青睐，随后一段时间不管是品牌杂志、广告路牌、甚至大街小巷都可以看到它的存在。随着这款字体的大量使用，大家对他的评价也开始出现两极分化。喜欢它的人认为 Helvetica 充满理性、注重功能，代表了现代字体设计。不喜欢它的人认为 Helvetica 过于呆板，没有任何情感色彩，在小字号下表现不佳。德国字体设计师 Erik Spiekermann 就曾在纪录片《传奇字体 Helvetica》中表达过对这款字体的不满，他认为字体设计的最终目的是表现字体的个性化，而 Helvetica 的设计理念不鼓励任何个人主义，这使字体看起来像是机械的军队。虽然他不太认可 Helvetica 的设计理念，但有意思的是，他曾经担任了 Helvetica 升级版本 Neue Helvetica 的设计顾问。

Helvetica 诞生的年代是瑞士风格开始盛行的时期，字形上自然也继承了这一风格特征，整体来看造型简约、理性、没有过多装饰。如果我们将 Helvetica 同异风体的代表字体 Akzidenz Grotesk 进行对比的话，可以发现 Helvetica 几乎摒弃了书写痕迹，更加几何化，笔画粗细趋于统一，字怀开口完全水平，如字母“c”“e”等。

再聊回苹果，这一时期 Mac 使用 Lucida Grande 作为系统字体，为什么 iPhone 却选择了 Helvetica？要回答这个问题可以从三个方面思考一下：

1、市场定位：第一代 iPhone 发布之初就定位于国际市场，而 Helvetica 流行的历史背景就是国际贸易增多，所以它是整个国际市场最知名的字体之一，那么 iPhone 为了市场选择一款大家都熟悉的字体也是无可厚非的。

2、系统设计理念： iPhone 是定位于国际市场的产品，操作系统为了贴合不同地区用户，它的设计必须是中性且克制的，这样的设计理念其实和 Helvetica 的部分理念是契合的，Helvetica 充满理性、没有过多的情感色彩，自然不易引起用户抗拒，可以更好的贴合用户。

3、大字号的使用：如果对比过 MacOS 和 iOS 的字体规范，可以发现同等使用场景下 iOS 字号通常大于 MacOS 几个量级。这是因为触控操作需要更大的点击范围，具体到界面设计中就必须使用更大的字号。虽然上文说到 Helvetica 小字号下表现欠佳，但奈何 iOS 开始使用更大的字号，这在一定程度上对 Helvetica 的使用创造了条件。

七、迈向统一 Helvetica Neue

2010年6月7日苹果发布了 iPhone 4，同年7月21日又发布了 iOS 4，从这一版本开始系统名称正式从 iPhone OS 改为 iOS，系统字体也从 Helvetica 升级为 Helvetica Neue。

Helvetica Neue 对比 Helvetica 主要做了以下优化：

1、增强易读性：Helvetica Neue 增加了文本默认行高，在多文本显示下不会过于拥挤，更加清晰易读。并加宽了部分字母宽度，以增强字母的辨识度，如大写字母“M”，小写字母“t”“f”等。

2、改善字形：在 Helvetica 中随着字重增加，X 字高和大写字母高度都有明显的变化，Helvetica Neue 中优化了这点，不同字重下 X 字高和大写字母保持了相同的高度，确保了整体字形的一致。

3、提升易用性：通过对比基础家族可以发现 Helvetica Neue 增加了很多字重，加上其他变体共有59种样式，而 Helvetica 只有36种。新增的样式可以满足更多使用场景，为字体排印提供更多视觉效果。

既然 Helvetica Neue 在各方面都做了很多优化，这款字体又是1983年发布的，那为什么直到此时苹果才想起使用它？我们可以将目光投向新发布的产品 iPhone 4，这代产品的一大更新便是采用了 Retina 屏幕，它的显示精度是过往屏幕的4倍。精细的显示效果是可以提供更高质量的字体排印的，如在早期大颗粒像素屏幕中使用较细的字重，最终的渲染效果可能虚到无法直视，但高精度显示屏幕可以有效回避这类问题。为了得到更高质量的字体排印，Helvetica 替换为更加优秀的 Helvetica Neue 只能说是一件水到渠成的事。而在随后的几年中，Retina 屏幕也成为苹果产品的主流，2012年苹果发布了配备 Retina 屏幕的 iPad 和 Macbook Pro，2014年又发布了配备 Retina 屏幕的 iMac。

我们再来看看 MacOS 的情况，2014年6月苹果发布了 OS X Yosemite，这一版本系统字体由 Lucida Grande 改为了 Helvetica Neue。当然 Retina 屏幕的使用为这一切提供了条件，但更为重要的原因是从这一版本起 MacOS 和 iOS 开始了“系统连接”。用户可以直接在 Mac 上收发短信和接听电话，也可以通过 AirDrop 和 iPhone 互传资料。为了保持用户切换设备时体验的一致性，Yosemite 使用了大量 iOS7 的设计语言，图标趋于扁平，视觉更加一致，系统字体也替换为 Helvetica Neue，从这一时期起苹果的系统字体开始迈向统一。

八、集大成者 San Francisco

San Francisco 初次和大家见面是在2014年的 Apple Watch 发布会上，虽然发布会并未提及任何有关系统字体的事情，但细心的用户透过现场幻灯片发现 Apple Watch 的界面貌似使用了新的字体，此事还引起了设计师和字体爱好者的强烈讨论，纷纷猜测这是什么字体？直到同年11月18日苹果发布了 Watchkit 的开发工具包，大家才在包里发现了命名为“San Francisco” 的系统字体。

次年 WWDC，苹果字体设计师 Antonio Cavedoni 正式跟大家介绍了这款字体，不过 San Francisco 并不是新字体的名称，而是整个字体家族的名称。该家族下还有两个字家族 SF 和 SF Compact，SF 用于 iOS、MacOS 等，SF Compact 用于 Watch OS。SF 字形两侧偏向圆润，SF Compact 则更加垂直，字母之间也有更大空间，在狭小的屏幕上拥有更高的易读性。

两种字家族各自还有两种不同的视觉字号 Dispaly 和 Text，主要在字形和字母间距上有所差异。Display 的字怀开口偏小，拥有更加紧密的字母间距，主要用于标题。Text 字怀开口偏大，字母间距稍显宽松，适合多文本展示，主要用于正文。两种视觉字号以 20 Point 为界，大于等于 20 Point 使用 Display，小于 20 Point 使用 Text。在具体开发中，工程师无需选择对应的视觉字号，苹果提供了完善的 API，只需要输入字号，系统会自动匹配对应的视觉字号。

时间来到2017年，苹果在 iOS 11 和 MacOS High Sierra 中推出了 SF Pro，它是 SF 的升级版。主要对 Display 的字形进行了调整，X 字高和小写字母的高度都有所降低，而且新增了近 1000 种字形，支持更多语言。

2020年苹果又推出了 SF Pro 和 SF Compact 的可变字体版本，通过调节轴可以实现字重、视觉字号的无极调整。因为可变字体可以将所有字形轮廓打包到一个字体文件中，所以设计在使用字体时不需要在选择对应的视觉字号了，输入需要的字号，可变字体会自动匹配对应的视觉字号。

还有重要的一点，在之前的 SF 版本中 Display 和 Text 直接使用了两种固定的字母间距，那么从19 Point 到 20 Point 是完全没有过渡的。而在可变字体版本中设计师将17-28 Point 设定为一个过渡区域，随着字号变大，字母间距会逐渐缩小，有了均匀的过渡会得到更加协调的排版效果。

2022年苹果继续强化可变字体的功能，新增了3种字宽样式 Condensed、Compressed 和 Expanded，不同样式搭配不同变体可以产生丰富的排版效果，为设计师提供了更多字体排印的可能性。

历经多年发展 San Francisco 俨然已成为一个巨大的家族，除了上述提到的字家族外，还衍生了一些其他变体。

SF Pro Rounded：2019年发布，SF Pro Display 的圆角化版本，在 iOS 健康和健身App 中被用于数据展示。

SF Compact Rounded：SF Compact Display 的圆角化版本，WatchOS 的部分界面字体，在 MacOS Sierra 和 iOS 10 中也被用作联系人头像占位符。

SF Mono：2016年 WWDC 推出的一款等宽字体，主要用于终端、 控制台和 Xcode 的操作界面。

SF Hello：2016年推出，仅限于苹果内部及获得许可的承包商、供应商使用。

SF Cash：苹果钱包 App 中的字体， 这个字体系列有3样式：SF Cash Chiseled，SF Cash Plain 和 SF Cash Text Condensed Semibold。 

SF Camera：2019年推出，专为 iOS 的相机 App 定制的修改版字体。

SF Shields：首次出现在 iOS 12.1 中，被应用于地图 App 中某些国家的道路编号。

SF Arabic：阿拉伯文系统字体，2021年发布在苹果开发者网站。

SF Armenian：艾美尼亚文系统字体。

SF Georgian：格鲁吉亚文系统字体。

SF Hebrew：希伯来文系统字体。

San Francisco 除了用于系统字体外，在印刷和品牌方面也有不错的表现。2016年苹果开始将 San Francisco 用作品牌字体，不同产品的 Logo Type 都可以看到它的身影。同时它也被用于各种物料印刷，如苹果键盘上的字体，数据线上的字体等。2017年苹果官网也完成了大部分字体替换，从此 San Francisco 成为苹果的官方通用字体。较之以前的系统字体，它有着众多优势，足以称之为集大成者，另外苹果对这款字体的功能还在不断强化，后续的更新我们依然可以再次期待。

参考文献：

Typography of Apple Inc：https://en.wikipedia.org/wiki/Typography_of_Apple_Inc.

Lisa Font Charts：https://www.applefritter.com/content/lisa-font-charts

Lisa Type Styles：https://www.applefritter.com/content/lisa-type-styles

Chicago：https://en.wikipedia.org/wiki/Chicago_(typeface)

Geneva: https://en.wikipedia.org/wiki/Geneva_(typeface)

Notes on Apple 4 Fonts: http://cajun.cs.nott.ac.uk/compsci/epo/papers/volume4/issue3/ep050cb.pdf

Susan Kare: https://en.wikipedia.org/wiki/Susan_Kare

Espy Sans: https://en.wikipedia.org/wiki/Espy_Sans

Charcoal: https://en.wikipedia.org/wiki/Charcoal_(typeface)

Font Bureau: https://typenetwork.com/type-foundries/font-bureau

Lucida Family: https://en.wikipedia.org/wiki/Lucida

What's the Difference between Lucida Grande and Helvetica Neue?: https://bigelowandholmes.typepad.com/bigelow-holmes/2014/11/whats-the-difference-between-lucida-grande-and-helvetica-neue.html

Helvetica: https://en.wikipedia.org/wiki/Helvetica

Helvetica Movie: https://www.bilibili.com/video/BV1nJ411E7QU/

Helvetica vs. Neue Helvetica: The Same but Different: https://creativepro.com/helvetica-vs-neue-helvetica-same-but-different/

Retina display: https://en.wikipedia.org/wiki/Retina_display

Apple Font: https://developer.apple.com/fonts/

WWDC Introducing San Francisco, the New System Fonts: https://www.youtube.com/watch?v=OpveNRh-jXU&t=187s

The details of UI typography: https://developer.apple.com/videos/play/wwdc2020/10175/

Meet the expanded San Francisco font family: https://developer.apple.com/videos/play/wwdc2022/110381

Powered by Froala Editor