Розділ проти статті HTML5

У мене є сторінка, що складається з різних "розділів", таких як відеоролики, стрічка новин тощо. Я трохи заплутався, як їх представити з HTML5. В даний час я маю їх як HTML5 <section>, але при подальшому огляді виглядає, що правильнішим би тег був би <article>. Чи може хтось пролити на це світло на мене?

Жоден із цих речей не є публікаціями в блозі чи "документами" у справжньому сенсі цього слова, тому важко зрозуміти, який елемент застосувати.

Ура

EDIT: Я вирішив використовувати articleтег, оскільки він, здається, є контейнером тегів для непов'язаних елементів, які, напевно, є моїми "розділами". Однак ця стаття назви тегів здається досить оманливою, і, хоча вони говорять, що HTML5 був розроблений з більшою увагою для веб- додатків , я вважаю, що багато тегів є більш орієнтованими на блог / документ.

У будь-якому випадку, дякую за Ваші відповіді, це виглядає досить суб’єктивно.

На сторінці вікі W3 про структурування 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>

Схоже, вам слід загортати кожен із "розділів" (як ви їх називаєте) <article>тегами та записами статті у <section>тегах.

Специфікація HTML5 говорить (розділ):

Елемент розділу являє собою загальний розділ документа чи програми. У цьому контексті розділ - це тематичне групування змісту, як правило, із заголовком. [...]

Прикладами розділів можуть бути глави, різні сторінки з вкладками у діалоговому вікні з вкладками або нумеровані розділи дипломної роботи. Домашня сторінка веб-сайту може бути розділена на розділи для ознайомлення, новин та контактної інформації.

Примітка . Авторам рекомендується використовувати елемент статті замість елемента розділу, коли було б сенс синдикувати вміст елемента.

А для ст

Елемент статті являє собою самодостатню композицію в документі, сторінці, додатку або на сайті, і це, в принципі, незалежно розповсюджується або використовується повторно, наприклад, під час синдикації. Це може бути повідомлення на форумі, стаття в журналі чи газетах, запис у блозі, коментар, представлений користувачем, інтерактивний віджет або гаджет або будь-який інший незалежний вміст.

Я думаю, що те, що ви називаєте "секціями" в ОП, відповідає визначенню статті, оскільки я можу бачити, що вони є незалежними для розповсюдження або для багаторазового використання .

Оновлення: Деякі незначні зміни тексту для articleв той останні редактори проекту для HTML 5.1 (зміни курсивом):

Елемент статті являє собою повну або самостійну композицію в документі, сторінці, додатку або на сайті, і це, в принципі, незалежно поширюється або використовується повторно, наприклад, під час синдикації. Це може бути повідомлення на форумі, стаття в журналі чи газетах, запис у блозі, коментар, представлений користувачем, інтерактивний віджет або гаджет або будь-який інший незалежний вміст.

Крім того , обговорення на список розсилки Public HTML про articleв січні і лютому 2013 року.

Я б використав <article>для текстового блоку, який абсолютно не пов'язаний з іншими блоками на сторінці. <section>з іншого боку, це роздільник для відокремлення документів, які мають відношення один до одного.

Тепер я не впевнений, що у вас є у ваших відео, новинах і т.д.

<article>
    <h1>People</h1>
    <p>text about people</p>
    <section>
        <h1>fat people</h1>
        <p>text about fat people</p>
    </section>
    <section>
        <h1>skinny people</p>
        <p>text about skinny people</p>
    </section>
</article>
<article>
    <h1>Cars</h1>
    <p>text about cars</p>
    <section>
        <h1>Fast Cars</h1>
        <p>text about fast cars</p>
    </section>
</article>

Як бачимо, розділи все ще стосуються один одного, але поки вони знаходяться всередині блоку, який їх групує. Розділи DONT повинні бути всередині статей. Вони можуть бути в тілі документа, але я використовую розділи в тілі, коли весь документ - одна стаття.

напр

<body>
    <h1>Cars</h1>
    <p>text about cars</p>
    <section>
        <h1>Fast Cars</h1>
        <p>text about fast cars</p>
    </section>
</body>

Сподіваюся, це має сенс.

Мені подобається дотримуватися стандартного значення слів, що вживаються: "А" articleбуло б застосовано до статей. Я б визначив повідомлення в блогах, документи та статті новин як articles. Розділи, з іншого боку, стосуватимуться елементів компонування / ux: бічна панель, заголовок, колонтитул - це розділи. Однак це все моє особисте тлумачення - як ви вказали, специфікація цих елементів недостатньо чітко визначена.

Підтримуючи це, w3c визначає articleелемент як розділ вмісту, який може самостійно стояти самостійно. Повідомлення в блозі може стати самостійно як цінний та витратний предмет вмісту. Однак заголовок не буде.

Ось цікава стаття про одне божевільне божевілля у спробі розмежувати два нові елементи. Основний пункт статті, який я також вважаю правильним, полягає в тому, щоб спробувати використати те, що коли-небудь, який ви вважаєте себе найкращим, насправді являє собою те, що він містить.

Що більш проблематично, це те, що стаття та розділ настільки схожі. Все, що їх розділяє, - це слово «самодостатнє». Вирішити, який елемент використовувати, було б просто, якби існували якісь жорсткі правила. Натомість це питання тлумачення. Ви можете мати кілька статей у розділі, ви можете мати кілька розділів у статті та статті, ви можете вкладати розділи в розділах та статті у розділах. Ви вирішуєте, який елемент є найбільш семантично відповідним у будь-якій ситуації.

Ось дуже гарна відповідь на те саме запитання тут, на SO

Блок-схема наведена нижче може бути корисною при виборі одного з різних семантичних елементів HTML5:

Розділ

• Використовуйте це для визначення розділу вашого макета. Це може бути mid, left, right і т.д ..
• Це має сенс зв'язку з якимось іншим елементом, простіше кажучи, це ЗАВИСИМО.

Стаття

• Використовуйте це там, де у вас є незалежний контент, який має сенс самостійно.

• Стаття має своє повне значення.

Розділ - це в основному обгортка для h1(або інших hтегів) та вмісту, який відповідає цьому. По articleсуті, це документ у вашому документі, який повторюється або зберігається на сторінці ... як і будь-яка публікація блогу на вашому документі може бути статтею, або кожен коментар до вашого документа може бути статтею.

також для синдикованого вмісту "Авторам рекомендується використовувати елемент статті замість елемента розділу, коли було б сенс синдикувати вміст елемента".

Моя інтерпретація така: Я думаю, що в YouTube є розділ коментарів, а всередині розділу коментарів є кілька статей (у цьому випадку коментарі).

Отже, розділ схожий на контейнер div, який містить статті.

Стаття та розділ - це семантичні елементи HTML5. Розділ - це загальний розділ веб-сторінки на рівні блоку, але має відношення до вмісту нашої веб-сторінки. Стаття також є рівнем блоку, але стаття стосується окремої публікації в блозі, коментаря, веб-сторінки.

І стаття, і розділ повинні містити елементи заголовка h2-h6.

Для публікації в блозі використовуйте наступний синтаксис для статті та розділу.

<article>
         <h1>Heading 1</h1>
         <p>Article Description</p>
         <section id="sec1">
                <h2>Section Heading</h2>
                <p>Section Description</p>
         </section>
         <section id="sec2">
                <h2>Section Heading</h2>
                <p>Section Description</p>
         </section>
</article>