一个页面通常只有一个最高级标题对应页面主题
别名: 页面主题标题 · single top-level heading · document title heading
概念解释
打开一页,最高级标题应当能回答「这页是关于什么」。一个页面通常只放一个最高级标题,对应页面主题;站点名、栏目名、卡片标题不要再各占一个最高级。一页里出现两个同等的最高级,大纲里就出现了两个并列的根,用户无法判断哪一个才是这一页。
浏览器标签里的文档标题和页内最高级标题是两件事:前者给窗口和历史列表,后者给页内大纲的根。两者宜指同一主题,但不能互相替代。
机制
大纲从最高级开始分枝。一个根让整页的二级都成为「关于这一主题的分节」。两个根把页面切成两份并列文档,导航时会先听到两个都像「这一页」的条目,再在它们各自的孩子之间来回。设计上这常来自组件复用:每张卡片、每个弹层、每个嵌入小组件都从最高级起笔,因为组件在隔离预览里看起来像一整页。嵌进真页面之后,预览时的根变成了整页上的第二个根。
站点标志里的产品名也常被标成最高级,结果每一页的根都叫产品名,真正的页面主题被降到二级。用户靠最高级区分「我现在在哪一页」的策略就失效了——每一页的最高级都一样。
怎么研究
在站点抽样里统计每页最高级标题的个数与文本,并对照文档标题、主导航当前项。请用户只听每页的最高级,判断「这页是什么」,再打开页看判断是否成立。
自变量:最高级个数、最高级是否复用站点名、组件是否自带最高级。 因变量:每页根的个数、仅凭最高级定位页面主题的正确率、与文档标题不一致的比例。
自动化能数最高级,不能判断那个唯一的最高级是否真的命名了页面主题(有些页只有一个最高级,写的却是「欢迎」)。正确率任务比计数更有用。抽样要包含首页、仪表盘、带多卡片的概览,这些页最容易长出多个根。
边界
单页应用若用路由把「页」换成视图,每个视图仍应有自己的一个最高级;视图切换后旧的最高级要撤掉,否则会在 DOM 里堆根。HTML 允许一页多个最高级,这是语法许可,不是大纲上的好结构。电子邮件、PDF、嵌入的第三方表单各自是一份文档,最高级按那份文档算,不与宿主页抢根。有的门户把每篇供稿当独立文章纵向排列,多根是内容模型本身,缓解办法是给每篇包地标或明确的文章边界,而不是假装整页只有一个主题。
怎么落地
- 每页(或单页应用里的每个视图)只留一个最高级标题,写页面主题,不要写站点名或栏目口号。
- 卡片、弹层、嵌入组件从二级或更低起笔,不要在组件内部从最高级起笔。
- 让页内最高级与文档标题指向同一主题,避免标签写「设置 / 通知」而页内最高级写产品名。
- 验证:列出抽样页面的最高级标题文本。出现两个及以上,或每一页的最高级都是同一个站点名,记为根失败。