帮助中心
Help Center
别名:帮助中心帮助页帮助文档客服帮助页常见问题页FAQ 页说明书页面怎么用的页面
这是什么
把产品文档、常见问题与联系入口收拢到一处的自助支持页面：顶部搜索先猜意图， 主体按主题分组文章并按热度排序，底部保留联系客服与提交工单的兜底路径。 目标是让用户在打扰人工之前先自己解决问题。
交互实验室
试一试，再决定怎么用正在加载实验室…
✓ 适用场景
- 用户遇到问题先自行查找答案
- 支持量需要靠文档分流
- 内容需按产品模块长期维护
✕ 不适用场景
- 需要实时人工介入的紧急事故（用在线客服或热线）
- 只有几条零散说明（用页面内提示或工具提示）
- 面向公众的营销介绍（用落地页）
常见形式
门户型
Help Portal
搜索 + 分类卡片，覆盖最完整
常见问题
FAQ
折叠问答列表，轻量直接
文档型
Docs Hub
侧栏目录 + 正文，适合长文档
页面结构
- 01
搜索区
一句话说明 + 大搜索框，输入即联想文章标题。
- 02
主题分类
按产品模块分组的入口卡片，配图标与文章数。
- 03
文章列表
分类下按热度与更新时间排列的条目。
- 04
热门内容
高频问题的快捷链接，缩短查找路径。
- 05
联系支持
兜底入口，转在线客服或提交工单。
- 06
页脚
服务状态、社区与法律链接，收束整页。
实现要点
gridflexgrid-template-columns: repeat(auto-fit, minmax(220px, 1fr))position: sticky搜索区置顶并保持吸顶，输入即过滤文章标题（debounce 250ms）；主题分类用 auto-fit 卡片网格， 窄屏降为单列。文章列表与热门区用两列布局；联系支持做成整行强调块收口。 搜索无结果时给热门词建议与联系入口，而不是空白。
相关概念
由多个可折叠区块组成的垂直列表：点击标题展开内容、再点收起，可互斥（同时只开一项） 也可多开。用于在有限空间里收纳成组内容，让用户按需展开。
组件包含组件用圆角边框或底色围出一块自包含内容的矩形容器，一块卡片聚合一组相关信息： 封面图、标题、摘要与操作。是内容流、仪表盘与电商列表的通用显示单元。
组件包含组件用即时过滤把大列表缩到与当前输入相关的一小部分：用户在搜索框敲字，列表随之实时收窄， 并显示命中数量与空结果提示。它把"查找"变成"修剪"，不用提交、不用等跳转，反馈就在眼前。
交互模式使用模式把信息分层呈现：先给最常用、最必要的部分，把次要细节藏到"展开""下一步""显示更多"后面， 用户主动索取时才展示。它解决的是一次性塞给用户太多内容的问题—— 降低初始认知负担，让界面入门简单，同时保留深度供高级用户按需取用。
交互模式使用模式当列表或页面没有数据时，不留一片空白，而是用插图、一句说明和一个明确的下一步操作填充。 它解决的是"用户面对空白不知道发生了什么、也不知道该做什么"的问题—— 把空档变成引导起点：首次使用教用户开始，搜索无结果给出路。
交互模式使用模式