为什么不推荐过多的在网页上使用滑块（Slider）？

网页上使用滑块（Slider）是一种很炫酷的设计，很多设计师喜欢用这种方式展现一些重要内容。但滑块（或轮播）会让网页的加载性能大幅降低，而且对于SEO来说，它的附加价值几乎为零。站长帮网站上就没有采用这样的设计。

为什网页上使用滑块（Slider）不利于性能？

有些时候，网页设计的美观与性能是对立的。网页上使用滑块（Slider）可能很漂亮但也较慢。

因为任何一个滑块，会增加以下性能负担：

• 额外的 JavaScript
• 更多的 CSS 样式
• 大幅增加网页的HTML代码

那么导致的结果就是：

• 带来更多的 HTTP 请求
• 增加页面加载时间

用专业的Core Web Vitals性能分析的话，结果就是：

• CLS （Cumulative Layout Shift）– 许多滑块在视觉上不稳定，这可能导致 CLS 等级不佳。
• FID （First Input Delay）– 滑块一般都包含大量 JavaScript 文件，这会延迟执行时间，主线程会变得繁忙和阻塞。
• LCP（Largest Contentful Paint） – 页面的 LCP 元素通常可以在首屏图像滑块中找到。 如果这些滑块未正确优化，则会对 LCP 产生负面影响。

Core Web Vitals 报告根据真实世界的使用数据 （有时称为现场数据）显示页面的执行 情况。

如何正确对待滑块（Slider）？

以上是从性能角度来看待网页上使用滑块（Slider）的影响，这不能得出网页禁止使用它的结论，但可以让我们明白，它确实会影响性能。

笔者作为网页设计从业人员，经常为客户设计网页。在客户不考虑上文提到的这些性能因素的话（大多客户是不了解这些的），将使用了炫酷的滑块（Slider）的网页设计方案交付给客户总是会得到肯定，相反另一个性能卓越的方案但看起来平平无奇。

网页做出来就是给人看的，哪怕它的性能不是最优方案，也一定要能吸引访客的眼球。

一般而言，网页上的重要产品、重要信息、头版头条等，可以使用滑块（或轮播）来增加用户的关注度。但切记不要在同一个网页上多处使用，否则网页再精美，也没人会愿意等待几秒甚至十几秒才能看到这些内容。

WordPress优秀的滑块插件：