← 文档中心
Page Types · 页面类型清单
页面类型
v0.4 · 去分级
把 ia v0.2 sitemap 里的 60+ 页面归到 10 个页面类型(PT-01 ~ PT-10)。每个 PT 定义:实例页清单、模块槽位、信息密度、CTA 路径、视觉特征、主旅程对应。这是 wireframe 的前置——下一步画 wireframe 时,从 PT 模板直接展开,不必每页从零重新设计。brand-thesis 是对外讲什么、product-framework 是对内做什么、ia 是页面挂在哪——本文档是页面长什么样的根。
VERSION v0.3 · draft
DATE 2026-05-19
OWNER Kevin Wang
BASED ON ia v0.4 实际 SKU + brand-thesis v0.7 + Deco book PDP 范式
10 个 PT · 已定型
取消 Good/Better/Best · 旗舰/新机标签
模块槽位 · 草稿
CTA 路径 · 草稿
下一步 · 模块系统
在画 wireframe 之前——团队需要先共同知道:60+ 页面只能归到 10 种类型。每种类型有一套统一的模块槽和 CTA 路径——这样 wireframe 不必每页重发明。
这份文档不是 wireframe、不是视觉设计。它是页面类型的模板蓝图——每个类型给出"包含哪些页面 / 顶部到底部哪些模块槽 / 主 CTA 和退路 / 信息密度多少 / 视觉走 Deco book 主调还是其他"。
从 IA v0.2 到 PT v0.1 的归类逻辑 · IA 把所有页面挂到 6 槽位 + 子域骨架——这是位置层。PT 把所有页面按"组织信息和触发动作的方式"聚类——这是形态层。位置不同的页面可能同 PT(Deco PDP 和 Archer PDP 都是 PT-04)· 同位置的页面可能不同 PT(Support hub 和 /support/symptoms 一个是 PT-07 hub 一个是 sub)。
跟 wireframe 的关系 · 一个 PT 一个 wireframe 模板 · 实例页是 wireframe 的填充。下一步维度 4 · 模块系统 把跨 PT 共用的模块(GM-01~10 + 新增组件)单独沉淀为可复用组件。
Part 01
10 个 PT 总览
先看横截面——10 个 PT 各自服务的旅程、信息密度、实例数。然后 Part 02 逐个 PT 展开模块槽位。
| PT |
类型名 |
实例数 |
密度 |
主旅程 |
关键模块槽数 |
| PT-01 | Home · 全站门面 | 1 | 中 | A/B/C/D | 7 |
| PT-02 | Brand Landing · 一级品牌入口 | 3 | 中-高 | B | 7 |
| PT-03 | Generation Landing · 代际门面 · 多代际并行 | 4-6 | 高 | B | 7 |
| PT-04 | PDP · 具体 SKU 详情 | 10+ | 高 | BDC | 16 |
| PT-05 | Education · 教育/趋势页 | 5+ | 中 | AB | 8 |
| PT-06 | Decision Tool · Quiz / Compare | 2 | 低-高 | B | 5-7 |
| PT-07 | Support Hub & Sub · 服务入口 | 7 | 低-中 | C | 6-8 |
| PT-08 | Story / Press · 编辑性内容 | 4+ | 中 | A | 6 |
| PT-09 | Trust Page · 信任 hub + sub | 6 | 低-中 | A | 5-7 |
| PT-10 | Account Dashboard · "我的 X" | 4+ | 高(数据) | CD | 5 |
Part 02
10 个 PT 详细模板
每个 PT 给出:实例页清单、模块槽位(顶到底)、CTA(主/次/退)、视觉特征、主旅程对应。模块槽位标记 GM-XX = 全局跨页模块(从 IA v0.2 复用),PT 独有 = 仅本 PT 使用。
01
Page Type · 01
Home · 全站门面
用户进入 tp-link.com/us/ 的第一接触点 · 一句话主张落地 · 引导分流到 4 条旅程之一
实例页
/
模块槽位 · 顶到底
Sticky 顶导 · 6 槽位 + tp-link ID + Bag + SearchGM-01
Hero · "Wi-Fi you can count on." + "In every room. Every day." + Hero film/loop · Deco book 视觉调子Deco 主调
型号 showcase · Deco 8 / Pro / Ultra 三张大卡 · 各跳对应 PDPPT 独有
Why TP-Link strip · 1.7B 设备 + FCC 合规 + 30 年专注 + HomeShield 内置 · 4 图标 + 短语GM-08 Trust strip
Selector entrance · "Find your Deco" · 跳 /deco/quizPT 独有
Stories preview · 3 张文章卡 · 跳 /storiesPT 独有
Footer · 7 列分组 + 国家切换 + LegalGM-07
CTA 路径
主 CTA
Explore Deco 8 · /deco/8
次 CTA
Take Quiz · /deco/quiz
退路
Stories / Support / Trust
02
Page Type · 02
Brand Landing · 一级品牌入口
用户从顶导点 Deco/Archer/RE 进来的第一停留 · 介绍品牌承诺 + 当前主推代际 + 选购入口
实例页
/deco/archer/range-extender
模块槽位
Sticky 顶导GM-01
Brand hero · 品牌 promise + 一张代表性 lifestyle 图 · "Wi-Fi you can count on." 子品牌语境品牌调子
Generation/型号 card grid · Deco 8 / Pro / Ultra · 或 Archer BE / AX · 或 RE 子分类PT 独有
Why this brand · 为什么选 Deco / Archer · 教育模块 · 跳 PT-05 深入PT 独有
Selector entrance · Quiz/Compare 入口PT 独有
Trust stripGM-08
FooterGM-07
CTA 路径
主 CTA
Choose your model · 跳 PT-03 或 PT-04
次 CTA
Take Quiz · /deco/quiz
03
Page Type · 03 · v0.2 修正
Generation Landing · 代际门面 · 多代际并行
每个 Wi-Fi 协议代际有自己的代际 landing · Deco 当前 4-6 个并存(Wi-Fi 8 / 7 / 6 / 6E)· 各自讲代际故事 · 各代际型号平铺(不分档) · 技术基础铺垫
实例页 · Deco 4 代际并行
/deco/8 (Wi-Fi 8 · 新旗舰 · 3 SKU)
/deco/7 (Wi-Fi 7 · 销量主体 · 6 SKU)
/deco/6e (Wi-Fi 6E · 中端 · 3 SKU)
/deco/6 (Wi-Fi 6 · 入门 · 6 SKU)
/archer/be / /archer/ax (Archer 同样代际并存)
模块槽位(每个代际 landing 通用)
Sticky 顶导 + Breadcrumb · Deco › Wi-Fi 8 / Deco › Wi-Fi 7 等GM-01 + GM-10
Generation hero · 该代际的故事 · Wi-Fi 8 讲"reliability shift" / Wi-Fi 7 讲"已被验证的旗舰性能" / Wi-Fi 6 讲"经济实惠的全屋覆盖"PT 独有
Model grid · 该代际型号平铺,不分 Good/Better/Best 档(对齐 ia v0.5)· 旗舰/新机标签可标 · 跳对应 PDP跨代际
Tech foundation · 该代际的核心技术(Wi-Fi 8:StabilityEngine / Wi-Fi 7:6 GHz tri-band / Wi-Fi 6:经过验证)PT 独有
Compare 跨代际 strip · "Compare Wi-Fi 8 vs 7" 跳 PT-06 · 帮用户跨代际决策PT 独有 · v0.2 新
FAQ · 代际共性 + 跨代际("我该选哪代?")PT 独有
Trust strip + FooterGM-08 + GM-07
CTA 路径
主 CTA
Choose your model · 跳 PT-04 PDP(本代际内)
次 CTA
跨代际 Compare · 跳 /compare
退路
Why this generation? / Take Quiz
04
Page Type · 04
PDP · 具体 SKU 详情
4 条旅程的核心交叉点 · B 终点(选定具体 SKU)+ D 起点(BUY NOW)+ C 入口(已购用户的 Support)· 模块密度最高
实例页
/deco/8/standard/deco/8/pro ★/deco/8/ultra/deco/7/be25/deco/7/be63/deco/7/be85 ★/deco/7/be95/deco/6e/xe75/deco/6e/xe200/deco/6/x55/deco/6/x90/archer/be/be800
v0.3 实际 SKU · PDP 跨 4 代际并存。Hero:Deco 8 Pro(★ Wi-Fi 8 Hero · 16G)+ Deco 7 Elite BE85(★ Wi-Fi 7 Hero · 22G)。V1 launch 时 Wi-Fi 7 PDP 是销量主体(BE85/BE63/BE25 改造)· Wi-Fi 8 PDP 是新建主推。每代际的 PDP 共用 16 模块槽 · hero/视觉按代际差异化。
模块槽位 · 顶到底
Sticky 顶导 + 面包屑 · Deco › Deco 8 › ProGM-01 + GM-10
Hero · 产品名 + 旗舰/新机标签 + 一句话 positioning(Deco book shelf line)+ 大产品图Deco book
Buy strip(sticky 侧栏) · BUY NOW(跳 store.tp-link.com/cart) + DTC 价格嵌入(B1 拍板) + Amazon 次选 + HomeShield 守护标GM-09
Key benefits · 4-5 个 benefit-first 卖点 · 每个先讲"对你意味着什么"再讲技术(brand-thesis Principle 05)PT 独有
User scenario · The Upgrader/Juggler/Builder 对应 · 来自 Deco bookDeco book
Tech specs · 折叠式 · 完整规格 · benefit 翻译过的(brand-thesis "spec wrapped in narrative")PT 独有
AI capabilities · StabilityEngine™ / Auto QoS / AI ECO / AI setup · brand-thesis 4 pillars 之一PT 独有
HomeShield anchor · "Protected by HomeShield" + 跳 /homeshieldGM-06
Setup walkthrough · 3-4 步配置 · App-guided AI setupPT 独有
What's in boxPT 独有
Comparison teaser · "Compare with Pro/Ultra" 跳 /comparePT 独有
Reviews · 评分 + UGC 摘要PT 独有
Related products · cross-sell 同代际其他型号PT 独有
Support links · "已购?" 跳 /support/product + "我的 X"入口GM-03
FAQ + Trust strip + FooterGM-08 + GM-07
CTA 路径
主 CTA
BUY NOW · 跳 store.tp-link.com/cart
次 CTA
Buy on Amazon · 跳 AMZ trackable
退路
Compare / Support / Related
05
Page Type · 05
Education · 教育/趋势页
"为什么这事重要" + "我们怎么解决"——建立认知 · 引导到 PT-04 PDP · 旅程 A 信任的高级阶段 + 旅程 B 选购前的认知准备
实例页
/deco/why-mesh/archer/why/wifi-8/why-tp-link/homeshield
模块槽位
Sticky 顶导 + 面包屑GM-01 + GM-10
Topic hero · 大字 · "为什么 X 重要" + 一段 manifestoPT 独有
Problem setup · 当前的问题/挑战 · 数据 + 用户场景PT 独有
Our answer · 我们的解决方案 · 高层概念PT 独有
Evidence chain · 数据/技术/案例支撑PT 独有
Product landing · "看相关产品" 跳 PT-03 或 PT-04 多个PT 独有
FAQ + Related storiesPT 独有
Trust strip + FooterGM-08 + GM-07
CTA 路径
主 CTA
See products · 跳 PT-03 PT-04
次 CTA
Take Quiz · /deco/quiz
退路
Related stories / Trust
06
Page Type · 06
Decision Tool · Quiz / Compare
主动辅助决策 · Quiz 给不会选的人推荐 · Compare 给会选的人对比 · 两种工具服务不同决策风格
实例页
/deco/quiz/compare
Quiz 模块槽位
Sticky 顶导GM-01
Quiz hero · "Find your Deco in 60 seconds" + step indicator(Step 1/5)PT 独有
Question card · 单题选项 + Back/NextPT 独有
Result page · 推荐 PDP(主+次)+ 推荐理由 · 跳 PT-04PT 独有
FooterGM-07
Compare 模块槽位
Sticky 顶导GM-01
Compare hero · "Compare Mesh / Routers" + SKU selector(最多 4 个)PT 独有
Big table · 规格 / 价格 / 适合谁 · 高亮差异行PT 独有
CTA row · 每个 SKU 一个 BUY NOW + 跳 PDPGM-09 mini
FooterGM-07
CTA 路径
主 CTA
See result / BUY NOW · 跳 PT-04
次 CTA
View full PDP · 跳 PT-04
退路
Take Quiz(if on Compare)/ 反之
07
Page Type · 07
Support Hub & Sub · 服务入口
旅程 C 主入口 · Hub 是分流(按症状/按产品/按工具)· Sub 是具体场景(症状选诊/产品支持/下载/RMA/社区/联系)
实例页
/support/support/symptoms/support/product/support/download/support/rma/support/contact/community
Hub 模块槽位(/support)
Sticky 顶导GM-01
Support hero · "How can we help?" + 搜索框PT 独有
症状选诊器入口 · 主入口(C1 草稿建议)· 大卡 · "Tell us what's wrong"PT 独有
4 卡入口 · Product Support / Download / Community / RMAPT 独有
AI 助手 · "Ask AI" chat 入口(未来扩展)PT 独有
Contact card · 电话/在线/EmailPT 独有
"我的 X" 入口GM-03
FooterGM-07
Sub 模块槽位(症状选诊器)
Step-by-step diagnostic · 问答树式PT 独有
Recommended solution · 推荐解决方案 · 链接到具体 KB 文章PT 独有
Escalation path · "还没解决?" 联系客服/RMAPT 独有
CTA 路径
主 CTA
Diagnose now · 跳 /support/symptoms
次 CTA
Find your product · 跳 /support/product
08
Page Type · 08
Story / Press · 编辑性内容
长篇内容承载 · 品牌故事 / 用户案例 / 新闻发布 / How-to 博客 · 旅程 A 信任建立的主战场
实例页
/stories/brand/stories/case/press/blog
模块槽位
Sticky 顶导 + 面包屑GM-01 + GM-10
Article hero · 标题 + 副标题 + 作者 + 日期 + cover imagePT 独有
Lede · 大字摘要 · 70-100 字PT 独有
Body · 富文本(图文混排) · 支持引用/视频/图表PT 独有
Pull quote · 引文重点PT 独有
Related stories · 3 张推荐卡PT 独有
FooterGM-07
CTA 路径
主 CTA
Read more · 跳 related stories
次 CTA
Subscribe newsletter
退路
See products · 跳 PT-02/PT-04
09
Page Type · 09
Trust Page · 信任 hub + sub
brand-thesis Principle 04 "Trust by Design" 的 IA 兑现 · 信任元素一等公民 · FCC 禁令背景下的关键页面 · 旅程 A 信任探查的硬证据
实例页
/trust/trust/security/trust/privacy/trust/compliance/trust/advisory/legal
Hub 模块槽位(/trust)
Sticky 顶导GM-01
Trust hero · "Trust by Design" + 一段 manifestoPT 独有
5 大支柱卡 · Security / Privacy / Compliance / Advisory / Legal · 每张跳 subPT 独有
Latest statement · 最新公告 · FCC / 诉讼回应PT 独有
Annual report link · 年度透明度报告PT 独有
FooterGM-07
Sub 模块槽位(各 sub 通用)
Topic heroPT 独有
Section content · 政策/技术细节 · 富文本PT 独有
Contact / Report · 漏洞披露入口 / 隐私请求PT 独有
CTA 路径
主 CTA
Read full statement · 跳 sub
次 CTA
Contact security team
10
Page Type · 10
Account Dashboard · "我的 X"
my.tp-link.com · 旅程 C(支持)+ 旅程 D(DTC)的共同终点 · 设备管理 / 订阅 / 订单 / 推荐 · 形态类似产品级 app 而非营销站
实例页
my.tp-link.com/devicesmy.tp-link.com/subscriptionsmy.tp-link.com/ordersmy.tp-link.com/profile
模块槽位
Top nav · 内部 · Devices / Subscriptions / Orders / Profile · 跟主站顶导分开PT 独有
Left sidebar · 子分组导航PT 独有
Main area · 列表/卡片视图 · 设备健康/订阅状态/订单详情/个人资料PT 独有
Action buttons · Add device / Manage subscription / View order detailsPT 独有
Help footer · 跳回 /support 或联系客服PT 独有
CTA 路径
主 CTA
Manage device / subscription
次 CTA
Reorder · 跳 store · cross-sell
退路
Get support · 跳 /support
Part 03
跨 PT 的 GM 映射
从 IA v0.2 GM-01 ~ GM-10 看每个全局模块在哪些 PT 出现——这决定下一步模块系统的复用范围。
| GM | 模块 | 出现 PT | 触发条件 |
|---|
| GM-01 | Sticky 顶导 | 010203040506070809 | 除 PT-10(my.tp-link.com 有自己顶导) |
| GM-02 | tp-link ID 登录 | 顶导内 · 全 PT | 顶右图标 · 点击弹层 |
| GM-03 | "我的 X" 入口 | 0407 + 顶导下拉 | 登录后可见 / PDP 已购卡片 |
| GM-04 | 全站搜索 | 顶导内 · 全 PT | 顶右 ⌕ 图标 |
| GM-05 | 购物袋 / Bag | 顶导内 · 全 PT | PDP Buy Now 加购后显示数字角标 |
| GM-06 | HomeShield 锚点 | 010407 | Home / PDP 底部 / Support · 跳 /homeshield(PT-05 实例) |
| GM-07 | Footer | 全 PT(PT-10 简化版) | 所有页面底部 |
| GM-08 | Trust strip | 0102030405 | 关键转化路径前 · Home/Brand/Generation/PDP/Education |
| GM-09 | PDP Buy strip | 04 + 06 mini | PDP sticky 侧栏 · Compare 表 CTA 行 |
| GM-10 | 面包屑 | 030405070809 | PDP 与三级页面顶部 |
读图要点 · GM-01/02/04/05/07 是全 PT 出现的真"全局"模块——是模块系统首要沉淀对象。GM-08 Trust strip 在 5 个 PT 出现——也是高复用价值。GM-09 PDP Buy strip 主要在 PT-04 但 Compare(PT-06)需要 mini 版——下一步模块系统要拆出 strip 的"标准版/mini 版"两个变体。
附录 · 系统页 (不归 PT)
这些页面是站点必需但不在 10 PT 模板范围内 · 由系统/平台层支持 · wireframe 阶段单独处理
Search Results · /search?q=xxx · 全站搜索结果页 · 列表式
DTC Checkout · store.tp-link.com/cart /checkout · Shopify headless 模板 · 不归本站 PT
Error pages · /404 /500 · 错误兜底 · Footer 极简版
Legal / Cookie / Consent · 弹层或独立页 · 跟 Trust 不同(Trust 是叙事 · 这些是合规交互)
Part 04
草稿 vs 已拍板 边界
本文档 v0.1 的内容明确归类——哪些来自前序拍板(brand-thesis v0.5 / product-framework v0.2 / ia v0.2 + 22 条拍板)、哪些是基于这些拍板推导出来的草稿建议。后者必须等 Kevin 逐条 confirm 后才能升格。
✓ 已拍板(继承前序)
⚡ 草稿建议 · 待 Kevin confirm
10 个 PT 总体框架(基于 ia v0.2 sitemap 聚类)
每个 PT 的具体模块槽位顺序 · 信息密度档位
PT-04 PDP 主战场(旅程 B 终点 + D 起点 + C 入口)
PDP 内 16 模块槽位的具体顺序 · sticky 元素的具体位置
Deco PDP 使用 Deco book 范式(A4 拍板)
Archer PDP 跟 Deco PDP 的视觉/文案差异程度
跨 PT 的 GM 复用映射(基于 ia v0.2 GM-01~10)
每个 GM 是否需要"标准版 / mini 版 / 简化版"多变体
PT-10 Account Dashboard 形态接近 app
my.tp-link.com 与主站 tp-link.com/us 的视觉/导航关系
Next Step · 下一步预定方向
进入维度 4 · 模块系统(MS)
10 个 PT 各自的模块槽位画完——下一步从"页面长什么样"切换到"模块长什么样、怎么复用"。模块系统把跨 PT 共用的 GM-01~10 + 高复用 PT 独有模块单独沉淀为组件规范(每个组件:状态、变体、props、视觉 token、a11y、跟 Deco book 视觉对接)。
01
开始维度 4 · 模块系统 v0.1推荐 · 把 10 个 PT 拆出来的 ~25-30 个模块沉淀成组件规范 · 优先级 GM-01/07/08/09 + PDP key benefits + Hero + 型号 showcase + Compare table
02
先深化 PT-04 PDP wireframe · PDP 是 4 旅程核心交叉点 · 模块密度最高 · 先画 PDP 的低保真 wireframe(3-4 屏)再回头看模块系统
03
锁 V1 范围 · 跟 Carlos / Deco 团队对齐后 · 把 V1 那 10-15 页具体钉死(从 10 个 PT 里挑实例)· 进 V1 排期
版本变更记录 · Changelog
v0.4
2026-06-03
取消 Good/Better/Best 分级 · 对齐 ia v0.5 · PT-01 Three-tier showcase → 型号 showcase;PT-03 Three-tier grid → Model grid(该代际型号平铺不分档);PT-04 tier badge → 旗舰/新机标签;CTA "Choose your tier" → "Choose your model"。
v0.1
2026-05-19
页面类型清单首版 · 把 ia v0.2 sitemap 60+ 页面归到 10 个 PT。注:本版 PT-03/PT-04 假设的"Deco 8 三层是主推" · v0.2 修正为多代际并存。
v0.3
2026-05-19
实际 SKU 填入 · Hero 拍板:Wi-Fi 8 = Deco 8 Pro(16G)· Wi-Fi 7 = Deco 7 Elite BE85(22G)。PT-03 Generation Landing 实例扩为 4 个(Wi-Fi 8 / 7 / 6E / 6)· PT-04 PDP 实例覆盖 BE25/BE63/BE85/BE95/XE75/XE200/X55/X90 等。同步 ia v0.4 / module-system v0.3。
v0.2
2026-05-19
多代际并存修正 · 修正 v0.1 把 Deco 8 当 Deco 全线主推的错误。PT-03 Generation Landing 从 2 个扩为 4-6 个并行。PT-04 PDP 实例扩多代际。注:v0.2 SKU 用 placeholder · v0.3 填实际。