Vista previa de OGP y metaetiquetas

Mira exactamente cómo aparece tu página al compartirla en Google, X (Twitter), Facebook y LINE, y copia las metaetiquetas que corrigen lo que falta. Gratis, sin registro.

¿Qué es OGP (Open Graph)?

El Open Graph Protocol (OGP) es un pequeño conjunto de etiquetas <meta> que colocas en el <head> de una página. Indican a otros servicios —redes sociales, apps de chat y cada vez más asistentes de IA— el título, la descripción y la imagen que deben usar cuando tu enlace se muestra como tarjeta.

Cuando alguien pega tu enlace en X, Facebook, LINE, Slack o Discord, esa plataforma lee tus etiquetas Open Graph y crea una tarjeta de vista previa. Si faltan, la tarjeta recurre a lo que pueda extraer, a menudo un enlace soso y sin imagen. X (Twitter) usa un conjunto parecido llamado Twitter Cards; la mayoría de los sitios configuran ambos.

Por qué importa: para los clics y para la IA

Una tarjeta rica, con un título claro, una descripción de una línea y una imagen de 1200×630, recibe muchos más clics que una URL simple. Esa es la razón directa y humana para hacer bien el OGP.

Hay una segunda razón fácil de pasar por alto: las mismas metaetiquetas de título y descripción están entre lo primero que leen los grandes modelos de lenguaje y los buscadores de IA para entender de qué trata una página. Unas etiquetas Open Graph limpias y precisas facilitan que tanto las personas como la IA resuman bien tu página. Dejarlas mal o vacías obliga a la máquina a adivinar.

Cómo usar esta herramienta

  1. Pega la URL completa de la página que quieres comprobar.
  2. Lee las tarjetas de vista previa para ver cómo mostrarán tu enlace Google, X, Facebook y LINE.
  3. Mira la lista de etiquetas que faltan para saber exactamente qué no está.
  4. Copia el bloque meta listo para pegar y añádelo dentro del <head> de tu página. Sustituye el marcador de imagen por una imagen real de 1200×630.
  5. Vuelve a comprobar para confirmar que la tarjeta ya se ve como quieres.

Las etiquetas que importan

Estas son las etiquetas Open Graph y Twitter Card que esta herramienta busca y genera:

og:title
El titular que aparece en la tarjeta. Mantenlo por debajo de unos 60 caracteres.
og:description
Un resumen de una o dos líneas. Apunta a 60–160 caracteres.
og:image
La imagen de vista previa. Usa 1200×630 píxeles para la tarjeta grande.
og:url
La URL canónica de la página, para que los enlaces apunten a la dirección correcta.
og:type
Normalmente "website" para una página o "article" para una entrada.
og:site_name
El nombre de tu sitio, que se muestra junto a la tarjeta.
twitter:card
Usa "summary_large_image" para la tarjeta con imagen grande en X.

Preguntas frecuentes

¿Este comprobador de OGP es gratis?
Sí. Pega una URL y obtén la vista previa, la lista de etiquetas que faltan y el código listo para pegar, sin registro ni tarjeta de crédito.
¿Qué tamaño debe tener og:image?
Usa 1200×630 píxeles para la tarjeta grande que prefieren X, Facebook y LINE. Las imágenes más pequeñas pueden recortarse o mostrarse como una miniatura.
Mis etiquetas están bien pero sigue saliendo la tarjeta antigua. ¿Por qué?
Las plataformas guardan en caché los datos de Open Graph. Tras actualizar, usa el depurador de la propia plataforma (por ejemplo, el Sharing Debugger de Facebook) para forzar una actualización.
¿Las etiquetas Open Graph ayudan con la búsqueda por IA?
Ayudan. El título y la descripción que defines están entre las señales que usan los asistentes y buscadores de IA para entender y resumir tu página. Son una parte de un cuadro mayor: ejecuta la comprobación gratuita de 10 puntos para el resto.