raatools/

Open Graph Preview

Visualize como sua página aparece nas redes sociais.

Facebook / LinkedIn Preview

1200 × 630 image
example.com
My Amazing Page Title
A detailed description of what this page is about. Make it compelling!

Twitter / X Preview

1200 × 628 image
My Amazing Page Title
A detailed description of what this page is about. Make it compelling!
🔗 example.com

O que é uma ferramenta de pré-visualização Open Graph?

As tags Open Graph (OG) são meta tags HTML que controlam como a sua página web aparece quando é partilhada em plataformas de redes sociais como Facebook, Twitter, LinkedIn e aplicações de mensagens. As tags og:title, og:description, og:image e og:url determinam o título, o excerto, a miniatura e o link mostrado no cartão de pré-visualização de partilha. Esta ferramenta permite pré-visualizar como a sua página vai ficar antes de a partilhar.

Sem tags OG adequadas, as plataformas sociais tentam adivinhar o título e a imagem a partir do conteúdo da página, produzindo frequentemente pré-visualizações feias ou enganosas. Uma pré-visualização OG bem elaborada aumenta dramaticamente as taxas de clique — as publicações com imagens e descrições otimizadas obtêm 2 a 3 vezes mais envolvimento do que as que não as têm.

Tags Open Graph essenciais

  • og:title — o título mostrado no cartão de pré-visualização. Mantenha abaixo dos 60 caracteres.
  • og:description — um breve resumo do conteúdo da página. Mantenha abaixo dos 155 caracteres.
  • og:image — a miniatura de pré-visualização. Tamanho recomendado: 1200x630 píxeis para melhor visualização em todas as plataformas.
  • og:url — o URL canónico da página.
  • og:type — o tipo de conteúdo (website, article, product, etc.).

Como utilizar esta ferramenta

Introduza um URL e a ferramenta obtém a página, extrai todas as meta tags Open Graph e Twitter Card, e apresenta pré-visualizações de como a página aparecerá no Facebook, Twitter e LinkedIn. Imagens em falta ou com tamanho incorreto são assinaladas. Use-a para testar as suas tags OG antes de publicar conteúdo.

Twitter Cards vs. Open Graph

O Twitter usa as suas próprias meta tags (twitter:card, twitter:title, twitter:description, twitter:image) mas recorre às tags OG quando as tags específicas do Twitter estão em falta. Para máxima compatibilidade, inclua tanto as tags OG como as tags Twitter Card. A tag twitter:card (definida como summary_large_image para uma grande pré-visualização) é a adição específica do Twitter mais importante.

Perguntas frequentes

Por que a minha pré-visualização de partilha não está a atualizar depois de alterar as tags OG?

As plataformas sociais armazenam em cache os dados OG de forma agressiva. O Facebook armazena em cache durante cerca de 30 dias. Para forçar uma atualização, use o Facebook Sharing Debugger (developers.facebook.com/tools/debug/), o Twitter Card Validator, ou o LinkedIn Post Inspector. Estas ferramentas limpam a cache e obtêm novas tags OG da sua página.

Que tamanho de imagem devo usar para OG?

O tamanho recomendado é 1200x630 píxeis (proporção 1,91:1) para a melhor visualização em todas as plataformas. Mínimo de 600x315 píxeis. O Facebook, Twitter e LinkedIn apresentam bem esta proporção. Use o formato JPEG ou PNG, mantenha o tamanho do ficheiro abaixo de 5 MB (idealmente abaixo de 300 KB para carregamento rápido). Evite imagens com muito texto — algumas plataformas cortam de forma diferente.