微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

HTML5中的语义用法与搜索表单元素

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

The nav element represents a section of a page that links to other pages or to parts within the page: a section with navigation links.

Not all groups of links on a page need to be in a nav element — the element is primarily intended for sections that consist of major navigation blocks. In particular,it is common for footers to have a short list of links to varIoUs pages of a site,such as the terms of service,the home page,and a copyright page. The footer element alone is sufficient for such cases; while a nav element can be used in such cases,it is usually unnecessary.

User agents (such as screen readers) that are targeted at users who can benefit from navigation information being omitted in the initial rendering,or who can benefit from navigation information being immediately available,can use this element as a way to determine what content on the page to initially skip and/or provide on request.

基于对其定义的非常严格的解释以及我通过验证遇到的内容,它看起来好像是< 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>

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

解决方法

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

如果您的搜索是您网站的主要导航方法,那么无论如何都要将其放在导航中,尽管从上面给出的示例中,列表似乎是主导航,而不是您的搜索.

我已经写了一些关于在to nav or not to nav?使用nav标签内容,虽然它没有提到搜索,这是一个有趣的观察.

原文地址:https://www.jb51.cc/html5/168434.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。