网页设计是一个既需要技术知识又需要风格感的领域。我们不仅要设想出完美的页面；我们还必须建造它。
这种阴阳两面性是一种挑战。你如何创建一个看起来很美的网站，同时又能保持峰值性能？
多年来，这种平衡似乎一直在向前者倾斜。我在自己的旅程中也面临过这个问题。例如，尽管我知道那张巨大的图片会拖累加载时间，但它看起来就是那么好。
但是，在现代网络上，如果任何视觉上的增强意味着对性能的重大打击，那么是否值得实施？如果有正确的方法，你不应该这样做。
性能与以往一样重要
这感觉有点讽刺。硬件继续以更强大的方式发展。即使是手机也有多个处理器内核和大量的内存。更不用说宽带已经变得越来越普遍。
然而，我们仍然被告知要挤出每一个可能的毫秒的加载时间。为什么呢？
归结为两个原因：注意力短暂和谷歌。首先，用户往往不会为一个缓慢的网站加载而停留。他们会在其他地方找到他们要找的东西。
而且，随着谷歌的核心网络指标现在影响着搜索排名，那么，性能是一个相当大的问题。它可能是被发现或永远消失在搜索引擎结果的阴暗区域之间的区别。
此外，网络不再是一个新鲜事物。认为用户会等待你花哨的介绍（#RIP Flash）是不现实的。
人们访问你的网站是为了一个特定的目的。因此，任何妨碍他们的东西可能都不值得实施。
现代CSS和JavaScript技术提供了坚实的替代方案
作为一个设计师，我们很容易养成使用庞大的媒体文件来增强网站外观的习惯。几十年来，这一直是做事的方式。无论是全屏图像还是视频背景，这些项目都可以起到改变作用。然而，它们也可能妨碍性能。
值得庆幸的是，现代CSS和JavaScript可以提供更好的替代品。每一种功能都可以取代媒体，或者使这些文件更容易被浏览器消化。
像CSS梯度和混合模式这样的视觉效果就是很好的例子。它们看起来和你在Photoshop中制作的任何东西一样好，但没有所有多余的臃肿。
如果你想增加动作，CSS动画和JavaScript库（如GSAP）可以满足你的要求。它们不仅可以产生令人瞠目结舌的外观，而且这些技术也是闪电般的速度。
此外，懒惰加载提供了一个很好的妥协--至少对于不在页面初始视口内的媒体而言。包括图像和iframe在内的元素只有在需要时才会加载。这节省了加载时间，同时仍然可以使用这些资产。本地浏览器的支持使得实施比以往更容易。
巧妙地使用这些技术可以帮助你避免为了外观而拖累性能。相反，你会实现一个更可持续的平衡。
美丽和性能可以共存
一个网站不仅仅是它的外观、内容或功能本身。它是一个有凝聚力的用户体验。这意味着这些方面中的每一个都必须结合起来为用户服务。
为了有效地做到这一点，一个网站也必须优先考虑性能。几年前，一个外观漂亮但加载缓慢的网站可能会更容易被接受。在强大的设备和快速的互联网之前，速度不一定是用户的期望。
这一点已经发生了巨大的变化。我们现在生活在一个随需应变的世界里，我们所需要的一切都只需点击一下就能得到。如果你的网站不能兑现这一承诺，就很难与访问者建立持久的关系。
网站设计师需要随着这些期望而改变。在实践中，这要求我们对我们创造的视觉元素以及如何实现它们进行长时间的思考。按照我们一直以来的做法做事可能不再可行。
相反，一切都必须着眼于最佳性能。这是一个挑战，肯定的。好消息是，我们有正确的工具和技术来实现它。
