Какая семантика лучше для списка статей?

Я спрашивал себя о разметке списка записей в блоге.

Что может быть так:

Случай 1:

<article>...</article>
<article>...</article>
<article>...</article>

или случай 2:

 <ol reversed>
    <li><article>...</article></li>
    <li><article>...</article></li>
    <li><article>...</article></li>
 </ol>

Пример выглядит логичным: "это список записей по порядку дат"

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

<ol>
     <li><section><h1>step 1</h1></section></li>
     <li><section><h1>step 2</h1></section></li>
     <li><section><h1>step 3</h1></section></li>
</ol>

Чтобы получить план, как:

product name
    description
    how to use
       step 1
       step 2
       step 3
    customer reviews
    etc

Как вы думаете, это слишком много разметки для этого контента?

Моя цель - получить лучший синтаксис и схему HTML5, но я не хочу заполнять HTML бесполезными тегами.

РЕДАКТИРОВАТЬ: реальный вопрос не в том, что лучше, а в том, чтобы узнать, что разработчики думают об этом по-разному. Потому что есть много способов сделать что-то, но иногда, если 2 способа верны, возможно, есть более "логичный" или "соответствующий" способ сделать это.

2 ответа

ol должен использоваться только в том случае, если "изменение порядка изменит смысл". То, что контент как-то отсортирован, не обязательно означает, что ol является целесообразным.

Если вы должны использовать список (будь то ol или же ul) зависит от вашего фактического содержания и его контекста, на него нельзя ответить вообще. Спецификация HTML5 определяет эти списки как "список элементов", не указывая, что это за список или что квалифицируется как элемент.

Возможное / субъективное эмпирическое правило (со многими исключениями): посмотрите на свой контент и спросите себя, назовете ли вы его списком, и можете ли вы изобразить его с типичными пунктами.

Страница под названием "Блог", на которой отображаются 10 полнотекстовых сообщений в блоге? Возможно нет.
Боковая панель под названием "Похожие сообщения", отображающая 10 ссылок на сообщения в блоге? Вероятно, да.

Это говорит о том, что "сложность" контента также может играть роль, поэтому другое возможное / субъективное практическое правило (с еще большим количеством исключений): если элемент имеет заголовок (т. Е. Это раздел) и длинный контент, вы можете не нужен список.

Шаги, чтобы использовать продукт, где каждый шаг состоит из длинных объяснений с изображениями? Возможно нет.
Шаги по использованию продукта, где каждый шаг состоит из короткого предложения? Вероятно, да.

Согласен с unor.

Согласно стандарту:

Хотя включение элементов заголовка (например, h1) внутри элементов li допустимо, это, скорее всего, не передает семантику, задуманную автором. Заголовок начинает новый раздел, поэтому заголовок в списке неявно разбивает список на несколько разделов.

https://html.spec.whatwg.org/multipage/grouping-content.html#the-li-элемент

Так что я думаю, что если контент может иметь заголовок - его не следует включать в список.

Другие вопросы по тегам