Sobre esta ferramenta
As tags Open Graph (OG) controlam como uma página aparece quando compartilhada em plataformas sociais. Facebook, LinkedIn, Slack, Discord e muitos outros leem tags OG para construir cartões de visualização. Sem tags OG adequadas, os links compartilhados parecem quebrados – favicons genéricos, imagens ausentes, títulos truncados. Com eles, os compartilhamentos parecem refinados e as taxas de cliques melhoram significativamente.
As tags OG padrão: og:title (o título mostrado na visualização), og:description (o snippet de texto), og:image (a imagem de visualização, idealmente 1200×630), og:url (URL canônico), og:type (normalmente 'site' ou 'artigo'). Camada de tags de cartão do Twitter na parte superior: twitter:card, twitter:title, twitter:description, twitter:image. A maioria das ferramentas recorre ao OG quando as tags específicas do Twitter estão ausentes.
Este gerador produz um conjunto completo de tags OG e Twitter Card a partir de sua entrada. Cole o HTML resultante no <head> da página. O resultado é uma renderização de visualização correta em todas as principais plataformas sociais.
Por que usar um gerador de tags OG
Páginas sem tags OG ficam ruins quando compartilhadas. Imagem vazia, título genérico, descrição ausente – a visualização compete mal com páginas devidamente marcadas nos feeds. Para marketing de conteúdo e compartilhamento de links, isso afeta diretamente a taxa de cliques.
Escrever tags OG à mão é repetitivo. Cada página precisa de seu próprio conjunto. Um gerador que produz tags corretas a partir de algumas entradas evita erros de digitação e propriedades perdidas que quebram as visualizações sociais.
Detalhes técnicos
As tags OG usam o atributo de meta propriedade (não o nome): <meta property="og:title" content="..." />. O atributo property é obrigatório para OG; alguns analisadores aceitam o nome como substituto, mas a propriedade está correta.
Requisitos de imagem: 1200×630 pixels para renderização de retina, proporção de 1,91:1. As tags og:image:width e og:image:height ajudam as plataformas a armazenar imagens em cache corretamente. og:image:alt fornece texto de acessibilidade.
As tags do Twitter Card usam o atributo name: <meta name="twitter:title" content="..." />. O Twitter recorre às tags OG quando as específicas do Twitter estão ausentes, portanto, um OG bem definido geralmente é suficiente. Adicionar twitter:card escolhe explicitamente o tipo de cartão (summary_large_image é o mais comum).
Perguntas frequentes
- Posso personalizar a saída gerada?
- Sim. A ferramenta oferece várias opções de personalização para adaptar a saída às suas necessidades específicas. Ajuste as configurações antes de gerar ou regenere com diferentes opções.
- O conteúdo gerado é de uso gratuito?
- Sim. Tudo o que você gera com esta ferramenta é seu para uso pessoal, educacional ou comercial, sem quaisquer restrições ou requisitos de atribuição.
- Isso requer uma conta?
- Não. A ferramenta está pronta para uso imediato, sem inscrição, e-mail e registro. Basta abrir a página e começar a gerar.
- Meus dados de entrada são mantidos em sigilo?
- Sim. Todo o processamento acontece no seu navegador. Seus dados de entrada e saída gerada nunca são enviados para nenhum servidor externo.
- Posso usar a mesma imagem OG para todas as páginas?
- Possível, mas abaixo do ideal. As imagens específicas da página superam as imagens genéricas de todo o site em termos de cliques. Use um padrão para substituto, mas produza imagens por página para conteúdo importante.
- A declaração de dimensão da imagem é necessária?
- Útil, mas não estritamente obrigatório. og:image:width e og:image:height permitem que as plataformas armazenem imagens em cache sem buscar novamente para determinar as dimensões. Acelera os compartilhamentos subsequentes.
- Meus dados foram carregados?
- Não. A geração acontece no seu navegador.
- Como faço para testar tags OG?
- O depurador de compartilhamento do Facebook, o validador de cartão do Twitter e o LinkedIn Post Inspector buscam e validam. Use-os após implantar novas tags OG.