Можете ли вы использовать элемент <aside> внутри элемента <section role = "main">?

Question

Я в процессе улучшения доступности в своем HTML, используя HTML5 и WAI-ARIA.

У вас есть следующие настройки?

<!-- 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" контейнера. Это имеет значение?

Answer 1

Это имеет значение. Куда поместить это определяется тем, как содержимое в теге aside относится к основному 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

Answer 2

Да, его <aside> внутри <section> отлично действует наценка и будет проходить проверку W3C , если это то, о чем вы беспокоитесь.

Элемент <section>allows flow content inside, который может содержать элемент <aside>. Однако, если вы используете только разделы для стилизации, скорее всего, вы должны использовать div.

Помимо этого (каламбур) У меня есть сомнения в role=main части является действительной - according to this, единственной роль, значение, разрешенное на <section> элементах атрибутов приведены ниже:

По умолчанию ARIA семантика:

role=region.

Какие еще роли, состояния и свойства ARIA могут использоваться?

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

Любые глобальные атрибуты aria-* и любые атрибуты aria- *, применимые к разрешенным ролям.

Который, в частности, не включает роль main.

Answer 3

Я соглашусь с Дарреном относительно того, где вы отбрасываете тег. Кроме того, ваша маркировка немного странная. Различные теги имеют роли WAI-ARIA изначально, да и вы можете перезаписать собственные роли, но зачем вам?Это post about WAI-ARIA в блоге группы Paciello рассказывает об этом больше. Пример:

Insstead использования

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

вы могли бы просто использовать <main>, что означает то же самое, и лучше практики. В теге <aside> добавлена ​​дополнительная роль, так как это говорит о том, что Мое имя Райан, действительно мое имя - это Ryan.

Answer 4

Спецификация (editor's draft, который уже включает в себя main) не позволяет гнездо main элемента внутри article, aside, footer, header или nav, но он ничего не знаю о гнездовании этих элементов внутри main не говорит. Он также содержит два примера, которые используют article и nav (внутридокументная навигация) внутри main. Таким образом, должно быть разрешено, по меньшей мере, aside, вложенное в article или section (и, следовательно, доведенное до уровня). Я также могу представить случай, когда часть содержимого с некоторой дополнительной информацией внутри (например, в aside usage examples в WCAG Wiki) может сформировать вместе основное содержимое страницы, поэтому я не думаю, что это было бы разумно.

С другой стороны, алгоритм очертания (который теперь, как представляется, основная причина существования всего sectioning content, в том числе aside) по-прежнему отмечается as being 'at risk', поэтому определение этих элементов может измениться, и могут быть добавлены некоторые разъяснения ,

Возможно, мы должны задать этот вопрос редакторам спецификаций HTML5?