Blogger SEO: Microformats

23 de julho de 2012
Hoje vamos falar sobre SEO, a qual não é a parte mais vistosa de um blog, mas essa é uma das mais importantes para que o blog alcance cada vez mais pessoas.

Dentro disso, vou focar nas mudanças que podemos fazer no modelo para que o blog seja melhor indexado pelos buscadores.

Siga o @bloggermin agora e fique por dentro das novidades para o seu blog. E curta nossa página no Facebook.

blogger seo

Se você quiser ver como seu blog é indexado acesse o Rich Snippets Testing Tool.

Há duas maneiras de um buscador  indexar o nosso conteúdo. Uma delas é a forma clássica, através de classes (class), chamada microformats. Outra veio recentemente com o HTML5 é a microdata. Atualmente, os principais motores de busca usam os dois, mas será dado importância à microdata.

Por agora vamos nos concentrar no primeiro, que é o mais fácil de aplicar, e que o Blogger implementa por padrão.

O problema é que é muito provável que tenhamos excluído certas classes, por isso vamos recuperá-las e entender por que elas estão lá.

Microformats

As microformats são um conjunto de classes que indicam ao buscador de qual tipo é o nosso conteúdo.

Podemos começar a fazer algo em <div class='blog-posts hfeed'>.

Esse classe hfeed informa ao navegador que isso é um feed, leia mais. Basicamente, esse classe indica que o que está na div é o conteúdo do blog. Portanto, se não estiver hfeed, o resto das classes que temos dentro não valerá para nada.

Dentro de uma classe hfeed podemos colocar outros elementos conm outras classes:
  • Links con rel="tag".Opcional. São keywords para indicar a categoria do feed. Não será focalizado aqui.
  • Entrada (hentry).Certamente já os conheça. Dentro temos:

    • entry-title. Obrigatório. O título da entrada.
    • entry-content. Opcional (mas muito importante). O conteúdo da entrada.
    • entry-summary. Opcional. Um resumo da entrada.
    • updated.Data de atualização. É necessário, mas o Blogger não nos permitem acessar de forma nativa, e qualquer solução usando javascript não resolve.
    • published. Data de publicação. É opcional, mas importante, uma vez que não temos para a atualização.
    • author. O autor. Devemos também utilizar uma classe chamada vcard.
    • Link do artigo com rel="bookmark". Opcional.
    • Etiquetas/Marcadores usando rel="tag".
Para otimizar ao máximo o nosso blog, temos de fazer o seguinte (dentro de <b:includable id='post' var='post'>).

Hentry

Se temos em nosso modelo <div class='post'> é necessario substituí-lo por <div class='post hentry'>.

Entry-content

Se temos <div class='post hentry'> temos que alterá-lo por <div class='post-body entry-content'>. O mesmo faça para, <div class='post-title'> por <div class='post-title entry-title'>.

class='updated'

Isso é importante: Os buscadores, se não detectarem em cada artigo uma abreviatura com a classe updated, marcam a entrada como inválida, e nosso trabalho será em vão. Portanto, busque abbr class='published' e altere a classe por class='updated published'.

O autor do artigo

Agora procure <data:post.author/>. Certifique que esteja em um marcador com a classe fn e que este marcador esteja em outro com classe vcard. Isso informar ao buscador como se chama o autor do post. Se há uma etiqueta <a>, observe se possui a class url. Deverá ser assim:
<span class='author vcard'>
<b:if cond='data:post.authorProfileUrl'>
<a expr:href='data:post.authorProfileUrl' class='url fn' title='author profile'>
<data:post.author/>
</a>
<b:else/>
<span class='fn'><data:post.author/></span>
</b:if>
</span>

rel='tag'

Busque <data:label.name>. Informa onde se encontram os marcadores. Certifique-se que ele possua o atributo rel='tag'.

rel='bookmark'

Procure algo parecido a <a expr:href='data:post.url'> e adicione rel='bookmark', caso não tenha. Isto indica ao buscador qual é o link do artigo.

Confira o resultado:

Vá para http://www.google.com/webmasters/tools/richsnippets, digite o endereço do seu blog, e verifique os resultados.

Se houver algum erro nos resultados, comente aqui e vamos tentar ajudar a corrigi-lo.

Para que tenha uma ideia, aqui estão os resultados desse artigo:

resultados microformats

9 comentários en:

"Blogger SEO: Microformats"

  1. Porque eu não encontro nada disso na edição de HTML de meu blog?

    Por exemplo, logo no primeiro caso você cita:



    única coisa com "includable" que achei foi o seguinte:


    Pode me auxiliar fazendo favor?

    Obrigado e Parabéns pelo seu conhecimento e por divulgar o mesmo!

    ResponderExcluir
    Respostas
    1. Olá Yuri, qual foi a "includable" que achou. Por favor para o código ser visível nos comentários use a ferramenta: http://www.blogcrowds.com/resources/parse_html.php

      Excluir
    2. AAAAAA ACHEI!
      Só agora que fui ver a opção:
      [ ] Expandir modelos de widgets

      Agora sim vou conseguir acompanhar o blog normalmente!

      Obrigado!

      Excluir
    3. Olá Yuri, desculpa pelo visto esqueci de mencionar, que deve-se "Expandir modelos de widgets".
      Aproveite.
      Abraços

      Excluir
    4. Olá Yuri,
      Obrigado pela sugestão, verei o que posso fazer a respeito.
      Abraços

      Excluir

Si tu blog contiene material protegido por derechos de autor habilita tu perfil y deja únicamente el nombre de tu blog, no dejes la dirección del mismo, de lo contrario el comentario será eliminado.

 
Ir Arriba Ir Abajo
I Ciudad Blogger