URL Canonica, MetaTags e OpenGraph

O uso de Meta tags é muito importante para que os robôs de busca e os plug-ins de redes sociais encontrem a informação que você deseja que eles vejam em suas páginas.

Caso você não defina nenhuma tag, os crawlers dos mecanismos de busca irão tentar identificar o conteúdo de sua página pela relevância do conteúdo de acordo com a sua disposição na página, porém confiar neles não costuma ser uma boa escolha.

Para todos os cenários, independente do mecanismo alvo ou rede social de interesse, há uma meta tag essencial. A referência de url canônica é responsável por dizer aos mecanismos automáticos como uma página específica deve ser referenciada publicamente, idependentemente da estrutura de URL utilizada para localizá-la.

Utilizando nosso site principal como exemplo, ao definir uma url canônica para codigofranco.com.br, todos os endereços que levam para ele serão entendidos como tal, independentemente de ser acessado por:

• codigofranco.com.br
• www.codigofranco.com.br
• http://codigofranco.com.br
• http://www.codigofranco.com.br
• https://codigofranco.com.br
• https://www.codigofranco.com.br

Para isto basta inserir a seguinte tag no cabeçalho de suas páginas, alterando o endereço utlizado para o da sua página:

<link rel="canonical" href="http://codigofranco.com.br" />

Esta tag serve principalmente para manter os contadores de Curtidas e Compartilhamentos do Facebook e os +1 do Google consistentes e fazer com que ferramentas de busca identifiquem os acessos para sua página de forma unificada, aumentando a relevância do seu site nos resultados.

Outras tags são utilizadas por mecanismos de busca para preencher nome e descrição de seu site de forma adequada. A tag básica <title></title> e a meta a seguir:

<meta name="description" content="Descrição a ser exibida no mecanismo de buscas.">

Certo, mas eu uso o Facebook para interagir com meu público, e lá eles usam uma referencia diferente chamada Open Graph, e agora o que eu faço?

Simples, as meta tags do Open Graph funcionam da mesma forma que as meta tags comuns mas são responsáveis por fornecer dados ao Facebook.

Para que os plug-ins da rede social funcionem de forma consistente entre páginas e navegadores, deve ser colocado no cabeçalho as seguintes tags (Não se esqueça de substituir para referenciar o seu próprio site):

<meta property="og:image" content="www.codigofranco.com.br/imagem.jpg">

<meta property="og:image:type" content="image/jpeg">

<meta property="og:site_name" content="Codigo Franco">

<meta property="og:title" content="URL Canonica, MetaTags e OpenGraph">

<meta property="og:description" content="Um tutorial sobre o uso de URL canônica, MetaTags e Open Graph.">

Com estas tags o Facebook irá sempre montar as postagens dos botões de curtir, compartilhamento e enviar para o messenger seguindo os parâmetros informados e referenciando da forma correta informações definidas.

Para mais informações sobre Open Graph acesse: http://tableless.com.br/utilizando-meta-tags-facebook/.

Ficou interessado no uso de plug-ins sociais? Quer ver como estas tags funcionam na prática? Em breve falaremos sobre integrações de sites com redes sociais, não perca!!