IMG.DIY / 电商工具 / 商品页体检

商品页体检

贴一个商品页 URL,拿到 Lighthouse 分数、图片体积诊断和电商最佳实践清单。

商品页体检 visual example
隐私优先:任何文件都不会被上传。

从原图到结果,一眼看懂

选择文件、完成处理、下载结果。全部在浏览器本地完成。

商品页体检: 1 · 选择原图
1 · 选择原图
商品页体检: 2 · 调整与处理
2 · 调整与处理
商品页体检: 3 · 下载结果
3 · 下载结果

又慢又重的商品页是在直接丢单。这个工具调用 Google 官方 Lighthouse(PageSpeed Insights API)体检你给的任何 URL,并专门提取电商关心的部分:Core Web Vitals、图片浪费了多少 KB、标题层级、SEO 基础项和无障碍。

自动报告下面还有一份手工整理的商品页清单——CTA 位置、信任要素、移动端体验——这些机器打不了分,但设计师应该逐项过。

使用方法

  1. 贴入 URL任何公开可访问的商品页,选移动端或桌面端。
  2. 看报告四项分数、Core Web Vitals、图片可节省体积和结构审计,约 30 秒出结果。
  3. 过清单对照报告下方的电商人工检查项逐条打勾。

给任意商品页跑一次真实的 Lighthouse 体检

粘贴一个公开网址,这个工具就通过 PageSpeed Insights API 跑 Google Lighthouse,返回四项熟悉的评分:性能、无障碍、SEO 和最佳实践。它用的就是 Google 自家报告背后的同一套引擎,分数和搜索团队实际看的对得上。

你会拿到对排名和体验都关键的核心网页指标 LCP、CLS、TBT、FCP,还有图片可压缩空间、标题结构和 SEO 审计的拆解。页面上线前或交给客户前,拿它做一次快速体检正合适。

不止是分数:一份电商最佳实践清单

Lighthouse 的原始分数能告诉你页面慢,却不一定说清为什么不转化。在审计之上,这个工具还加了一份手写的电商清单,覆盖 CTA 是否清晰、信任背书、移动端表现和结构化数据(schema),帮你抓住 Lighthouse 不打分的东西。

如果撞上共享的调用限额,可以在可选字段里填自己的 Google API key。这个 key 只存在你的浏览器里,用来提高配额,测试量大的日子也不会被限流。

大家都用它来做什么

上线前商品页检查 — 新商品页或落地页上线前先审计一遍,尽早抓出速度和 SEO 问题。

核心网页指标排查 — 查看某页的 LCP、CLS、TBT、FCP,找出是哪个指标在拖低分数。

图片体积清理 — 看图片可压缩报告,找出拖慢加载的超大图。

给客户和代理商出报告 — 拉一份客观的 Lighthouse 评分和清单,清楚告诉客户该改什么。

对标竞品页面 — 对竞品的公开网址跑同一套审计,速度和 SEO 直接对比。

无障碍抽查 — 拿到无障碍评分和审计清单,评审前先抓出明显的障碍。

转化就绪度评估 — 用电商清单核对 CTA、信任背书和移动端布局是否到位。

大量测试不被限流 — 填上自己的 Google API key,一次跑很多审计也不会撞共享配额。

页面一慢,还没等人读完描述,单子就丢了

在商品页上,每一秒加载时间都能换算成流失的转化。用移动流量的买家,页面一卡就走人,而搜索排名也把速度算进去,所以一个重的页面让你亏两次——来的人更少,留下的也更少。电商页面上最常见的元凶是图片:一张没优化的主图、一叠原图分辨率的画廊照片、再加一张长详情图,能悄悄给一个本该很轻的页面塞进好几兆。问题在于,"我这页感觉慢"只是个直觉,而直觉修不了。你需要数字,而且要把数字指向卖家真正能改的东西。

Google 的 PageSpeed Insights 跑的是 Lighthouse,能给你这些数字,它成为行业参照是有道理的。但它的原始报告是给网页开发者看的——它把渲染阻塞脚本、主线程耗时和图片问题混在一起列出来,也不会围绕一个 listing 真正在意的东西来组织。GTmetrix 在类似数据上套了个更好看的仪表盘,但同样是通用型的。卖家想要的是同一个可信引擎,再加一层电商视角:我的图片到底多重、这个页面能不能过那份真正影响转化的清单?

