Семантически правильный HTML5 для сгруппированного списка «время» с дочерним списком «время»

В списке элементов, сгруппированных по годам, а затем перечисленных по дате (например, вложение списка сообщений в блоге в список лет, которые охватывают эти сообщения), следует ли использовать элемент времени для группировки по годам (как в приведенном ниже фрагменте) или только при маркировке конкретной даты для элементов списка потомков?

<ol reversed>
  <li>
    <time>2018</time>
    <ol reversed>
      <li><time datetime="2018-05-15">May 15</time> Article4</li>
      <li><time datetime="2018-01-02">Jan 02</time> Article3</li>
    </ol>
  </li>
  <li>
    <time>2017</time>
    <ol reversed>
      <li><time datetime="2017-12-31">Dec 31</time> Article2</li>
      <li><time datetime="2017-10-19">Oct 19</time> Article1</li>
    </ol>
  </li>
</ol>

html semantics
person Josh Klein    schedule 02.02.2019    source источник

Ответы (1)


arrow_upward
1
arrow_downward

В соответствии с mdn элемент времени может представлять один из следующее:

  1. Время в 24-часовом формате.
  2. Точная дата по григорианскому календарю (с дополнительной информацией о времени и часовом поясе).
  3. Действительная продолжительность времени .

Что касается вашего кода, элементы, сгруппированные по годам, больше подходят для заголовков/заголовков, а не элементов времени, поэтому вместо этого вы можете использовать эту разметку:

<section>
  <h3>2018</h3>
  <ol reversed>
    <li><time datetime="2018-05-15">May 15</time> Article4</li>
    <li><time datetime="2018-01-02">Jan 02</time> Article3</li>
  </ol>
</section>
<section>
  <h3>2017</h3>
  <ol reversed>
    <li><time datetime="2017-12-31">Dec 31</time> Article2</li>
    <li><time datetime="2017-10-19">Oct 19</time> Article1</li>
  </ol>
</section>

(Связанный вопрос SO)

Удачи!

person A. Meshu    schedule 02.02.2019
comment
Спасибо. Оглядываясь назад, кажется неразумным думать о группах по годам как о членах упорядоченного списка. Разделы кажутся более подходящими для этого случая. - person Josh Klein; 03.02.2019