网页技术的兴衰演变

我常给刚为人父母的朋友一个建议：当你以为掌握了一切时，一切都会改变。刚适应喂奶、换尿布和规律小睡，就要开始添加辅食、如厕训练和整夜睡眠。等这些熟悉后，又迎来学前教育和罕见的小睡。循环往复。

当今从事设计和开发的我们也是如此。我在网页领域工作近三十年，见证了理念、技巧和技术的周期性兴衰。每当开发者和设计师进入稳定节奏，总会有新理念或技术出现，颠覆并重塑我们的世界。

发展历程

我在90年代中期创建了第一个网站。那时的网页设计和开发毫无规范可言。除了单栏布局，我们使用表格元素，常用含单像素间隔GIF的空单元格来制造空白。用大量font标签嵌套来改变字体样式，可选字体只有三四种：Arial、Courier或Times New Roman。1996年Verdana和Georgia问世时，我们欢呼雀跃，因为选择几乎翻倍。唯一安全的颜色是216种"网页安全色"。少数交互元素（如联系表单、留言簿和计数器）大多由CGI脚本驱动（当时主要用Perl编写）。要实现独特外观需要大量技巧，交互通常仅限于网站的特定页面。

网页标准的诞生

世纪之交，新周期开始。布满表格布局和font标签的粗糙代码逐渐衰落，推动网页标准的浪潮兴起。CSS等新技术得到浏览器厂商、开发者和设计师更广泛的采用。向标准的转变并非偶然或一夜之间发生。需要W3C与浏览器供应商积极互动，以及Web Standards Project等组织的大力推广。A List Apart和Jeffrey Zeldman的《使用网页标准设计》等书籍在教导开发者和设计师标准的重要性、实施方法及向组织推广方面发挥了关键作用。渐进增强等方法引入了内容应适用于所有浏览器的理念——更高级的浏览器可获得额外增强功能。同时，CSS Zen Garden等网站展示了CSS与坚实语义HTML结构结合时的强大和多功能性。

PHP、Java和.NET等服务器端语言取代Perl成为主流后端处理器，cgi-bin被扔进垃圾箱。随着这些更好的服务器端工具出现，网页应用的第一时代开启，从内容管理系统开始（特别是博客领域的Blogger、Grey Matter、Movable Type和WordPress等工具）。2000年代中期，AJAX为前端和后端之间的异步交互打开了大门。突然之间，页面无需重新加载即可更新内容。Prototype、YUI和jQuery等JavaScript框架涌现，帮助开发者在标准支持水平参差不齐的浏览器间构建更可靠的客户端交互。图像替换等技术让巧妙的设计师和开发者能够显示自选字体。Flash等技术使添加动画、游戏甚至更多交互成为可能。

这些新技术、标准和方法在许多方面重振了行业。随着设计师和开发者探索更多样化的样式和布局，网页设计蓬勃发展。但我们仍然依赖大量技巧。早期CSS在基本布局和文本样式方面比基于表格的布局有了巨大改进，但当时的局限性意味着设计师和开发者仍然严重依赖图像来实现复杂形状（如圆角或斜角）和铺贴背景以实现全长列的外观（以及其他技巧）。复杂布局需要各种嵌套浮动或绝对定位（或两者兼有）。Flash和自定义字体的图像替换是从五大字体中变化字体的良好开端，但这两种技巧都带来了可访问性和性能问题。JavaScript库让任何人都可以轻松为页面添加一点交互，尽管代价是简单网站的下载大小增加一倍甚至四倍。

网页作为软件平台

前端和后端之间的共生关系持续改善，导致了现代网页应用的当前时代。扩展的服务器端编程语言（不断增长包括Ruby、Python、Go等）和React、Vue、Angular等新前端工具之间，我们可以在网页上构建功能齐全的软件。伴随这些工具而来的还有其他工具，包括协作版本控制、构建自动化和共享包库。曾经主要是链接文档的环境变成了无限可能的领域。

同时，移动设备功能越来越强大，让我们口袋中就能访问互联网。移动应用和响应式设计为随时随地的新交互打开了机会。

功能强大的移动设备和强大的开发工具的结合促进了社交媒体和其他集中式工具的兴起，供人们连接和消费。随着在Twitter、Facebook甚至Slack上直接与他人联系变得越来越容易和普遍，对托管个人网站的需求减弱。社交媒体提供了全球范围的连接，带来了随之而来的好处和坏处。

当前现状

