Оптимизированный H1

SEO-оптимизация блоггерского темплейта

В данной статье обозначу несколько рекомендаций по поводу поисковой оптимизации блоггерского шаблона. 

Вероятно некоторым известен тот факт, что гугл читает тэг h1, точнее текст обрамленный данным тэгом, - самым главным заголовком страницы. И это означает, что  h1 - очень важный и полезный тэг для брата SEOшника. Однако частое его использование на одной странице не всегда желательно, так как в большинстве случаев, да и по логике, самый главный заголовок на странице должен быть один.

Исходим из вышеописанного утверждения, и принимаем её за неоспоримую условность.

Итак, на странице тэг h1 используем только один раз.

Продолжаем развивать тему. 

В большинство представленных на выбор блоггерских темплейтов тэгом h1 обрамлен заголовок блога.  И так на всех страницах блога. То есть гугл помещая в индекс очередную страницу с этого ресурса каждый раз натыкается на один и тот же заголовок. Что в общем-то не есть хорошо. Намного эфективнее и оптимальнее, на мой взляд, было бы сделать следующее: на морде оставить все как есть, то бишь хидером1 обрамляем <h1>заголовок блога</h1>, а на всех остальных страницах <h1>название поста</h1>

Итак, сделаем это на нашем любимом блогспотовском блоге.

Примечание: Все экзекуции я производил исключительно на xml-шаблонах (конкретнее на Stretch Denim Light), так как старые классические html-шаблоны, имхо, потиху отмирают.

Значит так, логиннимся идем в макет править в ручную шаблон. Ищем что-то наподобии этого:

<h1 class='title'>
  <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <data:title/>
  <b:else/>
    <a expr:href='data:blog.homepageUrl'><data:title/></a>
  </b:if>
</h1>

Это вывод заголовка блога. Изменяем найденный блок на этот

<b:if cond='data:blog.pageType != "item"'>
  <h1 class='title'>
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
      <data:title/>
    <b:else/>
      <a expr:href='data:blog.homepageUrl'><data:title/></a>
    </b:if>
  </h1>
<b:else/>
  <h2 class='title'>
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
      <data:title/>
    <b:else/>
      <a expr:href='data:blog.homepageUrl'><data:title/></a>
    </b:if>
  </h2>
</b:if>

Здесь просто добавляется дополнительное условие - является страница мордой или нет. Если морда - то заголовок в h1, если нет- в h2.  

 Дальше проделываем все тоже самое с точностью до наоборот с блоком вывода названия поста. Ищем

<b:if cond='data:post.title'>
  <h3 class='post-title'>
    <b:if cond='data:post.link'>
      <a expr:href='data:post.link'><data:post.title/></a>
    <b:else/>
      <b:if cond='data:post.url'>
        <a expr:href='data:post.url'><data:post.title/></a>
      <b:else/>
        <data:post.title/>
      </b:if>
    </b:if>
  </h3>
</b:if>

и заменяем на

<b:if cond='data:post.title'>
  <b:if cond='data:blog.pageType == "item"'>
    <h1 class='post-title'>
        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
        <b:else/>
          <data:post.title/>
        </b:if>
    </h1>
  <b:else/>
    <h3 class='post-title'>
        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
        <b:else/>
          <data:post.title/>
        </b:if>
    </h3>
  </b:if>
</b:if>

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

h1.title, h2.title {
  line-height: 1.4em;
  font-size: 150%;
}
h1.post-title, h3.post-title {
  line-height: 1.2em;
  font-size: 100%;
}

Всё. Сохраняем темплэйт и проверяем все ли работает так как надо.

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

ту би континуед ...