Um guia de compartilhamento para Webmasters

Este documento descreve como otimizar um conteúdo hospedado na Web que as pessoas compartilham no Facebook, não importa se ele é compartilhado na Web de um desktop ou dispositivo móvel, ou de um aplicativo móvel.

Este documento fornece informações sobre:

Marcação do Open Graph

A maioria dos conteúdos é compartilhada com o Facebook como um URL; portanto, é importante marcar seu site com as marcações do Open Graph para ter o controle sobre como seu conteúdo é exibido no Facebook.

Sem essas marcações, o Rastreador do Facebook usa técnicas heurísticas internas para tentar dar o melhor palpite em relação ao título, descrição e imagem de prévia do seu conteúdo. Especifique essas informações explicitamente com as marcações do Open Graph para garantir publicações com a mais alta qualidade no Facebook.

Este é um exemplo de conteúdo formatado com marcações do Open Graph para uma melhor exibição no Facebook:

Exemplo de marcação

Por exemplo, veja como marcar um artigo, notícias ou publicações de blog com og:type="article" e diversas propriedades adicionais:

<meta property="og:url"                content="http://www.nytimes.com/2015/02/19/arts/international/when-great-minds-dont-think-alike.html" />
<meta property="og:type"               content="article" />
<meta property="og:title"              content="When Great Minds Don’t Think Alike" />
<meta property="og:description"        content="How much does culture influence creative thinking?" />
<meta property="og:image"              content="http://static01.nyt.com/images/2015/02/19/arts/international/19iht-btnumbers19A/19iht-btnumbers19A-facebookJumbo-v2.jpg" />

As propriedades incluem metadados descritivos sobre o artigo que nós desejamos, especificamente, apresentar quando alguém compartilha o artigo.

Marcações básicas

Estas são as metatags mais básicas que você deve usar para todos os tipos de conteúdo:

Marcação Descrição

og:url

O URL canônico da sua página. Deve ser o URL não decorado, sem variáveis de sessão, parâmetros de identificação do usuário ou contadores. As Curtidas e os Compartilhamentos desse URL serão agregados a ela. Por exemplo, URLs de domínios para dispositivos móveis devem apontar para a versão para desktop do URL como o URL canônico, a fim de agregar Curtidas e Compartilhamentos em diferentes versões da página.

og:title

O título do seu artigo sem nenhuma marca, como o nome do seu site.

og:description

Uma breve descrição do conteúdo, geralmente entre duas e quatro frases. Ela será exibida abaixo do título da publicação no Facebook.

og:image

O URL da imagem que é exibida quando alguém compartilha o conteúdo no Facebook. Consulte mais informações abaixo e confira nosso guia de melhores práticas para saber como especificar uma imagem de prévia de alta qualidade.

fb:app_id

Para usar as Informações do Facebook você deve adicionar o número de identificação do aplicativo à sua página. As Informações permitem visualizar análises de tráfego no seu site no Facebook. Localize o número de identificação do aplicativo no seu Painel do Aplicativo.


Também pode ser interessante adicionar mais duas marcações para melhorar a distribuição do seu conteúdo e aumentar o envolvimento:

Marcação Descrição

og:type

O tipo de mídia do seu conteúdo. Essa marcação tem impacto sobre como seu conteúdo é exibido no Feed de Notícias. Caso você não especifique um tipo, o padrão será website. Cada URL deve ser um único objeto; portanto, não é possível ter vários valores de og:type. Encontre a lista completa de tipos de objetos em nossa Referência de tipos de objetos

og:locale

O idioma do recurso. O padrão é en_US. Você também pode usar og:locale:alternate, caso tenha traduções para outros idiomas disponíveis. Saiba mais sobre os idiomas suportados em nossa documentação sobre localização.


A lista completa de propriedades de objetos padrão está em nossa Referência de propriedades de objetos.

Testar sua marcação

Para ver como sua marcação aparece para o Rastreador do Facebook digite o URL no Depurador de compartilhamento. Ele mostrará de quais metatags o rastreador extrai, assim como quaisquer erros ou alertas.

O depurador também ativa uma extração da sua página, para que, caso haja erros em seu HTML, você possa usar o depurador para atualizar seu conteúdo. Consulte Atualizar objetos para saber mais.

Tipos de conteúdo de mídia

Você pode adicionar outras marcações se seu conteúdo incluir áudio, vídeo ou informações de local. Veja todas as propriedades de objetos padrão em nossa Referência de tipos de objetos.

Vídeo

Você pode usar og:video para todos os tipos de conteúdo. Esta seção descreve como usar tags adicionais para otimizar a aparência dos vídeos no Facebook. O Facebook oferece suporte a vídeos mp4 e Flash.

Use um URL seguro para as marcações og:video:url e og:video:secure_url para qualificar seu vídeo para a reprodução em linha no Feed de Notícias. Seu vídeo pode não ser reproduzido em linha, o que depende de vários fatores.

Metatag Descrição

og:video

O URL do vídeo. Se você deseja que o vídeo seja reproduzido em linha no Feed de Notícias, é necessário usar o URL https:// se possível.

og:video:url

Equivalente a og:video

og:video:secure_url

O URL seguro do vídeo. Inclua mesmo se você definir o URL segura em og:video.

og:video:type

Tipo MIME do vídeo. application/x-shockwave-flash ou video/mp4.

og:video:width

Largura do vídeo em pixels. Esta propriedade é obrigatória para vídeos.

og:video:height

Altura do vídeo em pixels. Esta propriedade é obrigatória para vídeos.

og:image

Especifique uma imagem para uma prévia de alta qualidade no Feed de Notícias


Imagens

Use este conjunto de propriedades para conteúdo com mais de uma imagem. Consulte Melhores práticas de compartilhamento para orientações sobre como usar melhor a og:image.

Metatag Descrição

og:image

URL da imagem. Para atualizar uma imagem depois de ter sido publicada, use um novo URL para a nova imagem. As imagens são armazenadas em cache com base no URL e não serão atualizadas, a menos que o URL seja alterado.

og:image:url

Equivalente a og:image

og:image:secure_url

URL https:// da imagem

og:image:type

Tipo MIME da imagem. image/jpeg, image/gif ou image/png

og:image:width

Largura da imagem em pixels. Especifique a altura e largura da sua imagem para garantir que ela seja carregada de forma apropriada da primeira vez que for compartilhada.

og:image:height

Altura da imagem em pixels. Especifique a altura e largura da sua imagem para garantir que ela seja carregada de forma apropriada da primeira vez que for compartilhada.