Meilleure solution pour faire des liens sur des blocs en HTML5

Cela fait un ptit moment que je me pose la question.
Désormais, en HTML 5 ce code est valable :

Code:

<h1>Les actualités de ma société</h1>

<section id="news">
<a href="lien1">
 <article>
  <h2>Le titre de la news 1 </h2>
  <p>Un petit résumé de la news 1</p>
 </article>
</a>

<a href="lien2">
 <article>
  <h2>Le titre de la news 2 </h2>
  <p>Un petit résumé de la news 2</p>
 </article>
</a>
...
</section>

Mais n'est-il pas mieux d'écrire ça :

Code:

<h1>Les actualités de ma société</h1>

<section id="news">

<article>
  <h2><a href="lien1">Le titre de la news 1 </a></h2>
  <p>Un petit résumé de la news 1</p>
</article>

<article>
  <h2><a href="lien2">Le titre de la news 2 </a></h2>
  <p>Un petit résumé de la news 2</p>
</article>

...
</section>

Et pour simuler le clic sur Article, j'utiliserais du jQuery.

Que faites vous dans ce cas là ? solution 1 ou solution 2 ?

 

Personne ne se prononce ? :cry: