Должен ли я использовать несколько h1 или несколько h2 без h1?

На веб-странице со списком преподавателей текущие HTML-коды:

<div id="tutors">

 <h1>Tutors</h1>
 <div class="tutor">
  <h2>John</h2>
  <p>...</p>
 </div>

 <div class="tutor">
  <h2>Mary</h2>
  <p>...</p>
 </div>

 <div class="tutor">
  <h2>David</h2>
  <p>...</p>
 </div>

</div>

Теперь по некоторым причинам слово Tutors, которое в настоящее время заключено в h1, необходимо удалить со страницы. Я могу придумать 3 варианта:

  1. Используйте css, чтобы скрыть это.
  2. Просто удалите его, и на странице будет h2 без h1.
  3. Удалите его и замените все h2 на h1.

Какой из них более подходит?


html seo html-heading
person bobo    schedule 04.01.2012    source источник

Ответы (6)


arrow_upward
7
arrow_downward

№3. Удалите его и замените все h2 на h1.

  1. For SEO, hiding text is frowned upon because it can be considered black-hat SEO. Unless you're going to replace the header with an image that has the text, "Tutors".
  2. You cannot have <h2> unless there's an <h1> beforehand.
person Ayman Safadi    schedule 04.01.2012
comment
Я не знал, что тег ‹h1› должен стоять перед тегом ‹h2›? Это новое для xhtml strict или html5? - person Andy; 04.01.2012
comment
To facilitate navigation and understanding of overall document structure, authors should use headings that are properly nested (e.g., h1 followed by h2, h2 followed by h2 or h3, h3 followed by h3 or h4, etc.). – w3.org/TR/WCAG20-TECHS/G141.html - person Ayman Safadi; 04.01.2012

arrow_upward
2
arrow_downward

Ни один из этих вариантов не является хорошим SEO.

  1. Это рискованная и плохая практика. Поисковые системы стали очень хорошо определять, когда текст скрыт, и если они обнаружат, что сильно взвешенный тег, такой как <h1>, скрыт, это повредит вашему рейтингу.
  2. Вы никогда не должны пропускать шаг в иерархии заголовков (не используйте <h3> без <h2> и т. д.). Кроме того, они всегда должны располагаться в порядке убывания важности.
  3. Каждая страница должна иметь ровно один <h1>, и это должен быть первый тег заголовка. Они имеют порядок <title> с точки зрения веса SEO.

Почему этот заголовок должен быть скрыт в первую очередь? Похоже на хорошее описание содержания страницы.

person Ansel Santosa    schedule 04.01.2012
comment
Пункт №3 не обязательно верен. Во всяком случае, больше нет. Это сильно обсуждается тема. - person Ayman Safadi; 04.01.2012
comment
Хороший вопрос, особенно в HTML5. Однако в случае с этим конкретным примером я не думаю, что присвоение имени каждого наставника <h1> имеет смысл семантически. Мне больше нравится решение @Aaron's <dl>, однако на странице все еще должен быть <h1>, и я не думаю, что имеет смысл использовать что-то кроме репетиторов. - person Ansel Santosa; 04.01.2012

arrow_upward
1
arrow_downward

В зависимости от варианта использования страницы любые три из них звучат как допустимые варианты. Тем не менее, вот некоторые вещи, о которых я подумал при рассмотрении этого вопроса:

  • SEO: похоже, есть мнение, что выбор содержимого тега может повлиять на ранжирование в поисковых системах.
  • Рендеринг без стилей: если по какой-то причине страница может отображаться без сопутствующих листов css, помните о влиянии рендеринга по умолчанию на страницу и о том, как вы можете захотеть, чтобы он выполнялся.
  • Имейте в виду, что в HTML 5 есть новые общие теги, такие как «раздел», которые могут соответствовать вашей странице и быть немного более понятными семантически, чем теги H.
person Josh Diehl    schedule 04.01.2012

arrow_upward
1
arrow_downward

Это предпочтение. Вы всегда должны разделять презентацию и структуру, поэтому я бы посоветовал просто закомментировать это и указать, что это должно быть там. Если вы его спрячете, это действительно не презентация, потому что ее никогда не увидят. Так что 3 будет наиболее подходящим.

person Andy    schedule 04.01.2012

arrow_upward
1
arrow_downward

Не имеет значения.

Если вы используете jQuery для отображения и скрытия вещей, это не имеет никакого отношения к SEO. Поисковые системы видят то, что видите вы, когда просматриваете исходный код во всех практических смыслах. Вы все равно не делаете ничего подлого.

Ссылка на мой пост здесь о переполнении стека Если я делаю все на своей странице с помощью Ajax, как я могу выполнить поисковую оптимизацию?

потому что то, что вы делаете, ПОСЛЕ того, как поисковые системы рассмотрели его для всех практических целей.

person King Friday    schedule 04.01.2012

arrow_upward
1
arrow_downward

Возможно, вам следует подумать о форматировании этих элементов в виде списка определений, например:

<div id="tutors">
    <h1>Tutors</h1>
    <div class="tutor">
        <h2>John</h2>
        <p>...</p>
    </div>
    <div class="tutor">
        <h2>Mary</h2>
        <p>...</p>
    </div>
    <div class="tutor">
        <h2>David</h2>
        <p>...</p>
    </div>
</div>

становится:

<dl title="Tutors">
    <dt>John</dt>
        <dd>...Description here...</dd>
    <dt>Mary</dt>
        <dd>...Description here...</dd>
    <dt>David</dt>
        <dd>...Description here...</dd>
</dl>

А затем примените классы и стили CSS к элементам, чтобы сделать их более привлекательными для зрячих пользователей. Просто мысль.

person Aaron    schedule 04.01.2012