每个页面有且仅能有一个，且不可嵌套在等区域元素内；应包裹全页主要内容，每篇文章用单独包裹，须带标题以确保可访问性。
为什么
很多 Hugo 或 Hexo 用户改模板时，看到 HTML5 结构标签就直接套用，结果导致屏幕阅读器报错、SEO 工具提示“main 元素缺失”或“多个 main”。根本原因是：每个页面**有且仅能有一个 **，且它**不能嵌套在 、、 等区域元素内**。
静态博客常见错误写法：
标题
正文
正确做法是让 包住整页主要内容容器（比如 content 区域），而每篇博文用 单独包裹：
立即学习“前端免费学习笔记（深入）”；
-
放在layouts/_default/base.html（Hugo）或layout/layout.ejs（Hexo）的主体内容区，且只出现一次 -
放在layouts/_default/single.html或layout/post.ejs内部，每篇文章一个 - 列表页（如首页、归档页）中，每个
应包含+ 可选
用 更安全
Markdown 渲染后常生成大段 手动分块。但语义上，注意三点：
-
- 不要用
- Hugo 的
{{ .Content }} 默认不解析自定义 HTML 标签，若想在 Markdown 中插入 unsafe 渲染或改用短代码（shortcode）封装
Hexo 的 post.ejs 里怎么避免
很多人把侧边栏（目录、标签云、推荐文章）放进 aria-label 或没放在
实操建议：
- 确保
- 给
aria-label="related content" 或 aria-label="table of contents"，明确用途
- Hexo 中，
post.ejs 常见结构是：...
- 如果使用
hexo-toc 插件生成目录，它默认输出无语义
Hugo 的 baseof.html 中
在 layouts/_default/baseof.html 里写死
- 某些页面（如 404、隐私页）可能不需要全局导航栏，但
{{ if not .Is404 }} 或 {{ if .Site.Params.showHeader }} 控制显示
-
© {{ now.Year }} {{ .Site.Title }}），必须确保它不在 partial 中被多次 include —— Hugo 的 {{ partial "footer.html" . }} 如果在多个 layout 中调用，会导致重复输出
-
aria-label，例如
HTML5 结构标签不是装饰，它们直接影响爬虫抓取路径和读屏顺序。最常被忽略的是：没有检查
Markdown 渲染后常生成大段 注意三点： 很多人把侧边栏（目录、标签云、推荐文章）放进 实操建议： 在 HTML5 结构标签不是装饰，它们直接影响爬虫抓取路径和读屏顺序。最常被忽略的是：没有检查 和 ，有人习惯加 表示“文档中具有主题的独立部分”，更适合用于长文的逻辑分章（如“安装步骤”“配置说明”“常见问题”）。
必须有标题（–），否则会被辅助技术忽略 替代样式容器——纯为了加 margin/padding，请继续用 {{ .Content }} 默认不解析自定义 HTML 标签，若想在 Markdown 中插入 ，需启用 unsafe 渲染或改用短代码（shortcode）封装Hexo 的
post.ejs 里怎么避免 被搜索引擎误判为正文，但若没加 aria-label 或没放在 外，某些 SEO 工具会把它和正文一起提取文本，拉低关键词密度。
不在 内部；它应与 并列，同级放在 下 加 aria-label="related content" 或 aria-label="table of contents"，明确用途post.ejs 常见结构是： 塞进 里hexo-toc 插件生成目录，它默认输出无语义 而非
Hugo 的
baseof.html 中 容易重复渲染layouts/_default/baseof.html 里写死 很方便，但容易忽略两点：
{{ if not .Is404 }} 或 {{ if .Site.Params.showHeader }} 控制显示 若含动态版权年份（如 © {{ now.Year }} {{ .Site.Title }}），必须确保它不在 partial 中被多次 include —— Hugo 的 {{ partial "footer.html" . }} 如果在多个 layout 中调用，会导致重复输出 应有 aria-label，例如 ，否则无障碍测试失败 是否真的唯一，以及是否所有 都带了可访问标题。
