电子书章节不必强制用<section>，但不用就丧失结构语义；应以<section>包裹逻辑章节并配<h2>～<h6>标题，确保屏幕阅读器可跳转、EPUB工具可提取目录，避免全用<div class="chapter">导致索引失效。
电子书网页不是普通页面，它需要被屏幕阅读器准确跳转、被搜索引擎识别章节结构、被阅读器提取纯内容——<article>、<section>、<header> 这些标签不是“锦上添花”，而是让 HTML 电子书真正可读、可索引、可复用的基础设施。
电子书章节必须用 <section> 吗？
不是“必须”，但不用就等于放弃结构语义。浏览器和 EPUB 转换工具（比如 Calibre）会依赖 <section> 的嵌套层级生成目录树；<section> 内部的 <h2>～<h6> 会被自动提取为 TOC 条目。而如果全用 <div class="chapter">，目录生成会失效或退化为线性编号。
常见错误现象：
- EPUB 阅读器里点击目录无响应，或只显示“第1页”“第2页”这类无意义条目
- 屏幕阅读器无法通过“跳到下一节”快捷键导航，只能逐段朗读
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 每个逻辑章节（如“第三章：认知偏差”）用一个
<section>包裹 -
<section>必须包含且仅包含一个标题级元素（<h2>或更高），不能空着或塞多个<h2> - 避免嵌套过深：三级以上
<section>嵌套会让目录层级混乱，多数阅读器只支持两级折叠
<article> 和 <section> 在电子书里怎么分？
关键看内容是否“可独立分发”。电子书里的单篇附录、作者访谈、参考文献列表，即使出现在正文章节之间，也应使用 <article>；而正文各章、每章下的小节（如“3.1 定义”“3.2 案例”）属于同一上下文，用 <section> 更准确。
容易踩的坑：
- 把整本电子书包在一个
<article>里——这违反了“独立可分发”原则，搜索引擎可能将其识别为一篇长博文而非书籍 - 在
<article>内部又套<article>（如把每节都当 article）——HTML5 规范明确禁止嵌套<article>，会导致校验失败
性能影响很小，但兼容性上：Safari 对 <article> 的 outline 算法有 Bug，建议配合 role="article" 双保险。
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
页眉页脚用 <header>/<footer> 还是 <div>？
电子书页面通常没有传统网页的全局 header/footer，但每章开头的副标题、作者署名、出版信息，以及章节末尾的注释、延伸阅读链接，恰恰是 <header> 和 <footer> 的典型场景。
示例结构：
<section>
<header>
<h2>第四章：记忆模型</h2>
<p><strong>作者：李明</strong>｜修订于 <time datetime="2026-07-12">2026年7月</time></p>
</header>
<p>人类短期记忆容量约为...</p>
<footer>
<p>注：本节内容参考 Baddeley 工作记忆模型（1986）</p>
</footer>
</section>
为什么这样做：
-
<header>和<footer>是<section>的合法子元素，语义清晰，CSS 选择器可精准定位（如section > header） - 辅助技术能将
<header>中的<time>自动识别为时间元数据，提升可访问性 - 用
<div class="chapter-header">也能实现样式，但无法被 EPUB 工具提取为结构化元数据
哪些语义标签在电子书里容易被忽略但很关键？
三个常被跳过的标签： <figure>、<figcaption>、<aside>。它们不是装饰，而是内容意图的声明。
<figure> 必须包裹所有独立图表、代码块、公式——不只是图片。EPUB 阅读器会据此生成图注目录，并支持单独缩放/导出。
<aside> 适合放旁注、术语解释、历史背景等“相关但非主线”的内容。它和 <section> 并列，而不是嵌套在段落里；否则屏幕阅读器会误判为干扰信息。
最容易被忽略的细节：
- 所有
<figure>必须配<figcaption>，哪怕只是“图4-2：工作记忆模型示意图”，空<figcaption>比不写更糟 -
<aside>不该用于广告或无关推荐——电子书语境下，它的语义是“作者主动提供的补充说明”，不是容器 - 旧版 Safari 不渲染
<aside>的默认样式，需加display: block兜底
电子书的语义化不是为了满足 W3C 校验器，而是为了让内容在不同设备、不同解析器、不同用户能力下，依然保持结构完整——漏掉一个 <section> 可能导致整章无法被语音朗读器定位，少一个 <figcaption> 就会让图表失去上下文。