过去几年，感觉我们开始达到另一个重要转折点。随着社交媒体平台分裂和衰落，人们对再次拥有自己的内容越来越感兴趣。制作网站的方法多种多样，从托管纯HTML文件的经典可靠方法到静态网站生成器，再到各种内容管理系统。社交媒体的分裂也带来了代价：我们失去了发现和连接的关键基础设施。Webmentions、RSS、ActivityPub和IndieWeb的其他工具可以有所帮助，但它们仍然相对未充分实施，对不太技术宅的人来说难以使用。我们可以构建出色的个人网站并定期添加内容，但如果没有发现和连接，有时感觉就像在虚空中呐喊。

浏览器对CSS、JavaScript和Web组件等其他标准的支持加速了，特别是通过Interop等努力。新技术在比以前短得多的时间内获得全面支持。我经常了解新功能并检查其浏览器支持，结果发现其覆盖率已经超过80%。如今，使用新技术的障碍通常不是浏览器支持，而是设计师和开发者学习可用内容及如何采用的速度限制。

今天，通过几个命令和几行代码，我们可以原型化几乎任何想法。我们现在拥有的所有工具使开始新事物比以往任何时候都更容易。但这些框架在初始交付中可能节省的前期成本最终会到期，因为升级和维护它们成为我们技术债务的一部分。

如果我们依赖第三方框架，采用新标准有时可能需要更长时间，因为我们可能必须等待这些框架采用这些标准。这些曾经让我们更快采用新技术的框架现在反而成了障碍。这些相同的框架通常还会带来性能成本，迫使用户等待脚本加载才能阅读或与页面交互。当脚本失败时（无论是由于代码问题、网络问题还是其他环境因素），通常没有替代方案，留给用户空白或损坏的页面。

未来方向

今天的技巧有助于塑造明天的标准。暂时拥抱技巧以推动现在前进并没有本质错误。只有当我们不愿承认它们是技巧或犹豫替换它们时，问题才会出现。那么，我们可以做些什么来创造我们想要的网页未来？

为长远构建。优化性能、可访问性和用户体验。权衡那些对开发者友好的工具的成本。它们可能让你今天的工作更轻松，但它们如何影响其他一切？对用户的成本是什么？对未来的开发者？对标准采用？有时便利可能值得。有时只是你习惯的技巧。有时它阻碍你获得更好的选择。

从标准开始。标准随时间不断演变，但浏览器在继续支持旧标准方面做得非常出色。第三方框架并不总是如此。即使用90年代最技巧性的HTML构建的网站今天仍然运行良好。使用框架构建的网站在仅仅几年后并不总是如此。

精心设计。无论你的技艺是代码、像素还是流程，都要考虑每个决策的影响。许多现代工具的便利性代价是不总是理解导致其设计的底层决策，也不总是考虑这些决策可能产生的影响。与其匆忙"快速行动打破常规"，不如利用现代工具节省的时间更仔细地考虑和深思熟虑地设计。

不断学习。如果你一直在学习，你也在成长。有时可能很难确定什么值得学习，什么只是今天的技巧。你可能最终专注于明年无关紧要的东西，即使你只专注于学习标准。（还记得XHTML吗？）但不断学习在你大脑中打开新的连接，你某天学到的技巧可能有助于另一天的不同实验。

玩耍、实验和变得古怪！我们构建的这个网页是终极实验。这是历史上最大的人类努力，但我们每个人都可以在其中创建自己的小天地。勇敢尝试新事物。为想法构建游乐场。在你自己的疯狂科学实验室中进行愚蠢的实验。创办自己的小企业。从来没有一个更能赋能的地方来发挥创造力、冒险和探索我们的能力。

分享和放大。当你实验、玩耍和学习时，分享对你有用的东西。在你自己的网站上写作，在你喜欢的社交媒体网站上发布，或在TikTok上大声宣传。为A List Apart写点东西！但也要花时间放大他人：寻找新声音，向他们学习，并分享他们教给你的东西。

前进与创造

作为网页（及更远）的设计者和开发者，我们每天都有责任构建未来，无论是个人网站、数十亿人使用的社交媒体工具，还是介于两者之间的任何东西。让我们将我们的价值观注入我们创造的事物中，让网页对每个人来说都变得更好。创造只有你独特适合制作的东西。然后分享它，改进它，重新制作，或制作新东西。学习。创造。分享。成长。冲洗并重复。每次你认为自己掌握了网页时，一切都会改变。