先测再改:30 秒拿到基线数据
别凭感觉改。先用 PageSpeed Insights(或浏览器自带的 Lighthouse)把首页和最重要的落地页各测一遍,电脑和手机端都测,记下三个数:性能得分、LCP(最大内容绘制时间)、页面总请求数。
判断标准很简单:手机端 LCP 超过 2.5 秒、性能得分低于 60,就值得动手;低于 50 就是在明显拖累询盘了。把这份基线截图存好,改完再测才有对比。
图片:最值得先动手的一项
中小企业的官网慢,图片往往是最重的拖累。逐页对照这四点检查:
- 导出尺寸等于显示尺寸。banner 在页面上只占 1200px 宽,就别放一张 4000px 的原图,浏览器会先下载再缩小,白白多花几秒。
- 单张压缩到 200KB 以内。首屏大图用 WebP 或压缩后的 JPEG,用 Squoosh 这类工具或建站后台自带的压缩功能即可。
- 写上宽高。给图片加 width 和 height 属性,页面加载时不跳动,测速工具也会给分。
- 首屏以下的图开懒加载。访客还没滚到的图,不必抢着下载。
改完图片先复测一次,很多站点这一步就能把 LCP 拉回 2.5 秒以内;没达标再看下一节的脚本问题。
脚本和第三方代码:逐个数,该删就删
打开浏览器开发者工具的 Network 面板,按加载耗时排序,前几名通常是统计代码、在线客服、在线地图、嵌入视频和自定义字体。对照下表逐个处理:
| 常见项目 | 判断标准 | 处理方式 |
|---|---|---|
| 统计/埋点代码 | 是否真的有人在看数据 | 没人看就删,要留就异步加载 |
| 在线客服组件 | 是否拖慢首屏渲染 | 改成异步或延迟加载 |
| 在线地图 | 首页是否必须展示 | 挪到联系页,首页放链接 |
| 自定义中文字体 | 单个字体文件大小 | 全量字体动辄数 MB,改用系统字体栈 |
两条通用原则:能异步(async/defer)就异步;不确定还要不要的第三方,先下线一周,没人反馈再加回来。
移动端:别只用电脑测
你的客户多半是手机上搜到你再点进来的,但很多官网只在电脑上调试过。用真手机或开发者工具的手机模拟过一遍:
- 正文和按钮字号不小于 16px,别让客户眯眼看;
- 可点区域(按钮、电话、菜单)不小于 44×44px,拇指能准确点到;
- 导航在手机上折叠成汉堡菜单,重点入口(产品、联系方式)仍一屏可见;
- 页面顶部放一键拨号或咨询入口,别让客户翻到底部才找到电话。
测完再开手机的省流模式跑一次,那更接近弱网下的真实体验。
改完之后:48 小时内做两次复查
第一步,复跑测速工具和基线对比:LCP 和性能得分有提升就记录下来,没变化说明瓶颈不在这里,回头查服务器和缓存配置。第二步,在统计后台对比改版前后 48 小时的跳出率和平均访问时长,确认改动真的被用户感知到。
提速不是一次性工程,建议每季度把这份清单重过一遍,尤其在上传新素材、新装第三方代码之后。如果你在用飞钉 AI 建站,图片会自动压缩并经 CDN 分发,后台的 SEO 巡检会提示超大图片和缺失的尺寸标注;到访咨询由 7×24 智能客服先接住,线索自动进入 CRM——你只管把站做快,后面的转化有人接着。