1.优化您的图像

图像（尤其是高分辨率照片）占平均网页大小的很大一部分。

这可能是我们工作的大多数网站的首要可持续性问题。幸运的是，优化图片是减轻网站重量的最简单方法。有几种方法可以做到这一点。

• 确保您的图像尺寸合适。Web 浏览器通常会缩放图像以适应设计。图像的大小不应超过它们打算使用的尺寸。例如，我们经常看到网站所有者使用巨大的 4000×4000 数码相机照片，但只在一个小画廊中使用它们，它们以该尺寸的三分之一显示。
• 通过压缩工具放置所有图像。在将图像添加到您的网站之前，请将它们通过压缩工具。我们喜欢使用Tiny PNG或Optimizilla。这些工具使用巧妙的压缩技术使您的文件更小，而不会明显降低视觉质量。
• 尽可能使用 CSS 或 SVG。使用这些技术，我们可以在网站代码本身中包含一些图形和视觉元素，而不是作为单独的下载文件。这在大小方面效率更高，并且还涉及对服务器的调用更少。这种技术更适合矢量图形和插图，因此我们经常在设计中优先考虑这些，而不是过度依赖摄影。

网站优化

2.不要展示不需要的东西

总是有展示比需要更多的内容的诱惑。在主页和登录页面方面尤其如此。每个部门都希望展示自己的信息，并以具有影响力的大形象作为补充。 

我们已经讨论过媒体内容的重要性。我们添加的越多，页面加载时间就越长。我们的页面加载时间越大，显示页面所需的能量就越多。 

不要让你的页面超出它的需要。我们看到许多主页非常长，并且塞满了大多数人永远看不到的促销活动。虽然人们不滚动是一个神话，但他们在获得所需内容后仍然不太可能继续滚动。

仔细考虑过度加载充满功能和促销的页面，尤其是当它导致大量滚动时。这也适用于主页轮播。大多数人不与他们互动，所以使用一个你可能会不必要地加载很多非常大的图像。 

养成定期评估页面内容的习惯。如果对它的有用性有疑问，请将其排除在外。如果您不确定页面上使用了哪些内容，哪些未使用，请尝试使用HotJar或CrazyEgg之类的热图工具。这些将显示页面的哪些部分正在被查看，哪些不是。您可以使用此洞察力来消除不必要的页面重量。不仅如此，您还可以通过专注于重要的事情来改善用户体验。

3. 适当时“延迟加载”内容 

延迟加载是延迟加载对象直到真正需要它们的技术。与我们的最后一点一致，这意味着我们不会为可能永远不会看到它们的用户下载资产。 

我们发现延迟加载在“列表”类型的页面上最有用，在这些页面中，用户会看到许多卡片可供滚动浏览。想想有几十个新闻故事、博客或其他资源的页面。其中许多将附带图像缩略图，因此直接下载该批次可能非常浪费。

设计师可以创造性地使用延迟加载的触发方式。例如，页面内容可以随着用户滚动而逐渐加载。或者，我们可以只显示列表中的前几个对象，然后有一个“显示更多”按钮来加载下面的其他对象。

6.有缓存解决方案

Web 缓存意味着下载和保存网站上多个页面共有的元素。这意味着如果用户查看多个页面或多次访问该站点，他们不需要重新下载页面之间共享的对象。这将包括站点范围的 CSS、JavaScript 文件和某些组件，例如页眉和页脚。 

通过有效地使用缓存，您将显着减少查看多个页面的人向 Web 服务器发出的请求数量。对于鼓励重复会话并具有许多页面浏览量的网站，随着时间的推移，这可能会产生巨大的影响。

在某些情况下也可以考虑渐进式 Web App 技术。这种方法允许移动用户体验网站的简化版本，提供更像应用程序的体验。渐进式 Web 应用程序的精简方法可以从根本上减少加载时间和对服务器的需求，这在可持续性方面是一件好事。