这个页面检测工具调用 Google 的 PageSpeed Insights API——同一个 Lighthouse 引擎——并把结果按卖家的优先级摆在前面:性能得分、一份图片体积报告(显示页面里图片占了多少、哪几张该压缩),以及一份覆盖 listing 常见疏漏的电商清单。它是在一个你可以信任的来源之上加了一层聚焦的视角,而不是自己发明一套评分。有一点要说清楚:这个工具需要联网。 它要查询 Google 的服务器来跑检测,所以和这里其他工具不同,它无法离线用——这是它工作方式里诚实且无法回避的一部分。

它的不同之处

  • Google 的引擎,卖家的视角。 分数来自 PageSpeed Insights / Lighthouse——那个标准参照——只是围绕在线卖家能动手的东西重新组织了一遍。
  • 图片体积报告。 看清页面里有多少兆是图片、具体哪几张是大头,你就明确知道该把什么丢进压缩或改尺寸工具。
  • 电商清单。 在原始指标之上,叠一份针对商品页常见疏漏的实用检查。
  • 来源可信,不是黑盒。 它报告的是 Google 的数字,而不是一套你无从核实的自造评分。
  • 免费、免注册。 可选填 API key,跑很多次检测时能避开共享的公共配额。
  • 诚实的限制:需要联网。 它调用 Google 的 API,所以不能像纯浏览器工具那样离线运行。

IMG.DIY 与其他页面工具对比

IMG.DIY 页面检测 PageSpeed Insights(原始) GTmetrix
底层引擎 Google Lighthouse(PSI API) Google Lighthouse 基于 Lighthouse
电商清单
图片体积聚焦 有,卖家视角 有但被埋没
视角 卖家优先级 面向开发者 通用网页性能
价格 免费 免费 免费档 + 付费
注册 无(可选 API key) 存历史需注册
是否需联网 需要——必需 需要 需要

平心而论,如果你看得懂开发者报告,原始的 PageSpeed Insights 什么都给你,而且权威——这个工具就坐在同一个引擎上。GTmetrix 提供历史追踪和精致的仪表盘,对持续监控确实有用。而这个工具补上的是电商视角:它拿 Google 可信的测量结果,指向图片体积和一份卖家清单,让输出读起来是"你的 listing 该修这些",而不是"这里是一墙网页性能指标"。只是记住它需要联网——它是这里唯一一个按设计就无法离线的工具。

为什么选 IMG.DIY

真 Lighthouse

Google 官方审计引擎,不是仿制品。

图片专项

明确告诉你图片浪费了多少 KB、怎么修。

电商清单

CTA、信任、移动端、结构化数据等机器打不了分的项。

无需密钥

从你的浏览器直连 Google 公开 API。

常见问题

和 PageSpeed Insights 有什么区别?
用的是同一个 Google API,但加了电商视角:图片体积提取、结构审计和商家清单合成一屏。
为什么体检失败?
URL 必须公开可访问。共享 API 有频率限制,遇到 429 等一分钟再试。
分数多少算合格?
90+ 绿色最理想;移动端 70+ 且 LCP <2.5s 已经超过大多数店铺。优先看图片可节省那一行,通常是最便宜的提升。
查出图片问题怎么办?
报告会给出优化/现代格式/响应式图片的可节省总量——然后直接用本站的压缩和转换工具修掉。
这个分数到底是怎么来的?
它是通过 PageSpeed Insights API 跑的真实 Google Lighthouse,就是 Google 自家 PageSpeed 报告背后的同一套引擎。你会拿到性能、无障碍、SEO、最佳实践评分和核心网页指标。
它会报哪些核心网页指标?
会报 LCP(最大内容绘制)、CLS(累计布局偏移)、TBT(总阻塞时间)和 FCP(首次内容绘制),都是 Google 衡量页面体验的指标。
必须有 Google API key 才能用吗?
不用。默认用共享配额就能跑。那个可选的 API key 字段只是给测试量大、想避开共享限额的人用;key 存在你的浏览器里,不会发到别处。
能测任何网站还是只能测自己的?
任何公开可访问的网址都行,既能审计自己的页面,也能对标竞品。登录后才能看或有防火墙的页面,PageSpeed 服务访问不到。
为什么分数和浏览器 DevTools 跑的不一样?
PageSpeed Insights API 是从 Google 的环境测的,用它自己的网络和设备配置,所以和你本机、本地网络上用 DevTools 跑的 Lighthouse 会有差异。
电商清单比 Lighthouse 多给了什么?
它是一份 Lighthouse 不打分的转化要素手写清单:CTA 是否清晰、信任背书、移动端表现和 schema 标记,让你评估的是销售就绪度,而不只是技术速度。

相关工具

相关教程