Como usar
- Digite o endereço de uma página, como
example.com/blog/launch, e clique em Verificar. Não tem uma página à mão? Teste um dos exemplos. - Veja o card que cada app monta para ela: X, Facebook, LinkedIn, Slack, Discord, WhatsApp e iMessage. Um ponto verde significa que o card está certo; um amarelo ou vermelho diz embaixo do card o que está errado.
- Abra Mostrar correções e tags para ver cada tag verificada uma a uma. As tags que faltam vêm prontas para colar no seu
<head>: copie, preencha os valores, publique a mudança e verifique de novo.
O endereço da verificação fica na barra de endereços do navegador, então você pode mandá-lo para quem cuida da página.
Como funcionam as prévias de links
Quando você cola um link num post ou num chat, o robô do app busca a página uma vez e lê as tags do <head> dela. Ele não roda JavaScript, não faz login nem aceita banners de cookies, então tags adicionadas por um script depois que a página carrega ficam invisíveis para ele. O verificador busca a página do mesmo jeito: uma requisição, sem JavaScript, seguindo redirecionamentos como um robô segue.
Cada app lê as mesmas poucas tags, com suas próprias alternativas:
- Open Graph (
og:title,og:description,og:image,og:url,og:site_name) é o que Facebook, LinkedIn, Slack, Discord, WhatsApp e iMessage leem. - X lê primeiro
twitter:card,twitter:title,twitter:descriptionetwitter:image, e na falta delas usa as tags Open Graph. Semtwitter:card, mostra um card de resumo pequeno, mesmo quando há imagem. - Quando falta
og:title, a maioria dos apps usa o<title>. Quando faltaog:description, alguns usam a meta description e outros não mostram texto nenhum. - O Discord colore a lateral do card dele com
theme-color.
As prévias aqui seguem essas regras. Cada app também muda o design de vez em quando, então considere-as aproximadas, não exatas.
A imagem de prévia
Uma imagem funciona em todo lugar: 1200 × 630 pixels (1,91:1), PNG ou JPEG, num endereço https:// completo.
- Abaixo de 600 pixels de largura, Facebook e LinkedIn mostram uma miniatura pequena em vez de um card grande. Abaixo de 200 × 200, o Facebook não mostra imagem.
- O X aceita imagens de até 5 MB e o Facebook de até 8 MB. O WhatsApp costuma deixar de fora imagens acima de uns 600 KB, então um JPEG bem comprimido é a escolha segura.
- Nenhum dos grandes apps suporta SVG.
- Um endereço relativo como
/og.pngnão funciona com todos os robôs. Escreva a URL completa. - Cortes quadrados são comuns (WhatsApp, iMessage em links pequenos), então mantenha a parte importante da imagem perto do centro.
O verificador também busca a imagem, mede pelo cabeçalho do arquivo e a mostra nas prévias.
Por que uma prévia ainda parece antiga
Os apps guardam em cache o que buscaram, de minutos a cerca de uma semana. Depois que você corrige as tags, o verificador mostra a nova versão na hora, mas um link já compartilhado mantém a prévia antiga até o app buscá-lo de novo. O Sharing Debugger do Facebook e o Post Inspector do LinkedIn buscam a página de novo quando você pede. No Slack, um link postado de novo depois de um tempo ganha uma nova prévia. Adicionar uma query string, como ?v=2, faz qualquer app tratá-lo como um link novo.
Perguntas frequentes
Por que minha prévia não tem imagem?
As causas mais comuns, em ordem: não há tag og:image, o endereço da imagem é relativo ou responde com erro, a imagem é pequena ou grande demais, ou a tag é adicionada por JavaScript depois que a página carrega. A linha embaixo de cada card indica a causa que se aplica.
De quais tags eu preciso, no mínimo?
og:title, og:description, og:image com uma imagem de 1200 × 630, og:url e twitter:card definido como summary_large_image. O Gerador de meta tags escreve todas para você.
Ele verifica páginas que exigem login?
Não. Os robôs não fazem login, então uma página atrás de login não tem prévia em lugar nenhum. O verificador vê o que eles veem, e só busca endereços públicos: redes privadas e internas são recusadas.
O verificador guarda as páginas que busca?
Não. Ele busca a página e as imagens quando você clica em Verificar e te manda o que encontrou. O resultado fica guardado por dois minutos, para que uma segunda verificação do mesmo endereço seja instantânea, e depois é descartado. Ele lê até 2 MB de HTML e 8 MB por imagem, e desiste depois de 8 segundos.
Por que ele diz que minha página responde 403 se ela abre normalmente no meu navegador?
Alguns sites e firewalls bloqueiam requisições que não vêm de um navegador, ou de grandes robôs que eles conhecem. Se o verificador recebe um 403, o Facebook ou o LinkedIn também podem receber: confira as configurações de bots do seu firewall.
Existe limite?
Vinte verificações por minuto a partir de um mesmo endereço. Além disso, cada site é buscado no máximo 60 vezes por minuto somando todos que usam o verificador, para que ele não sirva para inundar um site. Os resultados ficam guardados por dois minutos, então o mesmo endereço verificado logo depois volta na hora; clicar em Verificar de novo na página que você está vendo sempre a busca do zero.