搜索表单应放入header仅当其服务于页面级导航，需满足作用域匹配、功能从属性和可访问性支持三原则；全站搜索放页面header，文章内搜索则置于article的header中。

应该包含，但前提是它属于该

语义范围内的引导性内容。

搜索表单本身不是必须放进

的“装饰项”，而是要看它服务的对象——如果搜索功能面向整个页面（如全站搜索），且位于页眉区域，那它天然属于页面级

的语义职责；如果只是某篇文章内部的“站内搜索本页”，则应放在对应

或

的

里，而非全局页眉。

判断搜索表单是否该进 header 的三个关键点

• 作用域匹配：搜索框是否服务于当前

所代表的节（sectioning root 或 section）。例如，首页

里的搜索框默认搜全站，合理；而一篇博客文章

的

里放个“搜本文”，也合理。但把“搜商品”的搜索框塞进“关于我们”页面的

里，就错位了。

• 功能从属性：搜索是导航辅助手段，和 logo、主导航同属“引导用户快速定位内容”的一类。它不承载正文，也不提供收尾信息，符合

定义中“introductory or navigational aids”的定位。

• 可访问性支持：屏幕阅读器会将

内所有内容（包括

）视为该区域的入口工具集。若搜索框被孤立放在

里，它就失去上下文关联，键盘用户难以预判其用途；放进

后，配合和适当的ARIA标注（如aria-label="全站搜索"），能显著提升操作效率。

常见错误与替代方案

• 把搜索当样式容器用：仅因视觉上在顶部，就用

包住搜索框+广告图+轮播图——后两者完全不属于引导性内容，应移出

，改用

或

。

Showrunner

Showrunner是一款AI文本写作工具，AI动画视频剧集生成工具。

下载

• 忽略标题锚点：只放搜索框，不配任何

–

。此时

语义失效，建议至少加一个隐式标题，比如：

网站导航与搜索

…

。

• 跨节混用：在

的

里放全站搜索，逻辑上割裂——该

的服务对象是这篇文章，不是整个站点。此时应保留全局

里的主搜索，文章内如需搜索，宜用独立组件或链接跳转。

实际结构建议

• 全站搜索（页面级

）：

  

我的网站

  

…

  

    搜索全站
    
  

• 文章内搜索（

级

）：

  

    

如何使用 header 标签

    

作者：张三｜发布于 2026-06-20

    

      
    

  

  

正文开始…