Estou fazendo a marcação dos produtos listados na home, estou utilizando HTML5 para estruturar as páginas, minha intenção é definir um conteúdo semântico. Pois então me deparei com as seguintes possibilidades de marcação:
Envolver a vitrine de produtos com uma section e listar os produtos como uma lista.
<section>
<h1>Semana da tecnologia</h1> <!-- Titulo da vitrine de produtos-->
<ul>
<li>
<div></div> <!-- Aqui é o wrap do produto (titulo, foto, preco, etc...) -->
</li>
<li>
<div></div> <!-- Aqui é o wrap do produto (titulo, foto, preco, etc...) -->
</li>
</ul>
</section>
Ou ao inves de lista usar article para cada produto
<section>
<h1>Semana da tecnologia</h1> <!-- Titulo da vitrine de produtos-->
<article></article><!-- Aqui é o wrap do produto (titulo, foto, preco, etc...) -->
<article></article><!-- Aqui é o wrap do produto (titulo, foto, preco, etc...) -->
</section>
Acredito eu que ambas as formas oferecem um marcação semântica para o conteúdo, porém por qual deveria optar?