ℹ Info Open Graph

og:description demasiado corta — Maximiza tu impacto en redes sociales

Las descripciones cortas desperdician la oportunidad de atraer usuarios.

¿Cuál es el problema?

Tu og:description tiene menos de 50 caracteres. Aunque es técnicamente válida, una descripción corta no aprovecha el espacio que las plataformas sociales te ofrecen para convencer a los usuarios de hacer clic.

Por qué las descripciones cortas rinden menos

Las previsualizaciones de enlaces en redes sociales son básicamente mini anuncios de tu contenido. Una descripción como “Échale un vistazo” o “Nuestra última publicación” desperdicia la oportunidad de:

Explicar de qué trata el contenido
Destacar el valor o beneficio
Diferenciarte de otros enlaces compartidos en el feed

Longitud óptima: 110-160 caracteres

Este rango ideal te permite escribir 2-3 frases convincentes que den a los usuarios una razón clara para hacer clic.

Cómo mejorarla

<!-- Demasiado corta -->
<meta property="og:description" content="Nuestro nuevo producto." />

<!-- Mejor -->
<meta property="og:description" content="Te presentamos nuestro nuevo producto: una herramienta de revisión de código con IA que detecta errores antes de llegar a producción. Gratis para proyectos open source." />

Consejos para ampliar tu descripción

Responde “¿Qué gano yo?” — Dile a los usuarios qué obtendrán al visitar tu página
Añade datos concretos — Números, funcionalidades o ventajas únicas
Incluye una llamada a la acción sutil — “Descubre más”, “Explora las funciones”, “Empieza gratis”
Menciona el formato — “Videotutorial”, “Guía paso a paso”, “Herramienta gratuita”
Anticipa el contenido — Ofrece una muestra de lo que encontrarán sin revelarlo todo

Verifica tus etiquetas Open Graph

Artículos relacionados

og:image rota

La URL de og:image no devuelve una imagen válida. Las plataformas sociales mostrarán una vista previa rota o vacía.

La URL canónica difiere de la URL de la página

La URL canónica apunta a una URL diferente a la de la página actual.

El charset no es la primera etiqueta meta

La declaración de charset debería ser el primer elemento dentro de <head>.

og:description podría ser más larga

Tienes espacio para una descripción más detallada que aumente la interacción.

og:description contiene una URL

La og:description debería ser un resumen legible, no una URL.

Keyword stuffing en og:description

Repetir las mismas palabras excesivamente en la descripción se percibe como spam.

Servidor MCP de OpenGraph

Inspecciona tags OG directamente desde tu editor

El servidor MCP de OpenGraph te permite inspeccionar y analizar meta tags Open Graph directamente desde tu editor con IA o asistente. Proporciona dos herramientas:

inspect_og — Obtener y puntuar tags OG de cualquier URL
suggest_og_tags — Generar HTML de meta tags recomendados

Agrega el servidor al archivo .cursor/mcp.json de tu proyecto:

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

Reinicia Cursor después de agregar la configuración.

Agrega a tu archivo .vscode/mcp.json (requiere extensión GitHub Copilot):

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

Asegúrate de tener GitHub Copilot con soporte MCP habilitado.

Agrega a tu archivo claude_desktop_config.json:

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

El archivo de configuración está en ~/Library/Application Support/Claude/claude_desktop_config.json en macOS o %APPDATA%\Claude\claude_desktop_config.json en Windows.

Agrega a tu archivo ~/.codeium/windsurf/mcp_config.json:

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

Reinicia Windsurf después de modificar la configuración.

Agrega a tu settings.json de Zed bajo context_servers:

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

Abre ajustes con Cmd+, y agrega la configuración.

Ejemplos de uso

▶ "Inspecciona los tags OG de github.com"

▶ "Sugiere meta tags OG para mi sitio web https://example.com"

▶ "Verifica si mi blog tiene etiquetas Open Graph correctas"