H1标签是页面唯一核心主题的语义声明，必须且只能有一个；应代表整页主旨而非网站名、按钮或弹窗标题，CMS模板常因全局硬编码导致重复，需通过工程化手段确保全链路合规。
H1 标签不是“页面第一个大字”，而是告诉搜索引擎和屏幕阅读器“这个页面到底在讲什么”。一个页面必须且只能有一个 <h1></h1>，否则会稀释主题权重、干扰辅助技术、破坏 SEO 结构。
怎么判断该不该用 <h1></h1>？
看内容是否代表整页唯一核心主题——不是网站名、导航栏文字、Logo、欢迎语，也不是弹窗或侧边栏标题。
-
<h1>订单确认</h1>✅ 页面就是完成下单后的确认流程 -
<h1>404 页面未找到</h1>✅ 错误页的语义主体就是这个状态 -
<h1>React 性能优化指南</h1>✅ 整篇文章围绕该主题展开 -
<h1>MySite</h1>❌ 这是品牌标识，应放在<header></header>里用<div class="logo"> 或 <code><span role="banner"></span> -
<h1>立即购买</h1>❌ 是操作按钮文案，属于交互元素，不是主题声明 - 解决方法：Layout 文件中彻底移除
<h1></h1>，改用<header role="banner"></header>或纯语义中立容器 - 让具体页面组件负责输出唯一
<h1></h1>，并通过框架能力确保服务端已渲染（如 Next.js 的generateMetadata、Nuxt 的definePageMeta） - 若用静态生成（SSG），检查构建后 HTML 源码，确认
<h1></h1>出现且仅出现一次 - 弹窗、抽屉、Tooltip 等附属界面一律禁用
<h1></h1>；主标题仍由外层页面控制 - 可用
<h3></h3>或带aria-labelledby的<div role="heading" aria-level="1"> 替代（仅限极特殊无障碍场景） <li>服务端渲染（SSR）页面若在客户端二次 hydrate 时覆盖了 <code><h1></h1>，会导致首屏与最终 DOM 不一致，被 Lighthouse 报告为“标题缺失”
为什么 CMS 模板常出错？
多数模板在全局 Layout 中硬编码了 <h1>MySite</h1>，又在文章组件里再塞一个 <h1>XXX</h1>，结果页面出现两个 <h1></h1>。
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
动态插入时容易忽略的陷阱
JS 渲染内容（比如模态框、Tab 切换面板、懒加载区块）如果擅自加 <h1></h1>，会破坏整页层级结构。
真正难的不是写对 <h1></h1>，而是让整个工程链路（模板、CMS、组件库、SSR 配置、前端路由）都默认遵守“单页单主标题”规则——一旦某处松动，就可能在生产环境埋下 SEO 和可访问性隐患。
