Html5: заголовки в элементах секционирования - наброски документа и последствия для SEO

В html5 spec говорится, что:

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

и те же рассуждения применимы к алгоритму html5.

Я проверял схему своего сайта, используя инструмент HTML5 outliner (h5o) [, но мне трудно достичь четкого плана, который не перегружены бесполезными заголовками из-за того, что в вашей схеме будут отображаться такие элементы, как

2 ответа

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

Именно так я и делал это, на самом деле на самом деле не нужно было создавать сайт HTML5, но довольно забавно Я заглянул в это некоторое время назад.

"заголовки" или названия разделов, отлично подходят для создания структуры или схемы документа (как показано на outliner). Они также очень полезны для пользователей Assisted Technology, которые могут в основном найти свой путь вокруг сайта путем "табуляции" через заголовки без необходимости "слушать" все и пытаться выяснить, куда вы могли бы положить, например. в поле поиска.

Вот почему я вижу, что заголовки/заголовки должны быть там, даже если они скрыты от визуального просмотра пользователями (и наследуют SE;))

Не все методы скрытия CSS равны

ОК, поэтому я знаю, что мы не можем списать SE, поэтому важно, чтобы вы выбрали скрытие заголовков, поскольку вы хотите, чтобы они были доступны для пользователей AT (Assisted). display: none; is not (некоторые считыватели не читают их), и вы не можете "навести" их на поиск - visibility: hidden; не удалит пробел, и вы все равно не сможете "вставить"

Итак, какой метод скрытия?

.. там действительно очень классно, обнаружено членами сообщества Drupal.. с помощью свойства clip: rect();, которое держит всех счастливыми

.my-hidden-element {
 position: absolute;
 clip: rect(1px 1px 1px 1px); /* IE6 & 7 */
 clip: rect(1px, 1px, 1px, 1px);
}

Что касается Google, не только им было бы трудно "запретить банкротство/наказывать" на основе свойства clip, даже если вы начнете поднимать флаги, я думаю, что это похоже на все остальное, если вы можете доказать законность использование для скрытия элемента - не должно быть никаких проблем.. и на самом деле в этом случае дополнительные заголовки должны теоретически помочь им "найти структуру" тоже - так что я действительно чувствую, что это не самое большое беспокойство.

Мои мысли

Я абсолютно думаю, что мы должны указывать разделы в соответствии с рекомендациями HTML5, это более семантично, чем любой элемент кода или имя класса, но я также на 100% думаю, что мы должны быть в состоянии скрыть их от зрителей, поскольку нет смысла в показывая название "Поиск на этом сайте", если ваши визуальные пользователи могут видеть там окно поиска;) - этот заголовок полезен только для невизуальных пользователей и SE, чтобы помочь им найти области документа.. теоретически, что должно помочь SE/Google отклоняет эту область, например им не нужно индексировать окно поиска. Так что им нужно будет работать над своим ИИ, не так ли?)

Мое чувство заключается в том, чтобы пойти с этим и понять, почему вы это делаете, тогда, если ваш сайт случайно помечен (что, я думаю, было бы маловероятным и в любом случае было бы ручным обзором), вы можете достаточно четко объясните, почему вы это делаете. Пока эти скрытые заголовки не "спам", я думаю, что он попадет в ту же категорию, что и "замена изображения"

+1 Большой вопрос!


Мой предпочтительный способ справиться с этим. С отключенными стилями вы видите заголовок, но это небольшой заголовок, а не h1.

<nav><code>
<h6>Navigation</h6>
</code><ul><code>
<li><a href="www.ronpaul.com">Ron Paul 2012</a></li>
</code>

<pre class="prettyprint linenums">.hidden{
 position:absolute;
 left:-9999px;
}

ИЛИ

.hidden{
 text-indent:-9999px;
}

licensed under cc by-sa 3.0 with attribution.