Можно ли использовать элемент внутри элемента?

Я в процессе улучшения доступности в моем 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" контейнер. Разве это имеет значение?

16
accessibility html html5 wai-aria

4 ответов

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

17

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

на <section> элемент позволяет содержание потока внутри которые могут включать <aside> element-однако, если вы используете разделы только для стилизации, вы, вероятно, должны использовать div вместо этого.

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

семантика арии по умолчанию:

role=region.

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

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

любой мировой aria-* атрибуты и любые Aria - * атрибуты, применимые к разрешенные роли.

который довольно заметно не включает main роль.

7

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

С другой стороны, алгоритм контура (который теперь кажется основной причиной существования всех содержание секционирования, включая aside) по-прежнему характеризуется как "в опасности", таким образом, определение этих элементов может измениться, и могут быть добавлены некоторые разъяснения.

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

3

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

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

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

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

2