<div> в пределах <a>, SEO оптимизация

Question

У меня есть список статей (ul). Я хочу, чтобы каждый элемент списка ul активировался (ширина 100%) в качестве якоря.

Какой подход лучше (по мнению SEO и ботов Google)?

1) HTML5 позволяет поместить <div> в <a>, поэтому мой код действителен (я проверил его в валидаторах html5). То же самое относится и к веб-сайту Apple.com (элемент h1-block - внутри якоря).

<ul>
  <li><a href="#"><div>Category</div><div>Title</div><div>Popularity</div></a></li>
  ...
</ul>

2) Я также могу установить позицию li как относительную, а затем использовать в качестве ссылки только заголовок, но этот якорь будет иметь позицию position: absolute; и правильное заполнение, чтобы заполнить всю 100% высоту и 100% ширину li. В этом случае на весь элемент li можно кликнуть, но этот подход кажется не элегантным (в CSS), но он также действителен для html 4.01 и xHTML

<ul>
  <li><div>Category</div><a href="#">Title</a><div>Popularity</div></a></li>
  ...
</ul>

Answer 1

Что вас беспокоит? Будет ли взята сама ссылка или использован якорный текст?

Google обязательно выберет саму ссылку, поэтому проблем там нет.

Однако может возникнуть путаница по поводу того, с каким якорным текстом вы ссылаетесь (и впоследствии с намерением / семантикой ссылки). Возможно, вы могли бы помочь с помощью тега title на привязке.

Я ожидаю, что якорный текст будет выглядеть как "Популярность заголовка категории". Само по себе это бессмысленно, поэтому я полагаю, что это не проблема для вас, но я, так как вы заинтересованы в SEO, добавьте соответствующий заголовок к вашей ссылке.