网页历史 作者 Jay Hoffmann 文章 RSS · 音频 RSS
iTunes · Spotify · Overcast

第 8 章:CSS

Jeremy Keith 的音频版本

2006 年 6 月,来自世界各地的网页开发人员和设计师齐聚伦敦,参加第二届年度 @media 大会。第一届取得了巨大的成功,而 @media 2006 则更加令人期待。其演讲嘉宾阵容来自网页设计和浏览器社区中一些最激动人心、最有活力的声音。

Chris Wilson 在那里宣布了微软 Internet Explorer 近五年来的第一个主要版本发布。Rachel Andrew 和 Dave Shea 正在交换关于 CSS 和项目管理的实用技巧。Tantek Çelik 分享了他最近在 微格式 上的一些工作。当时 Web 标准项目负责人 Molly Holzschlag 准备了一个关于国际化的启发性演讲,并计划参加一个关于 CSS 最新发展的讨论小组。

会议于周四开始,由 CSS 的先驱和早期采用者 Eric Meyer 做主题演讲。主题演讲的标题幻灯片写着“十年风格”。在一次引人入胜且充满个人色彩的演讲中,Meyer 回顾了层叠样式表(或 CSS)至今十年的历史。Meyer 的职业生涯与 CSS 密不可分,他在舞台上利用时间回顾了这门语言的起源,并更好地理解了导致今天现状的决策和妥协。

在他的演讲核心部分,Meyer 揭示了 CSS 成功背后的秘密:“永远不要低估一小群充满激情的专家所产生的影响。” CSS 作为 Web 的开放且易于访问的设计语言,之所以蓬勃发展,不是因为技术本身,而是因为人——那些构建它(并用它构建)的人,以及他们在学习过程中分享的东西。Meyer 总结道,CSS 的历史就是创造它的人们的故事。

在这场演讲 15 年后,以及在 CSS 诞生近 30 年后,这一点仍然成立。


1994 年 10 月 20 日星期四上午,另一场会议——第二届国际万维网会议的与会者,鱼贯进入芝加哥拉玛达酒店二楼的一个房间。它被称为金厅。对面的大会堂要大得多——预留给当天主题演讲——但金厅对于设法在清晨 8:30 参加小组讨论的相对较小的人群来说已经足够了。

大多数当天上午出席会议的人都会感到疲惫和昏昏欲睡,连续三个晚上参加深夜的社交活动让他们感到疲倦。周四是开发者日,也是会议的最后一天。

芝加哥会议在六个月前日内瓦举行的第一届万维网会议之后举行。对比会立即显而易见。与会者不会再参加 专注于标准和规范的分组会议,而是行业内部人士和商业新贵们蜂拥在走廊里兜售他们的产品。在很短的时间内,万维网已经成为主流。芝加哥会议反映了这种基调的转变:它是一场行业盛会,微软、惠普、硅图以及许多其他公司的代表都出席了会议。

会议的主题是“Mosaic 和万维网”,Mosaic 的诞生地 NCSA 帮助组织了此次活动。几天前网景公司发布的一份新闻稿使这一事实更加引人注目。网景公司主要由前 NCSA 员工组成。他们的浏览器第一个版本——戏剧性地被称为“Mosaic 终结者”——不仅处于测试阶段,而且在发布时将是免费的(后来这个决定被推翻了)。网景团队的大多数成员都出席了会议,与他们以前雇主兼最大竞争对手形成了商业上的对立。

商业冲突的巨大阴谋多少掩盖了会议最后一天上午的第一个环节,“HTML 和 SGML:技术演示”。尽管万维网的创建者蒂姆·伯纳斯-李爵士正在领导小组讨论。最后的演讲者是 Håkon Wium Lie,他与伯纳斯-李和 Robert Calliau 在 CERN 工作。演讲内容是关于一种新的设计语言提案,Lie 将其称为层叠 HTML 样式表。简称 CHSS。

这项提案是在匆忙中形成的。与标准编辑 Dave Ragget 的一次谈话让 Lie 相信了提案的紧迫性。Lie 在截止日期前,在会议前十天发布了提案的第一份草稿。


