我的职业生涯始于产品设计，那时“产品”意味着你可以握在手中的真实物品。15 年前，当我转向数字设计时，我很高兴能够设计出数字产品，这些产品可以为人们的生活增加价值，而不会对环境造成任何影响。它们不浪费能源，没有浪费性的包装，也不会在寿命结束后最终成为垃圾填埋场的垃圾。
因此，我很惊讶后来了解到数字产品也可能造成浪费。在本文中，我将探讨如何将零浪费的思维方式应用于数字设计和开发，以帮助您创建一个对人类和地球都更好的互联网。
浪费是不正常的
我认为可以公平地说，即使我们不喜欢，我们大多数人也接受浪费是日常生活的正常组成部分。然而，浪费绝非正常。在自然界中，没有资源被浪费，一切都有价值。我们现在认为如此正常的浪费类型是一个相对较新的概念。
到 20 世纪 80 年代，堆积在垃圾填埋场的垃圾已经成为一个全球性问题。Daniel Knapp 认为必须做些什么。他提出了全面回收的概念，即任何东西都不应该进入垃圾填埋场或焚烧。他创造了“零浪费”一词作为目标，并与人共同创立了一家名为 Urban Ore 的回收业务。这是一项真实的实验，旨在展示如何将各种类型的垃圾从垃圾填埋场转移出来并在社区中重复使用。
虽然 Knapp 的倡议取得了一些成功，但全球废物问题仍在持续增长，在 2000 年代中期，越来越多的个人开始亲力亲为，尝试过零浪费的生活方式。这个概念通过像 Bea Johnson 和 Lauren Singer 这样的博主普及开来，她们分享了自己尝试无浪费生活的经历，并激励其他人效仿她们。
这如何应用于网页设计？
几年前，我开始进行一些研究，以了解网络产品是否会对环境产生影响。我被我的发现震惊了。如果将互联网作为一个整体来看，由于为数据中心、电信网络和数十亿终端用户设备供电需要大量电力，互联网每年产生的碳排放量超过了全球航空业。更不用说所有这些设备都需要制造和维护。互联网一点也不虚拟，它非常物理。
然后，我们的团队开发了一个 网站碳排放计算器，以帮助提高人们对这个问题的认识。我们测试了数百万个网页，并随着它越来越受欢迎而识别出一种模式。最节能的网站看起来像是来自 1990 年代的网站，而许多新网站的污染程度很高。
事实证明，尽管早期的网站功能和外观都很基本，但它们却非常高效，文件大小很小，几乎不需要任何计算能力。随着计算机变得越来越强大，互联网速度不断提高，网站变得越来越臃肿，侵蚀了计算机硬件进步带来的好处。结果，现代网络并不比 10 年前更快，而且污染更严重。
在《国家地理》杂志一篇关于人们过着零浪费生活的文章中，记者 Stephen Leahy 写道，与他之前的假设相反，“这些人不是想成为嬉皮士，而是拥抱现代极简主义生活方式的人们。他们说这为他们节省了金钱和时间，并丰富了他们的生活。”
如果我们将零浪费的思维方式应用于数字设计会怎样？它能帮助我们创建一个现代、极简主义的网络，为人们节省时间、金钱并丰富人们的生活吗？我认为它可以。
1. 图片胜过千言万语
一张图片胜过千言万语，但事实是，一张图片比 1000 字的文本使用更多的数据，反过来，存储、传输和渲染它也需要更多的能量。
尼尔森诺曼集团的研究发现，网站访问者完全忽略与内容无关的图像，这使得网站上的通用库存照片成为名副其实的空间和数据浪费。最好有意识地使用图像，并且只将它们包含在真正增加价值的设计中。
即使您打算在设计中包含照片，您使用它们的方式也常常是浪费的。例如，在图像尺寸和文件大小方面，大致存在平方定律。如果将宽度和高度加倍，文件大小几乎会增加四倍。这还是假设您编写了代码来加载正确大小的图像，而不是加载大型图像文件并显示它们以看起来很小。
您还可以在图像中发现浪费，以不需要存在的细节的形式存在。通过模糊图像的某些部分、使用浅景深摄影、在纯色背景上拍摄物体或使用单色图像来消除细节，只是减少图像文件大小的几种方法。如果不需要细节，那就是浪费。
即使您高效地设计图像，图像文件本身仍然存在潜在的浪费。在您的 图像编辑应用程序 中使用索引颜色可以从图像文件中去除不必要的数据，而不会在视觉上损失质量。
2. 明智地选择文件格式
您还可以使用更有效的文件格式。例如，WebP 图像文件 通常比 JPEG 小 30%，而 AVIF 图像文件大约是 JPEG 大小的一半。
矢量图形（如 SVG）也可以成为网站上摄影的更有效替代方案。您可以通过去除设计文件中不必要的图层并简化矢量路径来优化 SVG 文件。只需花费几分钟清理设计文件，SVG 文件的大小就可以减少多达 97%。
3. 停止自动播放视频
自动播放视频比其他内容类型消耗更多的数据和能量。《纽约时报》记者 Brian Chen 写了一篇文章，讲述了网络上自动播放视频的祸害，称它们“在消耗您的数据流量和耗尽电池电量的同时，还在强迫您关注”。它们浪费了用户的数据流量（也因此浪费了他们的钱），它们浪费了能源，并且它们减慢了网页速度。谨慎使用视频，并在其上放置一个播放按钮，让用户选择加入。
4. 零浪费字体
系统字体可能不受设计师欢迎，但它们已经存在于每个用户的设备上，因此无需加载，使其真正实现零浪费。例如，一个旅游网站可能会使用系统字体为其用户提供高效的用户体验，他们中的许多人可能在国外并且使用缓慢、昂贵的漫游数据。
font-family CSS 属性 提供了一些通用字体族名称，您可以用来指定主机系统上已安装的字体
衬线字体非衬线字体手写体系统 UI
如果您确实使用网络字体，最容易发现浪费的地方是识别字体文件中您的网站不使用的字符。例如，有些字体提供数千个字符，但英语只需要大约一百个。网上有许多字体子集工具可用，它们可以获取任何字体文件并删除您的目标语言中未使用的字符。
在选择要使用的字体时，浏览器不会在 CSS 列表中的第一个字体处停止。字体选择实际上是针对网页上的每个字符完成的，前提是当一种字体缺少特定字形时，列表中的另一种字体可能会提供它。如果您知道需要一种字体来处理一组特殊字符，请仅在将主要字体选择设置为系统字体后才添加该字体。
就像图像一样，您可以通过使用高效的文件格式来节省更多数据。WOFF2 字体文件可以比 WOFF 文件小约 30%，并且比 TTF 文件小多达 75%。
5. 在您的代码中找到浪费
CSSstats.com 工具允许您可视化 CSS 文件中实际存在的内容，并查看您重复相同样式的频率。看到这种浪费可以帮助您清理它，而实施具有可重复样式的模块化设计语言可以帮助您长期保持干净、高效的 CSS。
在选择库、框架或跟踪脚本时，您应该问问自己它们是否真的有必要，以及是否有更小的替代方案可用。例如，jQuery 可能只有 30kb，但有可能在小于 30kb 的空间内构建整个网页。如果可以避免添加它，您就应该这样做。同样，基本的 Google Analytics 跟踪脚本为 17kb，但像开源 Plausible analytics 这样的替代方案小于 1kb，并且旨在尊重人们的隐私。
就执行任务的能源效率而言，有些编程语言也比其他编程语言更浪费。JavaScript 的能源效率是 PHP 的七倍。在决定学习哪些新语言以及为未来的项目指定哪些技术时，您应该牢记这一点。
减少网络浪费对每个人都有好处
诚然，在我们的网络项目中消除浪费需要多加注意细节，但是当您这样做时，您可以创建不仅对环境更好，而且还能提供更快、更易于访问的用户体验的网络体验。谁不想要那样呢？
因此，也许您应该问自己 Urban Ore 的这个问题：“如果您不赞成零浪费，那么您赞成多少浪费呢？”
1 条评论