你打开一个品牌工作室的网站,首页先加载七张全屏大图,再让它们循环播放。画面很漂亮,但每位访客都要下载这些内容。访问次数一多,数据传输、服务器运算和设备耗电便不断累积。网站因此不只是一张数字名片,也是一件持续消耗能源的产品。
墨尔本品牌工作室 MEK 决定拿自己的网站做实验:一个以视觉表现招揽客户的团队,能把网页做得更轻,同时不把品牌个性一起删掉吗?以下事实均来自 Fast Company 的单篇报道,其中计算器排名是特定条件下的估算,不等于经独立核算的实际排放量。
先看看网页重在哪里
事情始于 2022 年的一场知识竞赛。MEK 团队听到一种说法:发送 100 封电子邮件的碳足迹高于汽车行驶一公里。这个比较缺少邮件大小、附件、设备和车辆类型等前提,不能当成可靠结论,却促使团队检查自己的数字排放。
他们用 Website Carbon 在线计算器测试官网,结果显示其排放表现差于受测网页中的 76.5%。这个数字更适合看作一次体检提示:结果会随测量时间、页面状态、流量假设、数据传输量和托管能源模型变化。
问题并不隐蔽。旧首页有一个由七张全屏图片组成的循环幻灯片,还存在不必要的重复 HTML 标签——HTML 是组织网页内容的基础标记。前者增加下载量,后者让页面代码变得臃肿。
报道还援引智库 The Shift Project 的估算称,数字技术约占全球温室气体排放的 3.7%。材料没有交代这一估算的年份和统计边界,但它提醒我们:网页看起来没有烟囱,背后仍然需要数据中心、网络和用户设备供电。
低碳不是把设计全部关掉
MEK 在 2023 年完成低碳改版,之后又进行更新。团队减少高负载的设计元素,清理重复标签,并重新考虑图片、颜色和字体。
字体最能说明其中的取舍。据 Fast Company 补充报道,团队一度把品牌常用的 Monument Grotesk 换成设备通常已有、无需额外下载的 Arial。数据负担降了,但网站也显得过于普通。对一家靠官网展示审美与性格的品牌机构来说,这不是无关紧要的损失。
团队最后选择可高效缓存的 Zalando Sans。缓存可以理解为让浏览器把用过的文件暂时留下,下次访问时不必重新下载。他们也减少图片负担,并改用深色界面。报道给出的最终计算器结果是:网站从差于 76.5% 的受测页面,变成比全球 74% 的页面更“清洁”。两次相对排名提供了方向性证据,但材料没有给出页面体积、能耗或排放降幅,因此不能据此推算实际减排量。
深色界面同样不是普遍适用的节能按钮。它主要可能在 OLED 等自发光屏幕上降低耗电,效果还取决于亮度设置;对 LCD 屏幕并不必然成立。
真正有用的是“预算”思维
这次改版值得关注,不是因为它找到了一套所有网站都能照抄的配方,而是因为它把环境成本带进了设计决策。
所谓碳预算,是预先为单次访问的数据量或估算排放设定上限。它类似性能预算:团队提前限定页面体积、图片重量、脚本数量或加载时间,超过门槛就必须取舍。这样,“网站要更环保”和“网站要更快”才不只是口号,而会变成设计评审时可以检查的问题。
另一种相关思路叫渐进增强:先保证轻量的基础内容和功能可用,再为条件允许的设备添加复杂效果。说白了,不必让每位访客都为一段装饰动画或一组高清图片支付同样的数据成本。
MEK 创始人 Mirella Arapian 最后形成的原则很克制:不是删掉所有有成本的东西,而是要求每个元素证明自己值得这份成本。对品牌网站而言,这比单纯追求计算器最低分更现实。视觉辨识度、加载性能和环境影响并非只能三选一,但每一个选择都应该有理由。
局限与未知
- 报道没有披露改版前后的页面体积、加载时间、能耗或绝对排放量,无法判断具体改善幅度。
- “字体更节能”和“可持续设计会改善体验”仍需具体页面数据支持,不能从一次案例推广为普遍结论。
- Website Carbon 的排名依赖模型与测试条件,适合用来发现问题和比较方向,不等于完整的碳核算。