ℹInfoOpen Graph

og:description um pouco longa — Ajuste fino do comprimento da descrição

Descrições entre 160 e 200 caracteres podem ser truncadas em algumas plataformas.

Qual é o problema?

Sua og:description tem entre 160 e 200 caracteres. Embora não seja criticamente longa, algumas plataformas sociais começam a truncar a descrição por volta de 155-160 caracteres.

Quais plataformas truncam cedo?

Plataforma	Limite aproximado	Risco em 160-200 caracteres
LinkedIn	~150 caracteres	Alto — vai truncar
WhatsApp	~150 caracteres	Alto — vai truncar
Slack	~150 caracteres	Alto — vai truncar
Facebook	~200 caracteres	Baixo — em geral seguro
Discord	~350 caracteres	Muito baixo

O ponto ideal: 110-160 caracteres

Essa faixa garante que a descrição completa fique visível em todas as principais plataformas. Você tem espaço suficiente para um resumo convincente sem risco de truncamento.

Como corrigir

Corte algumas palavras da descrição para ficar abaixo de 160 caracteres:

<!-- Slightly long (170 chars) -->
<meta property="og:description" content="Learn everything you need to know about implementing Open Graph tags for better social media previews. Step-by-step guide with code examples included." />

<!-- Better (under 160 chars) -->
<meta property="og:description" content="Learn how to implement Open Graph tags for better social previews. Step-by-step guide with code examples." />

Dicas para enxugar

Remova palavras de preenchimento — “tudo o que você precisa saber sobre” → “como”
Use sinônimos mais curtos — “implementando” → “adicionando”, “abrangente” → “completo”
Corte frases redundantes — Se o título já diz “Guia”, não repita na descrição
Coloque o essencial no início — As palavras mais importantes primeiro, para que mesmo truncado o sentido fique claro

Verifique suas etiquetas Open Graph

Artigos relacionados

og:image quebrada

A URL de og:image não retorna uma imagem válida. As plataformas sociais mostrarão uma pré-visualização quebrada ou ausente.

URL canônica diferente da URL da página

A URL canônica aponta para uma URL diferente da página atual.

Charset não é a primeira meta tag

A declaração de charset deve ser o primeiro elemento dentro de <head>.

og:description poderia ser mais longa

Você tem espaço para uma descrição mais detalhada e aumentar o engajamento.

og:description contém uma URL

A og:description deve ser um resumo legível, não uma URL.

Keyword stuffing em og:description

Repetir as mesmas palavras em excesso na descrição parece spam.

Servidor MCP do OpenGraph

Inspecione tags OG direto do seu editor

O servidor MCP do OpenGraph permite inspecionar e analisar meta tags Open Graph diretamente do seu editor com IA ou assistente. Ele oferece duas ferramentas:

inspect_og— Obter e pontuar tags OG de qualquer URL
suggest_og_tags— Gerar HTML de meta tags recomendadas

Adicione o servidor ao arquivo .cursor/mcp.json do seu projeto:

{
  "mcpServers": {
    "opengraph": {
      "command": "npx",
      "args": ["-y", "opengraph-mcp"]
    }
  }
}

Reinicie o Cursor depois de adicionar a configuração.

Adicione ao seu arquivo .vscode/mcp.json (requer extensão GitHub Copilot):

{
  "servers": {
    "opengraph": {
      "command": "npx",
      "args": ["-y", "opengraph-mcp"]
    }
  }
}

Certifique-se de ter o GitHub Copilot com suporte a MCP habilitado.

Adicione ao seu arquivo claude_desktop_config.json:

{
  "mcpServers": {
    "opengraph": {
      "command": "npx",
      "args": ["-y", "opengraph-mcp"]
    }
  }
}

O arquivo de configuração fica em ~/Library/Application Support/Claude/claude_desktop_config.json no macOS ou %APPDATA%\Claude\claude_desktop_config.json no Windows.

Adicione ao seu arquivo ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "opengraph": {
      "command": "npx",
      "args": ["-y", "opengraph-mcp"]
    }
  }
}

Reinicie o Windsurf depois de modificar a configuração.

Adicione ao seu settings.json do Zed em context_servers:

{
  "context_servers": {
    "opengraph": {
      "command": {
        "path": "npx",
        "args": ["-y", "opengraph-mcp"]
      }
    }
  }
}

Abra as configurações com Cmd+, e adicione a configuração.

Exemplos de uso

▶"Inspecione as tags OG de github.com"

▶"Sugira meta tags OG para o meu site https://example.com"

▶"Verifique se o meu blog tem etiquetas Open Graph corretas"