VOCABULARY / 词条
商品详情页
Product Detail Page
电商站点中呈现单件商品全部信息并完成购买决定的页面：通常由商品图片区、包含价格与加入购物车按钮的购买区、颜色尺码等规格选择、商品描述与参数、配送与退货说明、用户评价以及相关商品等部分组成。
识别特征
- 商品图片区与购买区（价格、规格选择、加入购物车）并置在页面上部
- 描述、参数、配送退货与评价等分成若干有标题的区块
- 规格选择改变时，图片、价格与库存随之更新
概念边界
判定标准是"一件商品、讲完它的全部属性、并在页内完成选择与加购"。它不是着陆页：着陆页只讲支撑一次转化所需的部分，并按说服顺序编排；详情页要回答购买前的各种疑问，用户会按自己的顺序跳读。它也不是主从布局：主从布局在同一屏同时保留可选列表与详情；详情页通常是从商品列表进入的独立页面，列表并不同屏保留。商品列表与对比表负责在多件商品之间挑选，详情页负责确认一件。页面上的价格、库存与评价必须真实：隐藏必然产生的费用、虚构的稀缺提示或伪造的评价属于反模式，不在本词条的做法之内。
什么时候考虑它
- 用户要在购买前确认一件商品的外观、规格、价格与配送条件
- 商品有颜色、尺码等需要在购买前选定的变体
- 其他买家的评价与问答对决定有实际帮助
什么时候慎用
- 目标是为一次推广活动说服新访客，而不是讲完一件商品的属性
- 用户需要在多件商品之间横向比较，此时应先提供列表或对比表
- 商品只有一种规格且信息很少，独立页面只是多了一次跳转
取舍
把一件商品的所有信息集中到一页，用户无需离开就能回答购买前的疑问；代价是页面很长，信息区块如何排列与折叠会直接影响用户能否找到评价、配送等关键内容，而同一模板要套用在信息量差别很大的商品上。
条件规则 · 编辑建议
相关词条
着陆页按说服顺序只讲支撑转化的部分，详情页要讲完一件商品并接受跳读；推广活动用前者，常设的商品目录用后者。
两者都是"列表选中一项、查看其详情"，但主从布局同屏保留列表，详情页通常是独立的一页；需要频繁在商品间切换时可考虑前者。
详情页负责确认一件商品，对比表负责在少数候选之间权衡；从详情页提供加入对比的入口，可以避免用户开多个标签页来回记忆。
详情页是用户做购买决定的地方；把必然发生的费用留到最后，会让这里的价格失去作为决策依据的意义。
来源与支持范围
Baymard 的公开研究介绍页称几乎所有用户在购买前都会经过商品页，并说明其研究据大规模可用性测试整理出 110 余条商品页指南，涵盖页面版式、商品图片、视频与 360 度视图、包含加入购物车按钮与价格的"购买"区、配送与退货、规格变体选择、商品描述、参数表、用户评价、问答等辅助内容以及交叉推荐等主题；详细结论多需付费访问。本词条的组成部分据此列出，不引用付费内容。
检索日期：2026-10-20 · 快照待确认Alan Blackwood 的这篇文章（2018 年 10 月 17 日发布，2026 年 7 月 8 日更新）报告，测试中用户常错过放在横向标签页里的评价、配送与参数等核心内容，因此建议商品页的主要区块不用横向标签页：桌面端用展开的纵向区块，内容较长的移动端页面可用可折叠区块。本词条的版式规则据此转述，标签页仍可用于某一区块内部的子分区。
检索日期：2026-10-20 · 快照待确认定义参考以上来源；数字界面示例、选择建议、条件关系及配方由本样例编辑，尚未经用户研究验证。
类型扩展与实现说明
本词条尚无可操作示例；插画为编辑示意，展示图片区、购买区与下方信息区块的关系，其中的商品、价格与评价均为虚构，不代表已验证的实现。应用到产品前仍须用真实商品数据检查各区块在信息量差异很大时是否仍然可读。
{
"states": [
"wide",
"compact",
"expanded",
"collapsed"
],
"a11y": [
"商品图片有说明内容的替代文本，图库可用键盘切换",
"规格选择控件有可朗读的名称与当前选中值，缺货状态不只靠颜色表达",
"价格或库存随选择变化时，以状态消息告知"
],
"motion": "图库切换可以有短暂过渡；减弱动态偏好下直接切换"
}打开本词条的 Agent JSON 文件这个文件原样收录本词条的全部字段，并附上来源、存档与编辑声明。