Visualizador de Open Graph
Visualize como sua página ficará quando compartilhada no Facebook, Twitter/X, LinkedIn e Slack. Gere meta tags Open Graph e Twitter Card a partir de um formulário.
39/70
119/160
Use an absolute URL. Ideal: 1200×630px JPG/PNG under 1MB.
example.com
My Awesome Blog Post — A Complete Guide
Learn everything you need to know about this topic in our comprehensive guide. Perfect for beginners and experts alike.
Generated Meta Tags
<!-- Open Graph / Facebook --> <meta property="og:type" content="article" /> <meta property="og:url" content="https://example.com/blog/my-post" /> <meta property="og:title" content="My Awesome Blog Post — A Complete Guide" /> <meta property="og:description" content="Learn everything you need to know about this topic in our comprehensive guide. Perfect for beginners and experts alike." /> <meta property="og:site_name" content="My Website" /> <!-- Twitter --> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="My Awesome Blog Post — A Complete Guide" /> <meta name="twitter:description" content="Learn everything you need to know about this topic in our comprehensive guide. Perfect for beginners and experts alike." />
OG Tag Checklist
✓og:title set (50–70 chars)
✓og:description set (120–160 chars)
○Missing or not absolute
✓og:url is absolute HTTPS URL
✓og:site_name set
✓og:type selected
Como Usar Visualizador de Open Graph
- 1Digite o título, descrição, URL e URL da imagem da sua página.
- 2Visualize como o link aparecerá no Facebook, Twitter/X, LinkedIn e Slack.
- 3Copie os meta tags gerados para sua <head> HTML.
ZenovayAnalytics
Saiba o que seus visitantes realmente fazem.
- Acompanhamento de visitantes em tempo real
- Privacidade em primeiro lugar, sem banner de cookies
- Configurado em dois minutos
Ferramentas Relacionadas
Analisador de Meta Tags
Analise meta tags de qualquer página web. Verifique título, descrição, Open Graph, Twitter cards e obtenha recomendações de SEO.Verificador de Open Graph
Visualize como sua página fica quando compartilhada no Facebook, Twitter e LinkedIn. Verifique todas as tags Open Graph e Twitter Card.Verificador de Header HTTP
Inspecione headers de resposta HTTP de qualquer URL. Verifique headers de segurança, cache, tipo de conteúdo e muito mais.Validador de Robots.txt
Valide e analise seu arquivo robots.txt. Verifique regras, sitemaps e problemas comuns de rastreamento.Perguntas Frequentes
O que são tags Open Graph?▾
As tags Open Graph (OG) são meta tags HTML que controlam como as URLs aparecem quando compartilhadas em plataformas de mídia social como Facebook, LinkedIn, Twitter/X, Slack e Discord. Desenvolvido pelo Facebook em 2010, o protocolo OG é agora o padrão para pré-visualizações de links em toda a web. Tags principais: og:title (título), og:description (descrição), og:image (imagem de pré-visualização), og:url (URL canônica).
Qual é a diferença entre Open Graph e Twitter Cards?▾
Open Graph é o padrão geral usado pelo Facebook, LinkedIn, Slack, Discord e pela maioria das plataformas. Twitter Cards são meta tags específicas do Twitter/X (twitter:card, twitter:title, twitter:description, twitter:image). A maioria das implementações precisa de ambos. Boa notícia: se as tags específicas do Twitter estiverem ausentes, o Twitter usará as tags og:* como fallback.
Qual é o tamanho de imagem ideal para Open Graph?▾
Tamanho OG recomendado: 1200×630px (proporção 1,91:1). Mínimo: 600×315px. Tamanho máximo do arquivo: abaixo de 8 MB (limite do Facebook), idealmente abaixo de 1 MB para carregamento rápido. O LinkedIn prefere 1200×627px. Twitter/X summary_large_image: 1200×675px (proporção 16:9). Sempre use URLs absolutas (https://) para og:image.
Como valido minhas tags Open Graph?▾
Ferramentas de teste: Facebook Sharing Debugger (developers.facebook.com/tools/debug) — cole sua URL, varre e mostra a pré-visualização + erros. LinkedIn Post Inspector (linkedin.com/post-inspector) — mesmo para LinkedIn. Twitter Card Validator (cards-dev.twitter.com/validator) — para Twitter cards. Observação: o Facebook armazena em cache agressivamente — use 'Scrape Again' para forçar uma atualização.
O que é og:type e quando devo usar valores diferentes?▾
og:type informa às plataformas que tipo de conteúdo é a página. Valores mais comuns: website (padrão — página inicial ou páginas gerais). article (posts de blog, artigos de notícias — habilita article:published_time, article:author). product (itens de e-commerce). video.movie / video.episode (conteúdo de vídeo). O tipo padrão é website se não especificado.