Vista Previa de Open Graph

Crea etiquetas Open Graph y visualiza cómo se verá tu enlace en redes sociales antes de publicarlo.

Entrada

Usa esta herramienta gratuita Vista Previa de Open Graph para previsualiza cómo se ve tu contenido en las redes sociales.

Sobre la Vista Previa de Open Graph

Simula la tarjeta social y entrega las etiquetas OG/Twitter necesarias para asegurar una buena presentación al compartir.

Cómo funciona la vista previa de Open Graph

Al enviar una URL se descarga el HTML una sola vez (tiempo límite de 8 segundos, tope de 1 MB, solo tipos de contenido HTML) y se analizan todos los pares property/name de las etiquetas meta, el <title> y rel="canonical". Los valores se resuelven en cascada: og:title → twitter:title → <title>; og:description → twitter:description → description; og:image → og:image:url → og:image:secure_url → twitter:image. Las URL relativas se resuelven tomando como base og:url, el enlace canónico o la URL final tras redirecciones. Los títulos se cortan en 70 caracteres y las descripciones en 200, con puntos suspensivos. Las etiquetas ausentes generan una lista de incidencias, y el fragmento creado usa twitter:card summary_large_image solo si se encontró imagen.

Ventajas

Previo visual + código en un solo paso.
Detecta campos faltantes.
Obtenemos la página a través de nuestro proxy, para que puedas revisar cualquier URL pública.

Cómo usar

1

Pega la URL pública de la página que quieres inspeccionar (sin muros de inicio de sesión).

2

Pulsa Ejecutar para que obtengamos y analicemos los metadatos en vivo automáticamente.

3

Revisa la tarjeta de vista previa y los avisos de etiquetas que falten.

4

Copia el bloque de meta etiquetas recomendadas y actualiza tu CMS o el `<head>`.

Errores comunes

Usar imágenes verticales que se recortan.
Copiar landing pages sin actualizar `og:url`.
Descripciones demasiado largas que las plataformas cortan.

Ver también

  • Verificador de meta título — Cuando ya tengas og:title, comprueba que el <title> subyacente siga dentro de la longitud que muestra Google.
  • Vista previa de meta descripción — Las tarjetas sociales recurren a la etiqueta description, así que revisa cómo se ve ese mismo texto en un snippet de Google.

Preguntas frecuentes

¿Qué tamaño de imagen es ideal?

1200×630 px.

¿Sirve para Twitter Cards?

Sí, incluye etiquetas `twitter:*`.

¿La vista previa es exacta?

Es una guía basada en OG; cada red puede aplicar ajustes.

¿Se guardan mis datos?

Obtenemos la página a través de un proxy solo para leer sus meta etiquetas; el resultado analizado se queda en tu sesión y no se almacena.