毕瑞出海BerightDigital微信扫码关注，视频和文章同步更新说明：本文部分工具链接是联盟链接，通过链接购买我们可能获得佣金，你的价格不变。文中先介绍免费做法，付费工具只在确实能省时间时推荐。
Google 用 Core Web Vitals（核心网页指标）衡量网页的用户体验，它是排名因素之一，也直接影响转化率：页面加载慢、点按钮没反应、内容乱跳，用户很容易离开。
很多新手用 PageSpeed Insights 测一下，看到一堆红色的分数和英文术语，不知道从哪里改。这篇文章只讲三件事：
- LCP、INP、CLS 分别是什么；
- 多少算合格，去哪里看自己的数据；
- 独立站最常见的问题和修复方法。
三个指标和合格标准
| 指标 | 全称 | 衡量什么 | 良好 | 需要改进 | 差 |
|---|---|---|---|---|---|
| LCP | Largest Contentful Paint，最大内容绘制 | 主要内容多快显示出来 | ≤ 2.5 秒 | 2.5–4 秒 | > 4 秒 |
| INP | Interaction to Next Paint，下次绘制交互 | 点击、输入后多快有反应 | ≤ 200 毫秒 | 200–500 毫秒 | > 500 毫秒 |
| CLS | Cumulative Layout Shift，累积布局偏移 | 页面内容有没有乱跳 | ≤ 0.1 | 0.1–0.25 | > 0.25 |
Google 用的是真实用户数据的第 75 百分位：也就是说，要有 75% 的访问达到「良好」，这个网页才算合格。三个指标都达到「良好」，才算通过 Core Web Vitals 评估。
INP 在 2024 年 3 月取代了原来的 FID（首次输入延迟），一些老教程里还在讲 FID，可以忽略。
LCP：主要内容多快出来
LCP 记录的是首屏里最大的那块内容（通常是首图、轮播图或大标题）完成显示的时间。商品页和首页的大图是最常见的 LCP 元素。
INP：点了之后多快有反应
用户点击「加入购物车」、展开菜单、选择尺码之后，页面多久给出视觉反馈。INP 差的页面，通常是 JavaScript 太多太重，浏览器忙着执行脚本，没空响应点击。
CLS：内容有没有乱跳
你正准备点一个按钮，上面突然加载出一张图片或一条横幅，按钮被挤下去，你点到了别的东西。这种内容位移会被累加成 CLS 分数。
去哪里看：实验室数据和真实数据
测速工具会给你两种数据，一定要分清：
| 真实用户数据（实地数据） | 实验室数据 | |
|---|---|---|
| 来源 | Chrome 用户报告（CrUX），过去 28 天真实访问 | 工具模拟一次加载 |
| Google 排名用哪个 | 用这个 | 不用 |
| 适合 | 判断是否合格 | 找具体原因、测试修改效果 |
常用的三个免费工具：
- Search Console →「体验」→「核心网页指标」：按移动端和桌面端，列出哪些网址「差」「需要改进」「良好」。同类页面会被归为一组，适合找出整站问题。
- PageSpeed Insights（pagespeed.web.dev）：输入单个网址，上半部分是真实用户数据，下半部分是实验室数据和具体的优化建议。
- Chrome 开发者工具 → Lighthouse / 性能面板：适合开发者逐项排查。
小网站访问量不够时，PageSpeed Insights 可能显示「没有足够的真实用户数据」，这时只能先参考实验室数据。
独立站最常见的问题和修法
LCP 慢
| 原因 | 修法 |
|---|---|
| 首图太大 | 压缩并转成 WebP 或 AVIF，按显示尺寸裁剪，不要把 3000 像素的图缩小显示 |
| 首图被懒加载 | 首屏的大图不要加 lazy loading，可以加 fetchpriority=”high” 优先加载 |
| 服务器响应慢 | 开启页面缓存和 CDN；共享主机长期很慢，考虑升级主机 |
| 字体、CSS 阻塞渲染 | 减少字体文件数量，移除用不到的 CSS 和插件 |
INP 差
| 原因 | 修法 |
|---|---|
| 插件和第三方脚本太多 | 盘点聊天插件、弹窗、追踪代码，删掉不用的，能延迟加载的延迟加载 |
| 页面构建器生成的代码过重 | 精简页面元素，避免一个页面堆叠太多动画和小工具 |
| 大型轮播、筛选器脚本 | 换成更轻量的实现，或只在需要的页面加载 |
CLS 高
| 原因 | 修法 |
|---|---|
| 图片、视频没写宽高 | 给图片和嵌入内容设置宽度和高度，或用 CSS 预留比例 |
| 顶部横幅、Cookie 提示后加载 | 预留固定空间，或改成浮层不挤压内容 |
| 网页字体替换导致文字跳动 | 使用 font-display: swap 并选择尺寸接近的备用字体 |
| 广告位、评价组件动态插入 | 给容器设置最小高度 |
修复后怎么确认
- 用 PageSpeed Insights 的实验室数据确认改动有效。
- 在 Search Console 的核心网页指标报告里，对已修复的问题点击「验证修复」。
- 真实用户数据是过去 28 天的滚动统计，通常要等几周才会完全反映出来，不要第二天就判断没效果。
WordPress 网站的完整优化步骤（缓存、图片、插件、CDN 设置），可以按我们的 WordPress 网站速度优化 SOP 一步步做。
主机要不要换
缓存、图片、插件都优化过了，服务器响应时间（TTFB）仍然经常超过 1 秒，问题多半在主机。便宜的共享主机在流量高峰时很容易变慢。
- Cloudways：托管云主机，可以选择 DigitalOcean、Vultr 等服务器，自带服务器级缓存，适合有一定流量的 WordPress 和 WooCommerce 站点。
- Hostinger：价格较低，适合刚起步、流量不大的新站。
换主机之前，先用测速工具记下当前的 TTFB 和 LCP，换完再测一次，用数据判断是否值得。
总结
- LCP ≤ 2.5 秒、INP ≤ 200 毫秒、CLS ≤ 0.1 才算良好。
- Google 看的是真实用户数据的第 75 百分位，以 Search Console 报告为准。
- LCP 先查首图和服务器，INP 先查脚本，CLS 先查没写尺寸的图片和后加载的横幅。
- 更多检查项见 独立站 SEO 体检清单，指标定义见 指标库。
