как смешивать ссылки (тег <a>) и заголовки (тег <h1>) в веб-стандарте?

Какой правильный код для создания ссылки с заголовком 1 в соответствии с веб-стандартами?

это

<h1><a href="http://stackoverflow.com"> stackoverflow </a></h1>

или

<a href="http://stackoverflow.com"><h1> stackoverflow </h1></a>

Благодарность

Согласно веб-стандартам вам не разрешается помещать блочные элементы во встроенные элементы.

Как h1блочный элемент, так и aвстроенный элемент, правильный способ:

<h1><a href="#">This is a title</a></h1>

Вот ссылка, по которой вы можете узнать больше: w3 Модель визуального форматирования

Однако есть исключение: в HTML5 допустимо заключать элементы уровня блока (например div, pили h*) в теги привязки. Обертывание блочных элементов во встроенные элементы, отличные от якорей, по-прежнему противоречит стандартам.

HTML5 обновляет эту тему: теперь можно заключать элементы уровня блока в A, как указано в другом вопросе: https://stackoverflow.com/a/9782054/674965 и здесь: http://davidwalsh.name/html5- элементы-ссылки

Насколько я понимаю, HTML5 позволяет вам заключать элементы уровня блока в теги ссылок. Однако ошибки могут появляться в старых браузерах. Я столкнулся с этим в Firefox 3.6.18 и в мой код вставил moz-rs-heading = "". Таким образом мои стили сломались. Если вам нужен обходной путь, вы можете обернуть теги ссылок в div. Следующее дает лучшее объяснение того, почему работает дополнительный код http://oli.jp/2009/html5-block-level-links/

a > h1 вызовет трудности при выделении текста

Поскольку оба варианта полностью действительны в HTML5, лучше использовать h1 > a