PageSpeed Insights 满分攻略

这次设计的主题还有一个小小的意外，那就是Google PageSpeed Insights（PSI）竟然拿到了4个100分的满分，有心栽花花不开，无心插柳柳成荫啊。

PSI

PageSpeed Insights（PSI） 是 Google 提供的免费网页性能分析工具，用于评估网站加载速度和用户体验，并提供具体的优化建议。它是目前网站性能优化和 SEO 工作中最常用的工具之一。

它的评分系统主要有四个指标：

维度	中文名	评估内容
Performance	性能	页面加载速度、交互响应、视觉稳定性（核心）
Accessibility	无障碍	是否对残障用户友好（如图片 alt 属性、对比度、键盘导航）
Best Practices	最佳实践	是否遵循 Web 开发的安全和性能最佳实践（如 HTTPS、安全漏洞）
SEO	搜索引擎优化	页面是否对搜索引擎友好（如移动适配、meta 标签、结构化数据）

如何使用

1. 访问工具：https://pagespeed.web.dev/ 输入网址：粘贴需要分析的页面 URL，点击"分析"

2. 在 Chrome 浏览器中按 F12 → Lighthouse 标签页生成报告。

PSI作用是什么？

自 2021 年 5 月起，Core Web Vitals 成为 Google 搜索排名因素 。良好的 PSI 分数意味着：

• 更好的搜索排名
• 更低的跳出率
• 更高的转化率（电商网站研究显示，页面加载每慢 1 秒，转化率可能下降 7%）

所以，如果你还在使用感觉或是一些ping值来评估网站的打开速度和用户体验，那么我推荐你试试PSI。

我的PSI

上图是2023年8月份的一次截图，当时我的博客应该是部署在Github，性能方面因首页面的健在元素过多和文件过大，造成了性能分值极低。同时，我也没有在意无障碍和SEO，导致了整体分数极低的状态，以至于后来我在Google的索引以及排名一直在降低，桌面版的核心网页指标也全部丢失了。这里不再多说，

感兴趣的请点传送门： 关于Google LCP 问题：超过了2.5秒 验证已通过

这次主题设计完成之后的评分是这样的

该死的强迫症又犯了，然后查看了具体的原因如下：

还好，修改难度极低，直接按着要求修改了，然后重新部署，刷新测试，桌面版满分，移动端除了性能92分之外，其他三项也都是满分。

总结

PageSpeed Insights（PSI）真是网站主的极简设计的精简利器，因为你需要精简页面上无用的元素和功能。元素和功能越多，网站就越不受你的控制，因为过多的依赖会导致很多不确定的因素，过度的元素会导致页面的HTML、JavaScript代码过于臃肿，结果就是有些并不是你自己弄的东西会莫名地给你的指标减分。

当然，不要追求100分：90+分已属优秀，边际效益递减，需权衡开发成本。但是，良好的网站加载速度和用户体验不光是对来访者提供更好的浏览体验，还可以提高网站的SEO，方便搜索引擎的索引。

Google PageSpeed Insights（PSI）并不是网站评分的最终指标，他只是一个侧面的参考，有Google定制的一个业内标准。而网站的极简设计也并不只是页面的颜色和内容，还有很多的设计和功能细节值得我们反复推敲，设计的目标是什么？网站的初衷是什么？每个站长或许都不一样，但是，好的设计风格和浏览体验，用户一定会有真实的反馈的。