Lie 很早就热情地加入了万维网。早到足以使用 Nicola Pellow 的行模式浏览器通过 telnet 访问第一个网站。并且足够热情,在 1992 年从麻省理工学院媒体实验室毕业后不久 就加入了伯纳斯-李和 CERN 的网页团队。“我听到了大爆炸的声音,然后跑了过来,”Lie 这样形容自己的感受。

Hakon Wium Lie(图片来源:Heinrich-Böll-Stiftung

在他开始在 CERN 工作不久后,万维网的语言发生了转变。意识到万维网的用户不可能整天盯着白色背景上的黑色文本,Mosaic 的开发者引入了一个标签,允许网站创建者向网站添加内嵌图像。一旦大门打开,更多功能便蜂拥而出。Mosaic 添加了更多用于颜色、字体和布局的标签。Lie 和 CERN 团队只能在旁观望,Lie 后来评论道:“就像:‘该死,我们需要一些快速的方法,否则他们会毁掉 HTML 语言。’”

1994 年网景即将发布的消息没有带来任何缓解。Marc Andreessen 和他在网景的团队承诺了一个以消费者为中心的网页浏览器。伯纳斯-李开发了 HTML——万维网的唯一语言——用于描述文档,而不是设计它们。为了填补这一空白,浏览器用标签填充了 HTML 语言,以允许设计师创建动态和风格化的网站。

问题是,还没有一个标准的方法来做到这一点。因此,每个浏览器都添加了他们认为必要的东西,而其他浏览器要么被迫效仿,要么走自己的路。“一旦图像被允许在 HTML 文档中内联,万维网就变成了一个新的图形设计媒介,”程序员兼即将成为 W3C 成员的 Chris Lilley 大约在那个时候发布到 www-talk 上,“如果样式表或类似信息没有添加到 HTML 中,不可避免的结果将是文档只在特定浏览器上看起来不错。”

Lie 的提案——他几乎在他加入 CERN 后就开始着手进行——是为一种第二语言。CHSS 使用样式表:单独的文档,描述了 HTML 的视觉设计,而不影响其结构。因此,您可以更改 HTML,而您的样式表保持不变。更改样式表,HTML 保持不变。内容存储在一个地方,表示存储在另一个地方。

还有其他样式表提案。来自 O’Reilly 的 Rob Raisch 和 Viola 创建者 Pei-Yuan Wei 都有自己的版本。在 CERN 工作,在那里万维网诞生,有助于提升 CHSS 的知名度。其相对的简单性也使其对浏览器制造商具有吸引力。然而,层叠 HTML 样式表中的“层叠”使其脱颖而出。

每个人都通过自己经验的棱镜体验万维网。它通过不同的设备、在不同的条件下进行查看。在屏幕阅读器、手机和大型电视上。一个人根据自己的情况对页面外观的感知,与网站作者的意图以及浏览器的局限性和功能形成了鲜明对比。因此,万维网是混乱的。多个来源混合并竞争以决定每个网页的感知方式。

层叠为万维网带来了秩序。通过一组简单的规则,多个参与方——浏览器、用户和网站作者——可以在单独的样式表中定义 HTML 的表示。随着规则从一个样式表流向下一个样式表,层叠会将一个规则与另一个规则进行平衡并确定获胜者。它使 Web 的设计保持简单、可继承,并接受其自然的不稳定状态。它随着时间的推移而发生了变化,**但层叠使 Web 能够适应新的计算环境。**

在 Lie 在芝加哥拉玛达酒店二楼进行演讲后,层叠成为了讨论的中心。万维网的创建者利用 CHSS 提案作为跳板,就作者意图和用户偏好进行了更广泛的讨论。换句话说,在什么情况下,网站设计的作者应该覆盖用户的偏好或浏览器的确定。富有成效的讨论蔓延到房间外,并传播到 www-talk 邮件列表中,在那里被 Bert Bos 关注到了。

Bert Box speaking in front of a presentation slide.
Bert Bos(图片来源:dotConferences

Bos 是一位荷兰工程师,在荷兰格罗宁根大学学习数学。在他毕业之前,他创建了一个名为 Argo 的浏览器,它是该大学几个系中一个众所周知且有用的工具。Argo 值得注意有两个原因。第一,它包含了后来被称为小程序的早期版本。第二,它包含了 Bos 自己实现的样式表,与 CHSS 非常相似。他认识到一个机会。

“CSS1 的大部分内容都是在 1995 年 7 月的索菲亚-安蒂波利斯的白板上讨论的……每当我遇到困难的技术问题时,我都会想到 Bert 和那块白板。”

Hakon Wium Lie

Lie 和 Bos 开始一起工作,将他们的提案合并成更完善的东西。第二年,即 1995 年春季,第三届万维网会议在德国达姆施塔特举行。网景在六个月前刚刚发布,凭借其新任首席执行官 Jim Barksdale 的领导,已经迎来了新一轮的流行浪潮。距离历史上最成功的 IPO 还有几个月的时间,网景很快就会进入顶峰,万维网紧随其后,只要有机会,就会不断添加新的、非标准的 HTML 功能。

Lie 和 Bos 之前一直都是远程交流。在德国,他们第一次见面,并就层叠样式表(CSS,当时的 H 已经去掉)的新提案进行了联合演讲。

它与当时可用的内容形成了对比。当时只有 HTML 可用,网页设计师被迫通过表格和“像 FONT SIZE 这样的网景特色”来创建“页面布局”,正如一位 Suck 专栏作家当时所写,后来 被引用在 Lie 撰写的一篇论文中。臃肿的表格网页加载速度缓慢,并且难以被屏幕阅读器等辅助设备理解。CSS 解决了这些问题。尽管这位作者不相信它的持久性,但他仍然称赞 CSS 具有“简单的优雅,但也……它的多余和冗余”。

会议结束后不久,Bos 加入 W3C 与 Lie 共事。他们那个夏天开始起草规范。 Lie 回忆起他们当时疯狂而富有成效的工作,感到非常高兴。“CSS1 的大部分内容都是在 1995 年 7 月的索菲亚-安蒂波利斯的白板上讨论的……每当我遇到困难的技术问题时,我都会想到 Bert 和那块白板。”


1995 年,克里斯·威尔逊在浏览器领域已经小有名气。他曾在 NCSA 的 Mosaic 团队工作,是开发 Windows 版本的两位程序员之一。在 NCSA 实验室的地下室,威尔逊积极参与了帮助定义早期网络的对话。

威尔逊的大多数 NCSA 同事都收拾行囊前往硅谷,为网景开发“Mosaic 终结者”。而威尔逊则选择了不同的道路。他前往更北边的西雅图定居。他的第一份工作是在 Spry,为他们的“网络即盒装”软件包开发一个获得 Mosaic 授权的浏览器。然而,作为一名工程师,威尔逊很难抵挡西雅图微软的吸引力。到 1995 年,他已在微软担任软件开发人员,并在 1996 年被调到 Internet Explorer 团队,正值该浏览器即将发布 2.0 版本之际。

Internet Explorer 是微软后进入浏览器市场的产物。比尔·盖茨曾多年刻意避开互联网和网络,后来才彻底改变了公司立场。在那段时间,网景已经占据了一个迅速扩张的市场,而这个市场在他们开始时并不存在。他们发布了两个非常成功的用户友好型跨平台浏览器版本。他们的网络窗口配有内置电子邮件、简单的安装流程以及一种名为 JavaScript 的新语言,该语言允许开发人员为之前处于静止状态的网络添加生动的动画。

相比之下,微软提供的产品少之又少。Internet Explorer 最初是 Mosaic 的移植版本,但到威尔逊加入时,它已经基于重写的代码库。除了几个吸引企业市场的内置原生微软功能外,Internet Explorer 一直未能从网景的敏锐焦点和发展速度中脱颖而出。

微软需要一个差异化因素。威尔逊认为他找到了一个。“有一种叫做样式表的东西,”威尔逊回忆起当时对老板说的话,“它可以让你控制字体,你可以创建非常漂亮的页面,网景甚至都没有关注这方面。”威尔逊立即获得了开始开发 CSS 的批准。

当时,CSS 规范尚未完成。为了弥合预期工作方式的差距,威尔逊定期与李、博斯和其他 W3C 成员会面。他们会修改规范草案,威尔逊则会在他的浏览器中进行测试。反复如此。后来,他们甚至将网景的维杜尔·阿帕拉奥也纳入讨论,讨论变得更加正式。最终,他们组成了 CSS 工作组。

Internet Explorer 3 于 1996 年 8 月发布。它是第一个支持 CSS 的浏览器,而 CSS 当时尚未获得 W3C 的正式推荐。后来,这成为了一个问题。“仍然有很多 IE3 浏览器在使用,”李在发布几年后表示,“由于它们不符合规范,因此很难编写一个既适用于 IE3 又适用于后续浏览器的样式表。”

Screenshot of a page opened in Internet Explorerversion 3. There's an illustration of a brown dog with a blue floppy disk in its mouth. Internet Explorer 3 information is open in a separate window on the right.
Internet Explorer 3(图片来源:My Internet Explorer

然而,当时这是迫切需要的。由全球最大科技公司的一款浏览器提供支持的 CSS 工作版本,为其提供了稳定性。基于表格的布局和仅限网景的标签仍然被更广泛地采用,但 CSS 现在有了机会。

到 1997 年,W3C将 HTML 工作组拆分为三个部分,CSS 获得了自己的专用小组,该小组由 Internet Explorer 3 的临时团队组成。该小组将由克里斯·利利担任主席,他以计算机图形学专家的身份进入网络领域。利利几年前就指出了对标准化网络设计技术的必要性。在 W3C,他将领导这项工作。

CSS 的第一个正式推荐版本于 1997 年 12 月发布。六个月后,CSS 版本 2 发布。

作为工作组的主席,利利在 www-talk 邮件列表中非常活跃。他经常征求开发人员的意见或回答他们的问题。在一次这样的交流中,他收到了一封来自埃里克·迈尔的电子邮件。“嗨,我整理了一些测试页面,不知道你是否感兴趣,”迈尔回忆起这条消息时说道,并补充说他当时没有意识到“当时没有其他类似的东西”。


埃里克·迈尔参加了在芝加哥举行的网络会议,在这次会议上,霍肯·李首次演示了 CSS,尽管他没有参加那个会议的环节。直到几年后的巴黎第五届年度网络会议上,他才真正有机会看到 CSS。他当时去那里是为了发表一篇关于他在担任凯斯西储大学网站管理员期间开发的网络技术的论文。然而,他真正的目的是了解网络的未来发展方向。

他参加了一个小组讨论,参与者包括霍肯·李、伯特·博斯和戴夫·拉格特。他们每个人都介绍了 CSS 作为 W3C 规范的一部分的功能。克里斯·威尔逊也参加了,他当时有点感冒,但仍然热情地用 Internet Explorer 3 演示了 CSS 的工作版本。“我之前从未听说过 CSS,但当小组讨论结束时,我觉得我的脑袋都快炸了,”迈尔后来表示,“我瞬间就被吸引住了。感觉很对。”

埃里克·A·迈尔(图片来源:meyerweb.com

迈尔回到家后开始尝试使用 CSS。但他很快遇到了障碍。他只有规范可以参考——当时还没有正式的文档或 CSS 教程——但感觉有些不对劲。他会编写一些 CSS 代码并期望它以某种方式工作,但实际效果却截然不同。

于是,他开始整理测试页面。迈尔会将他的代码隔离到 CSS 的单个功能上。然后,他会跨浏览器测试它,并记录它们的不一致之处,以及他认为它们应该如何工作。“我认为这主要是因为深入研究一个新系统、将其拆解、弄清楚它是如何工作的以及记录哪些有效哪些无效的纯粹快乐。我不知道为什么这类事情会让我兴奋,但事实的确如此。”多年来,迈尔一直凭借这种实验类型建立了自己的职业生涯。

这些测试页面——发布在迈尔的网站上,后来也发布在其他博客上——经过精心安排,并且在不知不觉中记录了根据规范正确实现 CSS 的方式。克里斯·利利拿到这些页面后,CSS 工作组帮助迈尔将它们转变为官方的 W3C CSS 测试套件,这是一个帮助浏览器引入 CSS 的重要工具。

迈尔个人网站上的测试页面和教程很快成为热门博客上的常规专栏。然后,奥莱利出版社联系他撰写一本书,最终出版了《CSS:权威指南》。本书的研究使迈尔与在 W3C 和浏览器内部构建 CSS 的人建立了联系。他反过来又将自己学到的知识分享给网络开发社区。不久,迈尔就确立了自己在 CSS 历史上核心人物的地位。

他的工作还在继续。当网络标准项目联系程序员约翰·奥尔索普组建一个专门负责 CSS 的委员会时,他立即想到了迈尔。迈尔与奥尔索普和其他人一起加入了委员会:苏·西姆斯、伊恩·希克森、大卫·巴伦、罗兰·埃里克森、肯·冈德森、布拉德·麦克丹尼尔、利亚姆·奎因和托德·法尔纳。他们的正式头衔是 CSS 行动委员会,但他们通常被称为 CSS 武士。

CSS 是一种得到正确标准化的设计语言。如果正确使用,它可以摆脱过去仅限网景的功能和基于表格的布局。但对于一些开发人员来说,浏览器的 CSS 支持速度不够快。而且当它们确实支持时,也往往是事后才想到的。“除非你经历过,否则你真的无法想象浏览器对 CSS 的支持有多么糟糕、不一致和令人沮丧,”迈尔后来回忆道。CSS 武士的目标就是解决这个问题。

该委员会采取了网络标准项目熟悉的方法,一方面发布关于浏览器缺乏支持的公开报告,另一方面私下与浏览器制造商会面讨论更改。该委员会的第三个目标是直接与开发人员沟通。基层教育成为 CSS 武士工作的一个核心目标,这是一种自下而上的有效变革工具。

网景构成了最大的障碍。网景完全依赖于 JavaScript,它使用了一个非标准版本的 CSS,称为 JSSS,现在这种语言基本上已经被遗忘了。浏览器使用 JavaScript 动态处理样式表以呈现页面,这使得它的支持不稳定,并且加载速度通常很慢。直到 2000 年代初 Gecko 渲染引擎的发布,JSSS 才被移除。随着网景在这次变革中转变为 Mozilla,它最终实现了 CSS 的功能性实现。

但对于其他浏览器,特别是那些占据更大市场份额的 Internet Explorer 版本,WaSP 证明了其成功。开发人员的心和思想与他们同在,因为他们进入了网络样式的新时代。


至少有一次咖啡谈话挽救了 CSS。可能还有更多,但这次谈话发生在 1999 年,参与者是托德·法尔纳和坦特克·切利克。法尔纳是网络标准项目和 CSS 武士的成员,经常站在变革的最前沿。除了为网络进行无数工作外,他还帮助迈尔完成了 CSS 测试套件,并开发了一个用于 CSS 支持的实用试金石,称为 Acid 测试。

切利克在微软工作。在其他主要浏览器这样做之前几年,他主要负责将网络标准支持引入 Internet Explorer for Mac。切利克对 CSS 的发展产生了深远而持久的影响。他很快加入了网络标准项目指导委员会。后来,作为 CSS 工作组的成员,他为多个规范做出了贡献并参与了编辑工作。

在那个特定的日子里,在咖啡馆里,谈话的主题是网络的生存危机。多年来,浏览器添加了临时、不一致且不兼容的 CSS 版本。有了 W3C 的正式推荐,终于有了一种客观正确的方法。但是,如果浏览器采用来自 W3C 的新的正确规则并将其应用于所有依赖于之前旧的错误规则的网站,那么这些网站将突然变得无法使用。

他们需要一个切换开关。某种开发人员可以打开的开关,以表明他们希望使用新的正确规则。那天,法尔纳提议使用文档类型声明。这是 HTML 页面顶部的一段文本,用于指定文档类型定义(丹·康诺利在 W3C 花了数年时间进行标准化)。这种做法被称为文档类型切换。这意味着新网站可以使用正确的方式编写 CSS 代码,而旧网站将继续正常工作。

当 Internet Explorer for Mac 版本 5 发布时,它包含了文档类型切换功能。不久,所有浏览器都采用了这种功能。这为浏览器中符合标准的 CSS 开启了大门。


“我们还没有学会如何设计网页。”这是 Molly Holzschlag 2003 年出版的书籍 《层叠样式表:设计师的优势》 引言中的第一句话。这是一个大胆的声明,并非 Holzschlag 第一次或最后一次发表这样的言论——她在网络演变过程中产生了深远而持久的影响。在她的职业生涯中,Holzschlag 一直是不懈地倡导网络用户,即使这与网络技术制造商发生冲突。她几十年来与网络的渊源远远超出了 CSS,几乎涵盖了网络开发和演变的方方面面。

Holzschlag 继续说道:“为了达到网络发展史上的这一阶段,我们不得不借鉴其他媒体的指南,通过浏览器的不兼容性进行黑客攻击和变通,并将标记语言扭曲到超出其正常形状的程度,以至于破坏了它。”

Molly Holzschlag

2000 年底,网景发布了其浏览器的第六个版本。不久之后,Internet Explorer 6 也问世。这些浏览器的样式表比以往任何时候都强大得多。但微软五年内都没有发布新的浏览器。网景几乎被微软打败,花了数年时间才重整旗鼓,并转型为功能更强大、符合标准的 Firefox。

Web 标准项目和 W3C 的工作为网络带来了一个可用的 CSS 版本。但它并不完整,而且往往难以理解。开发人员还必须考虑许多人仍在使用的旧版浏览器。

在 21 世纪初,网络的创造者们陷入了过去充满不一致性和未来充满想象力的夹缝之中。“设计师和开发人员正在突破浏览器的能力极限,”网络开发人员 Eevee 回忆当时使用 CSS 的情况,“浏览器处理所有这些问题的方式都有些糟糕。所有修复程序、变通方法和库都晦涩难懂、脆弱易损、容易出错,或者很笨重。”

大多数网页设计师继续依赖 HTML 表格技巧和网景专有标签的组合来创建高级设计。CSS 的第二级提供了更多可能性,但设计师却犹豫不决,不敢全力以赴,以免网景用户体验不佳。“网景 Navigator 4 阻碍了所有人的发展,”开发人员 Dave Shea 后来表示,“它几乎不支持 CSS,当然也不支持我们可以开始构建完全无表格网站的任何功能。而且继续支持的商业案例过于强大,无法忽视。”

然而,在表面之下,一个充满活力且有影响力的社区通过博客、邮件列表和书籍传播着新的理念。该社区提出了巧妙的解决方案,并赋予了它们同样巧妙的名称。来自 Holly Bergevin 和 John Gallant 维护的《位置至上》中的“Holly Hack”和“clearfix”。Douglas Bowman 的“CSS 滑动门”,Dan Webb 和 Patrick Griffith 的“Suckerfish 下拉菜单”以及 Dan Ciederholm 的“伪列”都来自 Jeffrey Zeldman 的 《A List Apart》 博客。甚至 Meyer 和 Allsopp 也创建了 CSS Discuss 邮件列表,作为创新理念和实践的研讨会。

“未来几年使用 CSS 的人将提出我们需要的创新设计理念,以帮助推动网络的整体潜力。”

Molly Holzschlag

然而,该社区的大部分精力都花费在了黑客攻击、变通方法和创造性解决方案上。最有趣的设计理念总是伴随着一个警告,一段代码使其能够在这个或那个浏览器中工作。由 Rachel Andrew 编写的 《CSS 选集》 第一版成为了许多 CSS 开发人员的参考手册,其中有一整章专门介绍如何处理网景 4。

CSS 的创新者们——深受难以解释的差异困扰——被迫将语言分解开来,找到通往其设计的途径。在这一新事物之后,随之而来的是一股创意浪潮。网络历史上一些最具表现力和精明的设计都诞生于这个时代。

然而,同一个社区却经常陷入对 CSS 能做什么的集体迷恋之中。这种文化有时会过分重视黑客攻击和变通方法。出于必要,共享的教育侧重于“如何做”而不是“为什么做”。过于巧妙的技术有时会超过其实用性。

这种情况开始发生变化。Holzschlag 在她关于 CSS 的书籍的引言中对未来进行了展望。“未来几年使用 CSS 的人将提出我们需要的创新设计理念,以帮助推动网络的整体潜力。”


Dave Shea 是 Web 标准项目的思想信徒,也是不断壮大的 CSS 社区的积极成员。他同意 Holzschlag 的观点。“我们进入了一个个人可以帮助塑造网络未来的时期,”他后来描述了那一刻。像其他人一样,他对不支持 CSS 的浏览器的限制感到沮丧。

应对这种沮丧情绪的良药通常是玩得开心一点。尽管网页设计社区日益壮大,但它仍然很小且熟悉。对某些人来说,传播灵感成为了一种爱好。Domino Shriver 在他的网站 WebNoveau 上整理了一份 CSS 设计列表,后来由 Meryl Evans 维护。每天,使用 CSS 设计的新网页都会发布到其首页。Chris Casciano 的 Daily CSS Fun 对此进行了修改。他每天都会为同一个 HTML 文件发布一个新的样式表,展现 CSS 创造的各种设计。2003 年 5 月,Shea 推出了自己的版本,名为 CSS Zen Garden。该项目基于一个简单的前提。每个页面都使用完全相同的 HTML 文件和完全相同的内容。唯一不同的是页面的样式表,即应用于该 HTML 的 CSS。Shea 没有自己创建样式表,而是向世界各地的开发人员征集样式表,以创建一个 CSS 灵感数字画廊。设计风格从简约到令人惊叹的巴洛克风格。这是一个探索可能性游乐场。

Zen Garden 一方面是影响力的来源,另一方面是 CSS 优势的实际演示,同时也是优秀网页设计的展示,它传播到了网络的各个角落。最初的五个设计很快就变成了一个充斥着数十种不同设计的网站。然后更多。“数百位设计师通过创建 Zen Garden 布局留下了自己的印记,有时也树立了自己的声誉,”作者 Jeffrey Zeldman 后来在他的著作《使用 Web 标准进行设计》中说道,“全世界数万人因此爱上了 CSS。”

尽管 Zen Garden 成为最著名的项目,但它只是网络上不断增长的灵感项目的一部分。网络创作者希望展望未来。

2005 年,Shea 与 Molly Holzschlag 合作出版了一本基于该项目的书籍,名为 《CSS 设计禅》。到那时,CSS 已完全吸引了网页设计师的注意力。


1998 年,为了跟上微软的步伐,网景决定免费发布其浏览器,并将其源代码在名为 Mozilla 的新成立的伞形项目下开源,该项目最终导致 2003 年发布了 Firefox 浏览器。

David Baron 和 Ian Hickson 都在 20 世纪 90 年代末开始在 Mozilla 担任志愿者,后来成为 Mozilla 质量保证团队的实习生,负责识别标准兼容性错误。正是通过他们的工作,他们不仅深入了解了 CSS 的工作原理,还了解了它在标准驱动的浏览器中是如何实际使用的。在此期间,Hickson 和 Baron 成为不断壮大的 CSS 社区不可或缺的一部分,并加入了 CSS 武士。他们帮助编写和运行 CSS 测试套件的测试。他们积极参与 www-style 邮件列表,后来还参与了 CSS 工作组本身。

当 Meyer 正在撰写他的第一本书《CSS:权威指南》时,他回忆起曾向 Baron 和 Hickson 寻求帮助,以了解 CSS 的某些部分是如何工作的。“我怀疑我将永远无法忘记他们为了帮助我走出我自己误解的困境而付出的奉献,”他后来表示。正是他们对细节的关注,让他们很快成为了一笔宝贵的财富。

浏览器根据 W3C 规范中的文字来理解样式表(CSS 的语言)。如果语言不够具体,或者没有考虑每个边缘情况或功能组合,这会导致浏览器之间出现不兼容性。在 W3C 工作期间,Hickson 和 Baron 帮助使技术规范的模糊语言变得更加清晰。他们使 CSS 的定义更加精确、一致,并且更容易正确实现。

他们的工作,以及 Bert Bos、Tantek Çelik、Håkon Lie 等人的工作,导致了 CSS 第二个版本的重大修订,CSS 工作组成员 Elika Etemad 后来将其描述为“一个漫长的过程,包括填补漏洞、修复错误以及为核心 CSS 标准构建测试套件。”这是一项不知疲倦的工作,既包括与浏览器程序员的交流,也包括实际的技术工作和写作。

这也是一项没有人认为会花费很长时间的工作。几年内发布了两个版本的 CSS。预计一个小修订版只需要花费一小部分时间。几个月后,在一次会议的晚上,几位 CSS 编辑评论说,如果他们在晚上熬夜,他们可能会在第二天之前完成。相反,这项工作花费了将近十年的时间。

多年来,Elika Etemad(当时只被称为“fantasai”)一直是 www-style 邮件列表和 Mozilla 错误跟踪器的积极成员。这让她有机会与浏览器制造商和 W3C 成员进行交流。尽管多年来她与 CSS 工作组的许多不同成员进行了交流,但她与 David Baron 和 Ian Hickson 进行了一些最投入和最频繁的讨论。“fantasai”像 Hickson 和 Baron 一样,发现了其他人没有注意到的错误和规范错误——并且乐于报告她发现的内容。

Elike Etemad speaking in front of a podium for CSS Day.
Elika Etemad(图片来源:Web Conferences Amsterdam

这项工作让她在2004年获得了参加万维网联盟(W3C)技术全体会议的邀请。每年,W3C工作组的成员都会前往不同的地点(2020年是首次以虚拟方式举行)参加此次活动。W3C的讨论主要通过电子邮件、电话会议和编辑意见进行。对于一些成员来说,全体会议是他们一年中唯一能够面对面交流的机会。2004年,会议在法国南部的一个名为曼德利厄-拉纳普尔的城镇举行,俯瞰戛纳湾。正是在那里,埃特玛德第一次与巴伦和希克森见面。

CSS工作组在花了数年时间开发CSS 2.1后,邀请埃特玛德加入他们。2001年Internet Explorer 6发布后,微软几乎完全退出了标准化流程。工作组不得不与Mozilla和Opera等积极开发的浏览器合作,同时受到停滞不前的IE6的限制。他们花了数年时间完善细节,始终感觉即将完成。“我们几乎没有问题了,我们收到的新问题通常都是一些小问题,比如拼写错误之类的,”希克森在2006年发帖称,距离最终规范还有数年时间。

在此期间,CSS工作组还在开发一些新东西。希克森和巴伦从CSS 2.1中吸取了教训,CSS 2.1是一个详尽但庞大的规范。“我们成功了,”希克森后来评论道,“但它们确实复杂得令人难以置信。我们应该做的是打破这些限制,提出一些更简单的东西,理想情况下是更贴近当时浏览器实现的东西。”随着时间的推移,CSS工作组开始转变他们的方法。规范不再是单一的、不可更改的文档。它会随着时间的推移而改变,以适应现实世界的浏览器实现。

从CSS3开始,也过渡到一种新的格式,以涵盖更广泛的功能集并与浏览器开发保持同步。CSS3由多个模块组成,每个模块都解决一个特定的功能领域,包括颜色、字体、文本以及媒体查询等更高级的概念。“一些CSS3模块是‘概念专辑’,”‘fantasai’描述道,“这些规范正在勾勒出CSS的未来。”这些“概念”是独立开发的,并且以不同的速度进行。每个CSS3模块都有自己的编辑。他们共同为CSS带来了更大胆的愿景。在单独的情况下,它们与现实世界的浏览器实现一起开发,并且可以更灵活地适应变化。

CSS3的模块化方法将证明是有效的。CSS的第二个十年将带来翻天覆地的变化和令人耳目一新的新功能。CSS的第二个十年将与第一个十年不同。新功能将带来新的设计,最终,将带来一个新的网络。


喜欢通过这样的故事学习网络历史吗?Jay正在讲述网络的完整故事,每两周都会有新的故事。订阅他的时事通讯,了解最新的……过去的事情。