语义标签使用需严格遵循规范：仅表示本节头部而非页眉，必须唯一且为直接子元素，须带标题并表逻辑区块，否则应改用。

直接用

、

、

、

、

这五个标签，其他语义标签（如

、

）在多数业务模板中不强制要求，强行套用反而破坏结构清晰度。

为什么不能把

当“页面顶部样式容器”用

它只表示「本节内容的头部」，不是视觉意义上的“页眉”。常见错误是把整个顶部导航栏+Logo+搜索框全包进一个

，结果导致大纲层级错乱——尤其当这个

套在

里时，屏幕阅读器会误判为该节的标题区，而非全局导航。

• 页面级
  应与
  并列，且内部只放
  或品牌标识 + 主导航（即
  ）
• 每个
  可以有自己的
  ，但必须配一个
  或更低级标题
• 里不要塞表单控件或按钮组；那些属于交互区域，应归入
  或独立

  必须且只能有一个，且不能嵌套在其他语义标签内

  这是辅助技术定位核心内容的唯一锚点。浏览器和读屏软件靠它跳过导航/侧边栏直达正文，SEO 也依赖它识别主干内容。一旦嵌套在

  或

  里，就等于告诉机器：“这段内容不是页面主体”，后果是可访问性降级、搜索引擎可能忽略正文权重。

  

  htmlppt.skill

  把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。

  下载

  • 检查 DOM：确保
    是 的直接子元素，且未被
    、
    、
    包裹
  • 不要用 CSS 隐藏
    后再另起一个“伪 main”；隐藏不影响语义解析，只会让结构树断裂
  • SPA 类应用中，路由切换时需动态更新
    内容，而非销毁重建——否则焦点管理失效

  不是“视觉分组”，必须自带主题和标题

  它代表文档大纲中的一个逻辑区块，浏览器会据此生成层级节点。没有

  –

  的

  等同于无效标签，不如用

  。

  • 轮播图、商品列表、卡片网格这类纯视觉模块，即使有 class="section"，也不该用
  • “兼容性说明”“示例代码”“性能对比”三块内容若各自有
    ，才适合分别用
    包裹
  • 内部不要再嵌套
    表达并列项；那是
    或多个
    并列的场景

  最容易被忽略的是

  和

  对

  解析的影响：

  自带 sectioning root，意味着其内部的

  被视为该区块最高级标题，而非整页的

  ；而

  内的

  会被降级为

  处理。这种隐式行为不报错，但会让大纲生成器输出不可预期的结果。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！