Herramientas

Vista previa de Open Graph

Previsualiza cómo se ve tu página al compartirla en redes. Ingresa una URL para revisar las metaetiquetas de Open Graph y Twitter.

Previsualizar una URL

Ingresa la URL pública de una página para obtener sus metaetiquetas de Open Graph y Twitter y ver vistas previas aproximadas. Si el servidor no alcanza la URL, se intenta una solicitud directa.

Advertencias de la vista previa

Vistas previas en redes

Maquetas aproximadas a partir de las etiquetas encontradas. Las plataformas reales pueden usar caché o mostrar las tarjetas de otra forma.

Facebook / Meta

LinkedIn

X (Twitter)

Slack

Metaetiquetas

EtiquetaValorOrigen

No se encontraron metaetiquetas de Open Graph, Twitter ni de respaldo en esta página.

El análisis se hace en local. En el modo de pegado no se envía nada al servidor.

Mira cómo se ven tus enlaces al compartirlos

Cuando alguien comparte un enlace en redes o en un chat, las plataformas arman una tarjeta con las metaetiquetas de Open Graph y Twitter. Una imagen faltante o una descripción floja puede hacer que un buen artículo se vea incompleto.

La herramienta obtiene una URL pública, lee sus metaetiquetas y muestra maquetas aproximadas para plataformas habituales. Úsala para detectar etiquetas faltantes, textos flojos o problemas de imagen antes de publicar o promocionar una página.

¿Qué son las etiquetas de Open Graph?

Las etiquetas de Open Graph son elementos meta del head que describen cómo debe verse una URL al compartirse. Las más importantes son og:title, og:description, og:image y og:url. Las Twitter Card siguen un patrón parecido y controlan cómo se ven los enlaces en X.

Estas etiquetas no cambian lo que ven las personas en la página. Solo influyen en las vistas previas de las plataformas que las leen al compartir una URL.

Qué permite esta herramienta

  • Previsualiza tarjetas de enlace para Facebook, X, LinkedIn y Slack.
  • Obtén metaetiquetas de Open Graph y Twitter de cualquier URL pública.
  • Ve el título, la descripción, la imagen y la URL resueltos.
  • Revisa todas las etiquetas encontradas en una tabla, con el origen de cada una.
  • Recibe advertencias por imágenes o títulos faltantes, o por diferencias con la URL canónica.
  • Copia las etiquetas encontradas al portapapeles.
  • Pega HTML cuando no se pueda obtener una URL.

Notas por plataforma

Facebook y LinkedIn dependen mucho de las etiquetas de Open Graph. X usa las Twitter Card cuando existen, pero a menudo recurre a Open Graph. Slack y otras apps de chat suelen tomar los mismos og:title, og:description y og:image.

Las plataformas guardan las vistas previas en caché, así que los cambios pueden no verse de inmediato. Usa el depurador de Facebook o el validador de tarjetas de X para confirmar la versión en caché de cada red.

Buenas prácticas

  • Usa un og:url único que coincida con la URL canónica de la página.
  • Mantén og:title breve: la mayoría de las plataformas recortan los títulos largos.
  • Escribe og:description como un resumen corto, no como un párrafo completo del cuerpo.
  • Usa URLs HTTPS absolutas en og:image para que las plataformas puedan obtener la imagen.
  • Agrega etiquetas de Open Graph y de Twitter Card para que las vistas previas en X sean consistentes.
  • Después de publicar cambios, usa el depurador de cada plataforma para refrescar la caché.

Privacidad

La obtención de URLs pasa primero por el servidor de Contismo para poder leer la mayoría de las páginas públicas. Si falla, se intenta una solicitud directa, útil para localhost o páginas que el servidor no alcanza. El HTML pegado se analiza en local.

  • Las vistas previas por URL se obtienen primero en el servidor, con un respaldo si el servidor no alcanza la página.
  • El HTML pegado se analiza en local y no se sube.
  • No necesitas registrarte ni crear una cuenta.

Preguntas frecuentes

Open Graph es un conjunto de metaetiquetas, normalmente con el prefijo og:, que indican a las redes cómo titular, describir e ilustrar un enlace al compartirlo. Viven en el head y no cambian lo que ven las personas en la página.

La vista previa busca etiquetas habituales de Open Graph, como og:title, og:description, og:image, og:url, og:type y og:site_name. También lee Twitter Card como twitter:card, twitter:title, twitter:description y twitter:image, y recurre al título de la página, la meta description y el favicon cuando hace falta.

Las redes guardan las vistas previas en caché y pueden aplicar sus propias reglas de renderizado. Esta herramienta muestra una aproximación a partir de las etiquetas del HTML que obtienes o pegas. Usa el depurador oficial de cada plataforma cuando necesites la vista previa en caché.

Un buen punto de partida es 1200 por 630 píxeles para las tarjetas grandes de Facebook, LinkedIn y X. Aleja el contenido importante de los bordes, usa JPG o PNG y asegúrate de que la URL de la imagen sea pública por HTTPS.

Las etiquetas de Open Graph se usan en muchas redes. Las Twitter Card son específicas de X y controlan el diseño con valores como summary y summary_large_image. Muchos sitios definen ambas para que cada plataforma tenga metadatos explícitos.

Cuando previsualizas por URL, el HTML de la página se obtiene primero a través de nuestro servidor. Si falla, se intenta una solicitud directa. Si pegas HTML, el análisis es local y no se sube nada.

¿Listo para crear algo increíble?

Únete a más de 5000 equipos que construyen con Contismo. Publica tu primer modelo de contenido en menos de 5 minutos.