问问题
15294 次
18

我正在使用 HTML5 和 WAI-ARIA 改进我的 HTML 的可访问性。

可以进行以下设置吗？

<!-- main content -->
<section id="main" role="main">
    <h1>The main content</h1>

    <!-- This div needs to be here for styling reasons -->
    <div class="the-content">    
         <p>All the text that goes with the main content</p>
    </div>

    <!-- the sidebar -->
    <aside id="sidebar" role="complementary">
        <h2>A title</h2>
        <p>Some text</p>
    <aside>
</section>

我不确定的是我是否应该将<aside>元素放在<section>容器role="main"之外。这有关系吗？

4

4 回答 4

17

是的，这很重要。将它放在哪里取决于aside标签中的内容与 main的关系section。

例如：

如果 中的内容aside与主条目相关，则应该在main section. 但是，如果里面的内容sidebar aside tag不同，main我会把它放在外面main section

http://html5doctor.com/aside-revisited/

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/aside

于 2013-07-09T13:49:28.750 回答
8

是的，它<aside>内部<section>是完全有效的标记，并且将通过 W3C 验证，如果这是您所担心的。

该<section>元素允许其中可能包含该元素的流内容<aside>- 但是，如果您仅将部分用于样式目的，则可能应该使用 div 代替。

除此之外（双关语）我怀疑这role=main部分是否有效——据此，元素上允许的唯一角色属性值<section>如下所示：

默认 ARIA 语义：

role=region.

可以使用哪些其他 ARIA 角色、状态和属性？

alert, alertdialog, application, contentinfo, dialog, document, log, marquee, search, 或status.

适用于允许角色的任何全局aria-*属性和任何 aria-* 属性。

值得注意的是，其中不包括该main角色。

于 2013-07-09T13:50:08.763 回答
3

规范（已经包含的编辑草稿main）不允许将main元素嵌套在article, aside,或中footer，但它没有说明将这些元素嵌套在. 它还提供了两个在内部使用和（文档内导航）的示例。因此，至少应该允许嵌套在or中（并因此限制在其级别）。我也可以想象这样的情况，其中包含一些补充信息的部分内容（如 WCAG Wiki 中的使用示例）可能会形成页面的主要内容，所以我认为禁止它是不合理的。headernavmainarticlenavmainasidearticlesectionaside

另一方面，大纲算法（现在似乎是所有分段内容存在aside的主要原因，包括添加。

也许我们应该向 HTML5 规范编辑器提出这个问题？

于 2013-07-09T16:35:24.270 回答
2

关于您将标签放在哪里，我会同意 Darren。另外，你的标签有点古怪。各种标签本身都有 WAI-ARIA 角色，虽然是的，你可以覆盖原生角色，但你为什么要这样做？Paciello Group 博客上关于 WAI-ARIA的这篇文章对此进行了更多讨论。前任：

而不是使用

<section id="main" role="main">

你可以只使用<main>，这意味着同样的事情，更好的做法。该<aside>标签具有原生添加的互补作用，所以就像说 My name is Ryan，真的我的名字是 Ryan。

于 2013-07-09T14:45:45.863 回答