HTML5中<nav>与搜索表单元素的语义使用

san*_*ark 9 html5 accessibility screen-readers nav semantics

对于<nav>标记,W3C定义似乎有点模糊:

nav元素表示链接到其他页面或页面中的部分的页面的一部分:带有导航链接的部分.

并非页面上的所有链接组都必须位于nav元素中 - 该元素主要用于由主要导航块组成的部分.特别是,页脚通常具有指向站点的各个页面的短链接列表,例如服务条款,主页和版权页面.单独的页脚元素足以满足这种情况; 虽然在这种情况下可以使用nav元素,但通常是不必要的.

针对可以从初始渲染中省略的导航信息中受益的用户的用户代理(例如屏幕阅读器),或者可以从导航信息立即可用中受益的用户代理(例如屏幕阅读器)可以使用该元素作为确定上述内容的方式.最初跳过和/或提供请求的页面.

基于对其定义的非常严格的解释以及我通过验证遇到的内容,看起来好像<nav>应该只包含列表元素.但是,不应该将搜索视为一系列页面中的导航形式吗?

虽然我理解它的主要用途是用户代理,但如果前者只作为后者的容器,那么拥有<nav>前面的<ul>标记似乎仍然是多余的.如果<nav>可以包含与导航相关的其他元素,而不仅限于链接列表,那将更有意义.

例如:

<nav role="navigation">
  <form action="http://google.com/search" method="get">
    <fieldset role="search">
       <input type="hidden" name="q" value="site:mysite.com" />
       <input class="search" type="text" name="q" results="0" placeholder="Search"/>
    </fieldset>
  </form>

  <ul class="top-navigation">
     <li><a href="/">Home</a></li>
     <li><a href="/about.html">About Me</a></li>
     <li><a href="/archive.html">Archives</a></li>
  </ul>
</nav>
Run Code Online (Sandbox Code Playgroud)

除了验证,这是不是可以接受的用途<nav>?与确保屏幕阅读器和其他辅助工具可以正确呈现页面相比,对于较少关注验证的人会产生什么影响呢?

Ian*_*lin 9

nav元素应该用于网站的主要导航项目,而不仅仅是所有导航项目.它也不必包含一个ul但是因为大多数时候它确实包含一个列表,所以它通常是有意义的,但不是必需的.

如果您的搜索是您网站的主要导航方法,那么请务必将其放在a中nav,尽管从上面给出的示例中,该列表似乎是主导航而不是您的搜索.

我写了一些关于使用nav标签来导航或不导航?虽然它没有提到搜索,但这是一个有趣的观察.