如何使用HTML5 / Aria正确标记子导航

Question

我有一些HTML基本上看起来像下面：

<section>
    <h1>Release Notes for 1.0</h1>
    <aside class="versions">
        <h1>Other Versions</h1>
        <ul>
            <li><a href="?ver=3.0">3.0</a></li>
            <li><a href="?ver=2.0">2.0</a></li>
            <li class="active">1.0</li>
        </ul>
    </aside>
    <p>Information...</p>
</section>

我可能弄错了，但为此使用 <nav> 元素似乎不合适。使用role="contentinfo"似乎也不合适。

标记版本列表以避免与当前标题为"1.0 发行说明"的部分错误关联的正确方法是什么？

Answer 1

我认为如果真的是导航不同发行说明的（子）菜单，以下结构会更合适：

<div> <!-- maybe use 'section' instead; depends on whole page structure -->
  <nav>
    <h1>All release notes</h1>
    <ul><!-- … --></ul>
  </nav>
  <article> <!-- instead of 'section' -->
    <h1>Release Notes for 1.0</h1>
    <p><!-- … --></p>
  </article>
</div>

当链接的意思是"您可能也对...感兴趣"时，您的示例似乎是合适的，但不能作为导航到其他发行说明文档的主要方法。但在这种情况下，我不会将当前文档包含在此列表中（就像您对<li class="active">1.0</li>所做的那样）。