Подтвердить что ты не робот

Семантически, что является более правильным: a в h2, или h2 в a?

Я застрял, решив, что использовать, как оба, кажется, работают.

Должен ли я размещать ссылки <a> внутри элементов <h2>?

Или наоборот?

Каков правильный стандарт?

4b9b3361

Ответ 1

Вы можете размещать элементы <h2> только внутри элементов <a>, если вы работаете с HTML5, который допускает любые другие элементы в <a> элементах. Предыдущие спецификации (или текущие, но вы хотите посмотреть на них) никогда не допускали этого.

Обычный способ сделать это - разместить <a> внутри <h2>. Это работает, всегда работало и было единственным действительным способом сделать это до HTML5 для ссылок на ссылки, поскольку ссылка ссылается на текст в этом заголовке. Вам редко приходится размещать <h2> внутри <a>, если только <h2> не является частью более сложной структуры, которая функционирует как гиперссылка в целом.

Ответ 2

Также он не работает так же, есть одна большая разница.

Если вы поместите <h2> в <a>, весь блок (например, строка) заголовка будет работать как ссылка.

Однако, если вы поместите <a> в <h2>, только видимый текст будет работать как ссылка. (вы можете проверить его с помощью изменения курсора)

Ответ 4

Ответ заключается в том, что это зависит...

На веб-сайте W3C, а именно на странице HTML5-семантики, ясно, что элементы h2 (как и все другие теги заголовков) имеют как контент-модель "Содержание фраз".

Теперь, следуя ссылку на содержание фразы, вы получите следующее описание:

Содержание фразы - это текст документа, а также элементы, которые отметьте этот текст на уровне внутри абзаца. Задания фразы абзаца формы содержания.

и в следующем списке у вас есть этот фразинг-контент:

a (если он содержит только текст фразы)

Итак, если тег a содержит только фраз-содержимое, HTML5 позволяет содержать его в теге h2.

Viceversa, текстовая страница уровня текста описывает модель содержимого элемента a следующим образом:

Прозрачный, но не должно быть потомков интерактивного контента.

Следуя Прозрачная ссылка, в конце описания найдено следующее:

Когда у прозрачного элемента нет родителя, тогда часть его содержимого модель, которая является "прозрачной", должна рассматриваться как принятие любых потока.

Так как в h2 описании тега говорится:

Контексты, в которых этот элемент может использоваться:     Где ожидается содержимое потока.

a h2 тег может рассматриваться как содержимое потока.

Итак, если тег a не имеет родителя, в HTML5 он должен рассматриваться как принятие любого содержимого потока, включая теги h2.

Ответ 5

HTML позволяет вещи внутри тегов <a>

У меня есть это...

<header>
  <a href="/home">
    <h1>Main heading</h1>
    <h2>Sub heading</h2>
  </a>
</header>

И это работает для меня.

Весь текст заголовка, включая подзаголовок, можно щелкнуть, как я хочу. Я не знаю, как лучше это сделать с помощью html 5.

Ответ 6

Спецификации W3C для h2 говорят, что его разрешенные родительские элементы - это все, что может содержать элементы потока или hgroups. спецификации для разрешающих родительских элементов, которые могут содержать элементы выражения или потока. h2 может содержать содержание фраз, а также может содержать словосочетание или поток, поэтому на основе спецификации кажется, что это разрешено.

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