标签在HTML文档中必须且只能出现一次，用于包裹页面独一无二的主要内容，不可嵌套在、等已有语义的元素内，也不应与role="main"重复使用。

main 标签必须且只能出现一次

一个 HTML 文档里，

元素应当有且仅有一个，用来包裹页面中与当前文档直接相关、独一无二的主要内容。它不能出现在 、、、

或 内部——这些区域本身已有语义，再套

会破坏结构逻辑。

常见错误包括：

• 在多个 中各自加
• 把全站导航或页脚也包进
• 遗漏
  ，只用 代替（失去语义和辅助技术支持）

  main 不能作为子元素嵌套在 article 或 section 里

  是顶层内容容器，代表整个页面的主体流。而 表示可独立分发的内容单元（比如一篇博客、一条新闻），
  表示主题性分组。它们之间是并列关系，不是包含关系。

  正确结构示例：

  
    
  网站标题
    
    
  
      
        
  文章标题
        
  正文内容...
      
      
  
        
  相关资源
        
  ...
      
    
    ...
    
  

  错误写法（语义冲突）：

    
  
      
  内容...
    
  

  main 与 ARIA role="main" 的关系

  如果因为历史原因或框架限制无法使用

  标签，可以用 role="main" 模拟其语义，例如：。但优先级顺序是：
  > role="main"。两者不要同时用——浏览器和读屏器会重复识别，反而造成干扰。

  注意点：

  • 自带隐式 role="main"，无需额外添加
  • 若用了
    ，又手动加 role="main"，部分读屏器可能播报两次“main”
  • 不支持 HTML5 的旧浏览器（如 IE8 及以下）无法识别
    ，需靠 JS 动态补 role 或降级处理

  main 在 SEO 和无障碍中的实际影响

  搜索引擎（如 Google）会参考语义标签判断内容主次，

  能帮助明确核心内容区块，间接提升相关性识别效率。对屏幕阅读器用户而言，
  提供了快速跳转入口（例如 JAWS 按 R 键可直达 main）。

  但要注意：它不会自动提升排名，也不会修复内容质量缺陷。真正起作用的是——你是否把真正该放进去的内容放进去了。

  容易被忽略的细节：

  • 动态加载内容（如 SPA 页面）后，应确保
    包含新内容，而不是空着或残留旧 DOM
  • 服务端渲染时，避免把
    放在条件渲染分支里导致缺失
  • 多语言站点中，
    不需要加 lang 属性——语言应由外层 或具体子元素控制