Verificador de Open Graph
Cole uma URL pública e vamos buscar as tags og:title, og:image, og:description e o card do Twitter — exatamente como Slack, LinkedIn e X vão renderizar.
Como corrigir uma prévia que não aparece
- 01
Confirme que as tags existem na URL que está sendo compartilhada
Não na homepage, e não na versão por trás de um redirecionamento - na URL exata que as pessoas colam. As prévias são lidas a partir da resposta final, então uma tag que só existe na página anterior ao redirecionamento é como se não existisse.
- 02
Torne a imagem totalmente acessível
og:image precisa de uma URL https completa que um estranho consiga buscar: sem caminho relativo, sem login, sem proteção contra hotlink, sem redirecionamento. Se você não consegue abri-la numa janela anônima, a plataforma também não consegue.
- 03
Dê a ela o formato que as plataformas esperam
1200 por 630 pixels é o padrão seguro, o que dá aproximadamente 1.91:1. Fique abaixo de alguns megabytes, use JPEG ou PNG, e mantenha qualquer texto bem afastado das bordas, porque cada plataforma corta uma parte diferente da imagem.
- 04
Force um novo scrape, não apenas tente de novo
Toda rede faz cache do que buscou na primeira vez, inclusive uma falha. Depois de corrigir, use o debugger da própria plataforma para forçar uma busca nova - senão você está olhando para um erro em cache e mexendo em coisas que nunca estiveram quebradas.
O que cada tag faz
og:title e og:description
O título e o subtexto do card. Eles substituem o título da página e a meta description no compartilhamento, o que é útil: a frase que funciona num resultado de busca raramente é a mesma que funciona num feed.
og:image
É a que mais chama atenção e a que mais falha, quase sempre porque está inacessível, não porque está errada. Defina width e height explícitos sempre que possível - algumas plataformas montam o layout do card antes mesmo de a imagem terminar de carregar.
og:url
O endereço canônico do que está sendo compartilhado. Ele consolida as contagens de engajamento quando a mesma página circula com parâmetros de rastreamento diferentes, então deve ser a URL limpa, não a marcada.
twitter:card
Escolhe entre uma miniatura pequena e uma imagem grande. Para tudo o mais, o X recorre às tags de Open Graph, então essa costuma ser a única tag twitter: que vale a pena adicionar.
Perguntas frequentes sobre prévias de links
Por que meu link mostra uma prévia em branco?
Em nove de cada dez casos, a imagem está inacessível - um caminho relativo, um bucket privado, ou um redirecionamento que o buscador não segue. O restante são páginas que renderizam as tags com JavaScript, que a maioria dos buscadores de prévia nunca executa.
Como limpo uma prévia em cache?
Pelo debugger da própria plataforma, porque cada uma mantém seu próprio cache: o Sharing Debugger do Facebook, o Post Inspector do LinkedIn, o validador de card do X. Não existe uma limpeza universal, e simplesmente compartilhar o link de novo não resolve.
Preciso de tags twitter: se já tenho tags de Open Graph?
Só twitter:card, e só se você quiser o layout de imagem grande. Títulos, descrições e imagens recorrem automaticamente aos equivalentes og:.
A prévia afeta o SEO?
Não diretamente - as tags de Open Graph não são sinais de ranqueamento. Elas afetam se alguém clica no link quando ele é compartilhado, que é um número diferente e muitas vezes maior.
Por que o mesmo link aparece diferente em cada plataforma?
Proporções de corte diferentes, comprimentos de descrição diferentes, e caches diferentes com idades diferentes. Projete a imagem para que ela ainda funcione quando as bordas forem cortadas e a descrição for truncada.