每个页面有且仅能有一个，且不可嵌套在等区域元素内；应包裹全页主要内容，每篇文章用单独包裹，须带标题以确保可访问性。

为什么

不能随便套在 外面

很多 Hugo 或 Hexo 用户改模板时，看到 HTML5 结构标签就直接套用，结果导致屏幕阅读器报错、SEO 工具提示“main 元素缺失”或“多个 main”。根本原因是：每个页面**有且仅能有一个

静态博客常见错误写法：

  

    
标题
    
正文
  

正确做法是让

• 放在 layouts/_default/base.html（Hugo）或 layout/layout.ejs（Hexo）的主体内容区，且只出现一次
• 放在 layouts/_default/single.html 或 layout/post.ejs 内部，每篇文章一个
• 列表页（如首页、归档页）中，每个 应包含
  +
  + 可选

用

拆分长文比用 更安全

Markdown 渲染后常生成大段

和

，有人习惯加 手动分块。但语义上，

表示“文档中具有主题的独立部分”，更适合用于长文的逻辑分章（如“安装步骤”“配置说明”“常见问题”）。

注意三点：

• 必须有标题（
  –
  ），否则会被辅助技术忽略
• 不要用
  替代样式容器——纯为了加 margin/padding，请继续用
• Hugo 的 {{ .Content }} 默认不解析自定义 HTML 标签，若想在 Markdown 中插入
  ，需启用 unsafe 渲染或改用短代码（shortcode）封装

Hexo 的 post.ejs 里怎么避免 被搜索引擎误判为正文

很多人把侧边栏（目录、标签云、推荐文章）放进 ，但若没加 aria-label 或没放在

外，某些 SEO 工具会把它和正文一起提取文本，拉低关键词密度。

实操建议：

• 确保 不在
  内部；它应与
  并列，同级放在 下
• 给 加 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 结构标签不是装饰，它们直接影响爬虫抓取路径和读屏顺序。最常被忽略的是：没有检查

是否真的唯一，以及是否所有
都带了可访问标题。