在链接

Question

有时当我在网站上工作并且网页设计有类似盒子（尤其是网格商店的网格产品）时，我倾向于犹豫是否要将整个盒子作为链接。例如：

<a class="product-box" href="/product/123">  
    <img src="/someimage.jpg">
    <h3>My product</h3>  
    <span class="price">1000$</span>  
    <button>See detail</button>  
</a>

当这些类似盒子的元素是整个链接时，对我来说似乎更加用户友好，因为当在移动设备上时，点击一个小按钮就更难了。但是，我不相信这样做之后是否对搜索引擎优化没有负面影响。当一大块HTML包含在<a>标记中时，我觉得很奇怪。

很难找到关于此事的任何讨论，所以任何意见都表示赞赏。

Answer 1

这是valid in HTML5，因此您可以在链接中包装块级元素。这是关于这个问题的another article。

也就是说，谷歌仍然对这种做法持谨慎态度。根据{{​​3}}的这个帖子，Google的John Mu说：

  

这种用法[包装链接中的块级元素]对我们来说没问题 - 我们仍然会选择链接，并且   能够将您的文本作为锚点与之关联。我们＆＃39;再   解析HTML非常灵活，所以你甚至可以使用它   使用HTML4。也就是说，你制作锚文本越清楚   我们更容易理解链接的上下文，所以我   不一定总是使用整个段落作为锚点   所有内部链接。

简而言之，将整个元素包装在链接中会使Google难以理解链接的上下文。