Question

我有一个带有最新消息和随机博客文章等的侧边栏

<nav id="sidebar">
  <section id="latest_news">
    <h1>
      Latest News 
    </h1>
    <h2>
      <a href="/path/to/article">News Item 1</a>
    </h2> 
    <p>
      Truncated text from the news item in question
    </p>
    <a href="/news" title="View all news items" class="index">View all news items</a>
  </section>

  <section id="random_blog_post">
    <h1>
      Random Blog Post 
    </h1>
    <h2>
      <a href="/path/to/blog/post">Blog Post 1</a>
    </h2>
    <p>
      Truncated text from the random blog post in question
    </p>
    <a href="/blog" title="View all blog posts" class="index">View all blog posts</a>
  </section>
</nav>

正如你所看到的，我的导航中有部分，h1和段落。

我只是想知道这是否允许或考虑好的做法。是否有更好的语义（或更少）方法来标记和构建此类侧边栏内容？

Answer 1

是的，这看起来非常有效html5。 w3org导航example，其中包含h1标签。

Answer 2

是的，您可以这样做，如spec

中所述

与您的问题特别相关的报价：

nav元素代表一个部分链接到其他页面的页面到页面内的部分：一节带导航链接。

和

nav元素不必包含列表，也可以包含其他类型的内容。在此导航栏中，链接以散文形式提供：

 <nav>
 <h1>Navigation</h1>
 <p>You are on my home page. To the north lies <a href="/blog">my
 blog</a>, from whence the sounds of battle can be heard. To the east
 you can see a large mountain, upon which many <a
 href="/school">school papers</a> are littered. Far up thus mountain
 you can spy a little figure who appears to be me, desperately
 scribbling a <a href="/school/thesis">thesis</a>.</p>
 <p>To the west are several exits. One fun-looking exit is labeled <a
 href="http://games.example.com/">"games"</a>. Another more
 boring-looking exit is labeled <a
 href="http://isp.example.net/">ISP™</a>.</p>
 <p>To the south lies a dark and dank <a href="/about">contacts
 page</a>. Cobwebs cover its disused entrance, and at one point you
 see a rat run quickly out of the page.</p>
</nav>

Answer 3

实际上，您甚至可以将h1元素编写为nav元素的直接子元素，以便nav元素在文档的大纲中命名。

我建议阅读有关标题和文件大纲重要性的内容： http://dev.w3.org/html5/spec-author-view/headings-and-sections.html#outline

您可以使用此在线工具查看文档的大纲： http://gsnedders.html5.org/outliner/

问候。

HTML5 - <p>和</p> <h1>被视为<nav>的有效内容？</nav> </h1>

3 个答案: