副标题应避免使用h2等标题标签，而应置于header内用p.subtitle语义化标记；CSS控制样式，aria-labelledby实现语义关联；动态页面需用document.title更新标题。
副标题不该用 h2 或其他标题标签硬凑，否则会插入一个真实的大纲节点，让屏幕阅读器误判结构、SEO 工具误读层级。真正合规又实用的做法，是把副标题当作对主标题的补充说明，而非独立章节。
用语义容器包裹主副标题
把 h1 和副标题一起放进 header 元素里，这是 HTML5 明确支持的语义分组方式：
- header 自带节边界（sectioning root）语义，天然适合包裹标题及其辅助文本
- 副标题用 p class="subtitle"，不参与大纲，但视觉和语义都清晰可读
- 避免使用已废弃的 hgroup，主流屏幕阅读器完全忽略它，构建工具还会报错
用 CSS 控制视觉，别靠标题标签“假装”副标题
字号、颜色、行高、间距这些全部交给 CSS，例如：
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- .subtitle { font-size: 0.85em; color: #666; margin-top: 0.2em; font-weight: normal; }
- 哪怕把它设得比 h1 还大，只要 DOM 中不是 heading，就不会干扰文档大纲
- 禁用 div class="title" 或 span 加粗模拟标题——机器无法识别，用户也无法快捷跳转
需要语义关联时，用 aria-labelledby 显式声明
如果副标题有实际语义价值（比如文章导语、版本说明、时间戳），可以赋予它 ID，并让主标题引用：
立即学习“前端免费学习笔记（深入）”；
JavaScript 深入解析
ES2023 新特性与运行时原理
- 这样屏幕阅读器会把两者合并朗读，既保持结构干净，又增强可访问性
动态页面要同步更新 document.title
单页应用或模板渲染中，title 标签必须写在 head 内且唯一有效：
- 不要靠 JS 修改 document.querySelector('title').textContent，这不会改变浏览器标签页文字
- 正确方式是 document.title = '新标题'，它实时生效且兼容所有环境
- 检查最终生成的 HTML（不是源码模板），确认 title 真在 head 里，没被构建工具或 CMS 错位塞进 body
