点「定价」后，导航用 aria-current="page" 标出当前位置、页面亮起定价段、位置指示器显示第 3/4 段。用户一眼知道自己在哪、下一步能做什么。
先操作：跳区段、看当前位置
一个 CodeNow 产品落地页。点区段导航跳到对应段，看当前段标记、区段徽章和位置指示器如何各自变化；区段内主 CTA 的反馈也长在按钮上。
产品落地页实验台
一个 CodeNow 产品落地页。先点区段导航跳到「定价」，看当前段标记、区段徽章和位置指示器一起变化；再点当前区段的主 CTA，看反馈长在真实按钮上。浏览器切到窄屏时，区段仍按顺序堆叠。
一句主张加一个「开始」入口，让用户 5 秒知道你在做什么。
三个重点，每个连到一个真实任务，而不是功能罗列。
方案差异、限制和下一步，让用户能做出决定。
回答真实疑问，并连到完整帮助，而不是塞话术。
你在第1/4 段· 首屏同一页面 · 未重新加载
判断与下一步：当前在「首屏」（第 1/4 段）。点区段导航跳转，看当前段标记、区段徽章和位置指示器如何跟着走；页面不会重新加载。
从刚才的操作里提炼
你在实验台上看到的就是单页布局的核心工作方式。
- 区段按决策顺序纵向堆叠：首屏 → 功能 → 定价 → FAQ 是一条阅读路径，每段只服务一个目的，全部塞进同一页。
- 区段导航（锚点）跳转到对应位置：点导航只移动当前区段，不重新加载页面——实验台里位置指示器一直显示「同一页面 · 未重新加载」。
- 当前位置用
aria-current="page"标记：Rausch 标记跟着当前导航项走，页面对应区段也亮起「当前区段」徽章。 - 每段都能回到主操作：有 CTA 的区段（首屏、定价）里，「开始申请」是真实按钮，点击后按钮自身变成「已开始申请」。
- 跨断点保留当前段：切窄屏只改排版，当前段、导航和位置都不丢；单页在手机上也要能滚完所有区段。
什么时候用单页
从用户信号判断，也要知道什么时候它不是最优解。
- 用：转化型单线叙事——产品落地页、活动报名、新品介绍，决策顺序清楚、首屏要快速给价值。
- 用：希望用户连续读完一条主线，不被分页打断；并靠区段导航在长页里快速定位。
- 不用：内容是平等的多目标入口（如后台、工作区）——顶栏 + 多页或侧边栏布局更合适。
- 不用：每段都是独立长任务、需要各自 URL 和返回路径——拆成多页或文档布局更可控。
怎么用：从决策顺序到窄屏验证
让一页里的区段有顺序、可定位、可恢复。
- 先排决策顺序：按用户「先看价值、再看证据、再做决定、再消疑虑」的路径排区段，每段只一个目的。
- 给每段唯一标题与
id，区段导航用锚点链接到这些id；当前段用aria-current="page"。 - 跳转同步三件事：导航当前位置标记、页面对应区段高亮或滚动、位置指示器更新；不要只改 URL。
- 每段留回到主操作的路径（主 CTA 或返回顶部），让用户在任何位置都能继续或重置。
- 验证窄屏：区段导航不横向溢出，正文和 CTA 在手机上可读、可点，长页能顺畅滚完。
正反例：同一落地页，只改跳转后的反馈
围绕同一个落地页，只改变区段导航跳转后的可见反馈，看用户后果如何不同。
点导航只让地址栏变成 #pricing，当前段没有任何标记，页面也没滚过去。用户不知道自己在哪，只能从首屏重新找起。
快速自测
单页区段导航跳转后，最不能省的可观察结果是什么？
继续查证
术语的技术定义和行为以这些一手或权威资料为准。
下一步学
和本知识点经常一起出现的概念。