1. O que é Open Graph
O protocolo Open Graph (OG) foi criado pelo Facebook em 2010 e tornou-se o padrão de facto para controlar como URLs aparecem quando compartilhadas em redes sociais. Sem as tags OG, cada plataforma tenta inferir título, descrição e imagem do conteúdo da página — geralmente com resultados inconsistentes e pouco atrativos.
Com as meta tags OG corretamente configuradas, você define exatamente o que o usuário verá ao compartilhar seu link no Facebook, LinkedIn, WhatsApp, Telegram e diversas outras plataformas.
2. Tags Essenciais
As quatro tags mais importantes que toda página deve ter:
- og:title — Título do conteúdo. Ideal entre 40 e 60 caracteres.
- og:description — Descrição resumida. Ideal entre 120 e 155 caracteres.
- og:image — URL absoluta da imagem. Fundamental para engajamento visual.
- og:url — URL canônica da página. Evita duplicatas no grafo social.
Tags complementares úteis: og:type (website, article, product), og:site_name (nome do seu site), og:locale (idioma, ex: pt_BR).
3. Imagem OG Ideal
A imagem é o elemento visual mais impactante no compartilhamento. Para máxima compatibilidade, use 1200 × 630 pixels (proporção 1.91:1). Essa resolução funciona bem no Facebook, LinkedIn e na maioria das plataformas.
- Tamanho mínimo: 200 × 200 px (Facebook recusa imagens menores)
- Formato recomendado: JPG ou PNG
- Tamanho do arquivo: prefira abaixo de 1 MB para carregamento rápido
- URL absoluta (com https://): URLs relativas não são aceitas
"Uma imagem OG bem dimensionada pode aumentar o CTR de links compartilhados em até 3x comparado a compartilhamentos sem imagem."
4. Twitter Cards
O Twitter tem seu próprio sistema chamado Twitter Cards, mas lê as tags OG como fallback. Para controle total, adicione também as tags específicas do Twitter:
- twitter:card — summary_large_image (imagem grande) ou summary (imagem pequena)
- twitter:title, twitter:description, twitter:image
5. Como Validar
Além desta ferramenta, você pode validar suas tags OG diretamente nas plataformas:
- Facebook: Sharing Debugger (developers.facebook.com/tools/debug)
- LinkedIn: Post Inspector (linkedin.com/post-inspector)
- Twitter: Card Validator (cards-dev.twitter.com/validator)
Lembre-se que as plataformas fazem cache do preview. Após atualizar suas tags, use o debugger de cada plataforma para forçar a atualização do cache.
6. Perguntas Frequentes
Por que meu preview não aparece corretamente?
As plataformas fazem cache agressivo dos previews. Após adicionar ou corrigir as tags OG, use o debugger oficial de cada plataforma para limpar o cache e forçar a releitura das tags.
Preciso de todas as tags OG?
As quatro essenciais (title, description, image, url) cobrem 95% dos casos. As demais são complementares e melhoram a semântica do grafo social para plataformas mais avançadas.