IA y Búsqueda
Pré-visualizações em redes sociais e meta-tags
Como configurar Open Graph e Twitter Cards para pré-visualizações perfeitas no WhatsApp, LinkedIn, X, Slack e Facebook.
Quando alguém partilha um link para o seu website no WhatsApp, LinkedIn, Slack ou X, a pré-visualização social (link preview) é o elemento que decide se o destinatário clica ou ignora a mensagem.
Uma imagem cortada, um título em falta ou uma descrição genérica transmitem de imediato uma imagem amadora. Contudo, em auditorias técnicas encontramos com frequência meta-tags sociais incompletas ou ausentes.
Eis o guia completo para configurar meta-tags Open Graph e Twitter Cards sem falhas.
As tags essenciais de Open Graph (OG)
Criado originalmente pelo Facebook, o protocolo Open Graph é hoje o padrão universal adotado pelo WhatsApp, LinkedIn, Slack, Telegram, iMessage e Discord.
Insira sempre estas tags na secção <head> de cada página:
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Live Ajans" />
<meta property="og:url" content="https://example.com/artigo" />
<meta property="og:title" content="Título apelativo com menos de 60 caracteres" />
<meta property="og:description" content="Descrição clara e cativante do conteúdo com menos de 160 caracteres." />
<meta property="og:image" content="https://example.com/images/share-preview.jpg" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:alt" content="Descrição informativa da imagem de destaque" />
<meta property="og:locale" content="pt_PT" />Tags para Twitter / X Cards
Embora o X suporte tags Open Graph como recurso alternativo, a utilização de tags específicas garante a apresentação com imagem grande (summary_large_image):
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Título apelativo com menos de 60 caracteres" />
<meta name="twitter:description" content="Descrição clara com menos de 160 caracteres." />
<meta name="twitter:image" content="https://example.com/images/share-preview.jpg" />As regras de ouro para imagens Open Graph
- Dimensões recomendadas: Utilize sempre a proporção exata de 1200 x 630 pixels (relação 1,91:1). Este formato assegura nitidez em todos os ecrãs e aplicações.
- Tamanho do ficheiro: Mantenha o ficheiro abaixo de 1 MB (preferencialmente abaixo de 300 KB). O WhatsApp e o iMessage não descarregam imagens demasiado pesadas, apresentando caixas vazias.
- URLs absolutas obrigatórias: O caminho da imagem tem de ser uma URL absoluta com
https://. Caminhos relativos como/images/og.jpgnão são suportados pelas aplicações. - Margem de segurança para textos: Mantenha textos e logótipos no terço central da imagem (mínimo de 80px de margem) para evitar cortes em formatos circulares ou móveis.
Limpeza de cache e validação de pré-visualizações
As redes sociais armazenam as pré-visualizações em cache de forma agressiva. Ao atualizar uma imagem ou título, utilize as ferramentas oficiais de depuração para forçar a atualização imediata:
- LinkedIn Post Inspector: Essencial para artigos e páginas corporativas B2B.
- Facebook Sharing Debugger: Atualiza a cache para o Facebook, Messenger e WhatsApp.
- X Card Validator: Permite verificar a renderização no X.
Uma configuração correta de meta-tags demora poucos minutos e aumenta significativamente a taxa de cliques orgânicos em todos os canais de partilha.
