随着项目作品集不断扩大,如何组织单个案例对读者导航变得十分关键。本文讨论怎样用小节标题有效区分项目背景、采取的做法和最终结果,使读者能在复杂内容中快速定位。
用清楚标题组织不断增多的案例
设想一家小型服务工作室,它的作品集已经超出了一张滚动页面的容量,现在正试着为一位虚构的零售客户撰写一份更长的案例。作者为开篇勾画了三个候选标题:“背景”“客户的起点”和“我们从哪里开始”。三者都会引出同一段关于一家区域商店在两个地点库存记录不一致的短文,但它们向读者传递的承诺并不相同——第一个中性,第二个强调客户自身处境,第三个则暗示一段叙事旅程。这个选择仍未定下来。
在案例的中段,作者拿“做法”与“我们的做法”和“我们当时怎么做的”作比较。手头的草稿材料描述的是一套盘点流程和对员工的走访。页面本身已经表明这项工作由谁完成,“我们的做法”只是重复了这一点;而“我们当时怎么做的”听起来更像日记,不像方法。“做法”则留有空间去描述客户自己的参与,草稿提到了这一点,但还没有把它清楚地单列出来。
结果部分也产生了类似的张力:“结果”“成果”和“发生了什么变化”。可用材料包括一份盘点前后对比,以及一条关于核对记录所花时间减少的说明。“结果”可能让读者期待看到标注清楚的数字,但草稿目前只提供了一段简短叙述。“发生了什么变化”贴合叙述,却未必能帮到那些在寻找可衡量效果的浏览者。作者还没有决定是加一张小指标表,还是让这一节只保留文字。
还有一个不确定之处在这些示例之外:草稿的三个部分目前还没有在视觉上区分开,读着从一个案例转到另一个案例时,可能注意不到一节在哪里结束、下一节从哪里开始。这个问题留到措辞定下来之后再处理。
为新项目界定背景小节
手头可用的资料是 W3C 无障碍推进计划(WAI)关于页面结构的教程,而不是案例标题写作指南。它说明标题传达页面内容的组织方式,浏览器、插件和辅助技术都可以利用标题在页面内导航。1
关于层级,该教程指出最重要的标题是 1 级,最不重要是 6 级;同级或更高级的标题开启一个新的小节,而更低级别则在更高级别的小节内开启子小节。它建议尽量避免跳级,并给出一个 h2 后直接跟 h4 的例子,不过在收束子小节时跳级是可以接受的。1
教程还谈到侧栏这类固定的页面区域:那里的标题层级不应随内容区的层级而变化,跨页面保持一致性更重要。对于可见的标题,它建议用 aria-labelledby 把标题与页面区域关联起来。1
可以把背景小节当成新读者了解这位虚构零售客户、并据此判断整份案例的地方。一个实用做法是把草稿的前两句话单独抄到一张便笺上,然后问:在理解做法之前,读者必须知道什么?客户类型、起始处境,以及这项工作为什么被委托。如果草稿开头写的是“客户需要更好的库存流程”,可以考虑改写成“这家客户是一家小型零售商,在两个地点手工盘点库存,希望建立一套可重复的每周例行流程”。后一个版本给了读者场景,也给了继续读下去的理由。
接下来可以拿一个简短背景块,与从同一张便笺里整理出的较长版本作比较。较长的版本可以提到影响这项工作的约束,但前提是后面的小节确实用到了它。如果做法段落再也没有回到两个地点的问题,现在就可以删掉这个细节,而不是让读者一直等着它派上用场。
每开始一个新项目,可以在动笔前先记录三个简单答案:客户大致是谁、是什么促成了这项工作、又是什么边界限制了它。这些是你自己的工作笔记,不是必须填写的表单。如果某个答案显得单薄,可以考虑把这个项目在作品集中往后放,把篇幅留给背景能讲得更有把握的案例。
在详细案例中勾画做法小节
针对详细案例中的做法部分,已有文档给出的指引集中在为每一节提供一个能标识该节的标题。该技巧适用于内容按小节组织的页面,其明确目标是确保各节都有标识自身的标题。在 HTML 中,作者可以使用 h1 至 h6 的标题元素,让用户代理能够自动识别小节标题;其他技术则采用其他方式来标识标题。2
为了支持导航并帮助理解整份文档的结构,指引提出作者应当使用正确嵌套的标题,例如 h1 之后接 h2,h2 之后接另一个 h2 或 h3。文档中的一个示例用 h1 元素表示整体标题,用 h2 元素表示主要小节,用 h3 元素表示其中的子小节。2
在做法小节内部,你可以先判断自己的材料真正支持几个子小节,再给它们命名。拿出某个详细案例的笔记,按读者需要跟随的内容分组:初始情况、决策顺序,以及工作改变方向的那个节点。如果其中两组内容比较单薄,你也许可以把它们保留在一个“做法”标题下的普通段落里,而不是硬造出子小节,承诺超出笔记所包含的内容。
举一个推演示例:假设一份草稿用一长段涵盖了盘点复查、员工访谈和修订后的订货流程。你可以把它拆成两个带标签的子小节,一个用于收集信息,一个用于改变流程,把访谈留在第一个里。这是作者的演示,并非断言每个案例都该这样读。你可以把这一版本与一个不分段的段落作比较,保留更能帮助读者找到其所关心决策的那一版。
每个子小节的标题也可以呼应你笔记中已经用过的说法,让标签贴近其背后的材料。你可以记下每个子小节回答的问题,再检查标题能否让这个问题无需额外解释就被认出来。
用不同标题层级突出结果
标题传达文档的逻辑层级,该技巧页面提醒,跳过层级可能让人觉得结构没有经过认真考虑,或者标题是按视觉呈现而非含义选定的。它鼓励按层级嵌套标题,使最重要的信息获得最高逻辑层级,子小节获得后续层级,例如h2作为h1的子小节。3
该技巧列出了适合结果小节的标题标记用途:标记主内容区域内的节标题、标记用作标题的文本图片,以及让用户按小节浏览页面或跳过重复区块。由于标题标示重要小节的开始,使用辅助技术的用户可以直接跳到某个标题并开始阅读,页面称这能显著加快交互。3
对于结果的标题层级,你可以在定稿前先做一次快速对照。拿你的盘点示例,把“结果”写成标题,然后将前后对比数字直接放在它下面。如果这些数字需要一句简短的引入句,例如“盘点从每周四次降到两次”,你可能更愿意用更朴素的标签,因为它表明后面跟着的是证据而非解释。
如果单个结果有两部分——比如缺货减少和员工加班减少——你可以考虑用第二层级。写一次“结果”,然后在它下面写两个更短的标题,每个标题配上自己的一句话和一个数字。这样读者就不必在一个密集的区块里寻找关键数字。
你还可以比较同一个标签一眼读过去的效果。在两个数字上方写下“成果”,再写“结果”,问哪一个更符合你的材料实际展示的内容。如果草稿包含可衡量的变化,更朴素的标签往往更合适;如果它描述的是实践中更广泛的变化,含义更宽的词可能更贴切。两种选择都由你来定,在草稿旁记下理由,有助于你在以后的案例中保持同样的习惯。
在作品集各页保持一致的层级
用简短标题把相关段落归类,并清楚描述每一节,让标题勾勒出页面的轮廓。对于超过三四段的文档,标题和小标题有助于可用性与无障碍,帮助读者把握整体大纲并跳转到具体信息。4
标题层级从一级到六级,一级通常对应页面标题或文档的主要部分。由于字号或样式的视觉差异对使用辅助技术的读者并不构成足够的提示,标题必须被语义化地标记,才能被识别并用于导航。正确使用元素也能把结构层级传达给辅助技术,并往往让文档更易于编辑。4
面对层级问题,你可以从自己的标题提纲开始,而不是从页面设计开始。拿出你为某一个案例已经起草的标题,按顺序列出,并标注每个标题属于哪一节。然后逐个问:从另一个案例转过来的读者,会不会把这个标签放在同一层级?如果在一份案例里“我们当时怎么做的”位于一段合作伙伴访谈之上,那么下一份案例里类似的访谈也应处于那个层级;若没有,用一句简短备注记下原因,可以指导下一次修订。
你也可以在定下层级之前把两份案例并排比较。把零售案例的背景标题放在另一个项目的背景标题旁边,只读这两行。如果一行读起来像小节标签,另一行像草稿里的句子,可以考虑把较长的那条缩短,让两者读起来像同级标题。这个选择只靠对齐名称就能做出,不必改动正文。
前面提到的视觉分隔值得和标签一起决定。你可以在纸上画出“背景”“做法”“结果”在两份案例中会怎样呈现,再检查同类标题在两幅草图中是否看起来一致。如果某一部分需要第二层级,就在草图中标出来,看看这一模式在另一份案例中是否仍成立。若不成立,你可以调整标签,或接受这一差异并加以记录,因为这里追求一致是为了帮助读者定位,而不是一条固定规则。
检查标题结构是否便于无障碍阅读
作品集逐渐增多时,要检查小标题反映的是实际的章节结构,而不是视觉样式。关于小节标题的指引指出,内容按小节组织时,这些小节需要有标题来引出;横线、方框这类视觉呈现不足以标示文档中的小节。5
对照这条准则检查草稿中的背景、做法和结果标题,就是确认每一节开头都有标题。指引列出的充分技术有两条:用标题组织页面,以及在每节内容开头提供标题元素;无障碍指南工作组认为这两项技术足以满足该准则。5
还要留意这条准则的适用范围:它针对写作内容中的小节,不涉及用户界面组件;它被列为AAA级条款,是因为并非所有类型的内容都能套用。指引也提到,把既有文档发布到网上时,作者原稿里没有的标题无法补入;一封涵盖多个话题的长信若加上标题也会显得奇怪。5
一个实用的下一步,是取来你已经写好的一份案例的标题提纲,不放正文,按顺序朗读一遍,听听背景、做法和结果这三部分是否各自分明。你可以在草稿里每个标题旁写一句短注,说明它为中途进入的读者回答了哪个问题:客户是谁、做了什么,或发生了什么变化。如果两个标题回答的是同一个问题,可以考虑改写其中一个,而不是新增一层标题。
你还可以比较一下,在自己的笔记里跳过某个标题时,同一份提纲读起来怎样——比如先写“背景”,再直接跳到“结果”,看这个跳跃是否显得突兀。这是写作时的取舍,不是固定规则;过渡性标题对材料有没有帮助,由你决定。记录你选定的方案和理由,这样以后修订同一份案例时能沿用同样的模式。
常见问题
在给做法小节命名之前,我怎样才能判断自己的材料实际支持几个子小节?
在做法小节里,你可以先决定自己的材料真正支持几个子小节,再去命名它们。拿一个详细案例的笔记,按读者需要跟进的内容分组:最初的情况、一系列决策的顺序,以及工作发生转向的那个节点。
关于层级问题,我应该怎样开始整理自己的标题?
面对层级问题,你可以从自己的标题大纲入手,而不是先看页面设计。把你已经为一个研究草拟的标题按顺序列出来,标出每个标题属于哪个小节。
在起草每个新项目之前,我可以先记录哪三个简单答案?
对每个新项目,你可以在起草前先记录三个简单的答案:客户大致是谁、是什么促成了这项工作、以及是什么边界限制了它。这些是你自己的工作笔记,不是必须填写的表格。
Headings | Web Accessibility Initiative (WAI) | W3C . 采集日期:2026-11-09. ↩︎ ↩︎ ↩︎
G141: Organizing a page using headings | WAI | W3C . 采集日期:2026-11-09. ↩︎ ↩︎
H69: Providing heading elements at the beginning of each section of content | WAI | W3C . 采集日期:2026-11-09. ↩︎ ↩︎
Writing for Web Accessibility – Tips for Getting Started | Web Accessibility Initiative (WAI) | W3C . 采集日期:2026-11-09. ↩︎ ↩︎
Understanding Success Criterion 2.4.10: Section Headings | WAI | W3C . 采集日期:2026-11-09. ↩︎ ↩︎ ↩︎