html - 链接多个元素？

Question

我有一张图片，下面是标题和副标题。列表中有许多这样的东西。单击它们会转到一篇文章。

<li>
    <div class="img-container"><img src="test.jpg"></div>
    <h2>The Title</h2>
    <p>The sub title</p>
</li>

我需要链接以上内容。我希望用户能够点击图片、标题或副标题来访问文章页面。

我是否应该包装每个元素并创建 3 个链接:

<li>
    <div class="img-container"><a href="/whatever"><img src="test.jpg"></a></div>
    <h2><a href="/whatever">The Title</a></h2>
    <p><a href="/whatever">The sub title</a></p>
</li>

或者我应该包装整个 block :

<li>
    <a href="/whatever">
        <div class="img-container"><img src="test.jpg"></div>
        <h2>The Title</h2>
        <p>The sub title</p>
    </a>
</li>

这两种方法都会对 SEO 产生影响吗？可用性？

Answer 1

谷歌 used to have a limit关于页面上的链接数量；减少链接的数量(尤其是指向同一个地方的链接)被认为是有利的。因此，我建议您使用第二个选项来包装 <li> 的内容。在<a>标签。