<section> или <article>, который содержится в

Пытаясь окунуться в новые семантические элементы в HTML5.

Использует ли <section> внутри <article> или наоборот? Это даже имеет значение?

Я смотрю на реструктуризацию блога Wordpress.

Ответ 1

Элемент section представляет собой общий документ или раздел приложения. Раздел в этом контексте представляет собой тематическую группировку контента, как правило, с заголовком и, возможно, нижним колонтитулом.

Элемент article представляет собой независимый раздел документа, страницы или сайта. Это может быть сообщение на форуме, журнал или газетная статья, запись в блоге, комментарий пользователя или любой другой независимый элемент контента.

Поэтому я бы сказал, что оба элемента section и article могут содержать другой элемент, если это необходимо. Я думаю, что ваша диаграмма имеет смысл, помимо вложенных элементов раздела:

Элемент сечения не является общим элементом контейнера. Когда элемент нужен для стилизации или для удобства написания сценариев, авторам рекомендуется использовать элемент div. Общее правило состоит в том, что элемент раздела подходит только в том случае, если содержимое элемента будет явно указано в схеме документа.

Может быть, использовать <div> для внешнего?

Ответ 2

На странице W3 wiki о структурировании HTML5 говорится:

<section>. Используется для группировки разных статей в разных целях или предметов или для определения различных разделов одной статьи.

И затем отображает изображение, которое я очистил:

Также важно знать, как использовать тег <article> (из той же самой ссылки W3 выше):

<article> связан с <section>, но отчетливо отличается. В то время как <section> предназначен для группировки отдельных разделов контента или функциональность, <article> предназначена для хранения связанных лиц автономные фрагменты контента, такие как отдельные сообщения в блогах, видеоролики, изображений или новостей. Подумайте об этом так: если у вас есть элементы контента, каждая из которых была бы пригодна для чтения на их и имеет смысл синдицировать как отдельные элементы в RSS, тогда <article> подходит для их маркировки.

В нашем примере <section id="main"> содержит записи в блоге. Каждый блог запись будет подходящей для синдикации в качестве элемента в RSS-канале и будет иметь смысл, если читать самостоятельно, вне контекста, поэтому <article> идеально подходит для них:

<section id="main">
    <article>
      <!-- first blog post -->
    </article>

    <article>
      <!-- second blog post  -->
    </article>

    <article>
      <!-- third blog post -->
    </article>
</section>

Проще, да? Имейте в виду, что вы можете также вставлять разделы внутри статьи, где это имеет смысл сделать это. Например, если каждый из эти сообщения в блоге имеют согласованную структуру отдельных разделов, затем вы можете разместить разделы внутри своих статей. Он мог бы выглядеть что-то вроде этого:

<article>
  <section id="introduction">
  </section>

  <section id="content">
  </section>

  <section id="summary">
  </section>
</article>

Ответ 3

Я бы использовал div для внешнего и div для внутреннего, если у вас есть заголовок непосредственно внутри внутреннего раздела.

Та

Рич

Подробнее см. http://html5doctor.com/the-section-element/.

Ответ 4

IMOO, это должно быть просто, так же просто, как обычные люди будут считать это само собой разумеющимся. Если простое имя тега смешивает людей, это неудачно. Для меня:

An <article> - это статья. Люди делятся статьями. Когда вы говорите, что что-то есть статья, я ожидаю, что она должна иметь title, и, может быть, небольшую сводку, поэтому я могу решить ее прочитать или нет. Если это интересно, я поделюсь им с друзьями. Это самодостаточно.
A <section> - это раздел. Это часть связанных вещей. В принципе, вам понадобятся другие разделы, чтобы получить всю картину.

Почему вы положили <section> внутри <body>? О, потому что это часть тела; часть моего сайта. Я собираюсь поместить свои статьи в эту часть.

Почему вы помещаете <section> внутри <section>?. Потому что это часть этого раздела.