Статьи, раздела или div для списка продуктов?

В настоящее время я работаю над проектом электронной коммерции и не могу решить, использовать ли статью, раздел или div для упаковки списка продуктов.

После него есть несколько разделов для таких вещей, как promos, и я не хочу использовать div, так как следующие разделы будут иметь большее значение и подрывать его, однако оно должно иметь большее значение, чем следующие разделы.

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

Ответы

Ответ 1

section спецификация очень полезна:

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

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

Если несколько элементов тематически связаны и могут быть сгруппированы вместе под общим заголовком (например, "Обувь" ), затем заверните продукты в section.

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

Для полноты тег article представляет (с той же страницы):

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

поэтому ваши товары для продажи будут article section в section.

В качестве заключительного примечания стороны, я бы не обернул всю страницу в <div role="main">: наверняка заголовок сидит вне основного содержимого.