👁️

Vista Previa de Open Graph

Pegá una URL y mirá cómo se va a ver ese link al compartirlo en Facebook, X y LinkedIn.

Esto pasa la URL por un servicio intermediario (proxy) para poder leer el código de esa página desde tu navegador. Si preferís que nada salga de tu navegador, usá la pestaña "Pegar código fuente".

  1. Abrí la página que querés revisar en otra pestaña.
  2. Presioná Ctrl+U (en Mac: Cmd+Option+U) para ver el código fuente.
  3. Seleccioná todo (Ctrl+A) y copiá (Ctrl+C).
  4. Pegalo acá abajo. Si tu página tiene og:image con una ruta relativa, también completá la URL de abajo para poder armarla bien.

Con este método el análisis es 100% local: el código fuente nunca sale de tu navegador.

¿Qué son las etiquetas Open Graph y por qué importan?

Cuando compartís un link en Facebook, X, LinkedIn o WhatsApp, esas plataformas no adivinan cómo mostrarlo: leen un puñado de etiquetas <meta> específicas (el estándar Open Graph, más algunas propias de X como twitter:card) que le indican qué título, descripción e imagen mostrar. Sin esas etiquetas bien configuradas, el link se comparte con una vista previa pobre — sin imagen, con el título equivocado, o directamente con la URL cruda — que reduce los clics aunque el contenido detrás sea bueno.

Por qué conviene revisarlo antes de publicar

Cada red arma su tarjeta con reglas distintas y no siempre respeta al pie de la letra lo que dice cada etiqueta, así que la única forma de estar seguro de cómo se va a ver un link es probarlo. Esta herramienta arma una vista previa aproximada de las tres plataformas más comunes a partir del mismo código fuente que ellas leen, y señala los problemas más frecuentes (falta de imagen, título o descripción demasiado largos) antes de que compartas el link de verdad.

Preguntas frecuentes

¿Qué son las etiquetas Open Graph?

Son etiquetas <meta> (og:title, og:description, og:image, entre otras) que ponés en el <head> de una página para controlar cómo se ve esa página cuando alguien comparte su link en redes sociales. Sin ellas, cada red decide por su cuenta qué mostrar, casi siempre con peores resultados.

¿Por qué el link se ve distinto en Facebook, X y LinkedIn?

Porque cada red tiene su propio formato de tarjeta (proporción de imagen, largo de título visible, si muestra la descripción o no) y además tiene sus propias etiquetas específicas (como twitter:card) además de las Open Graph genéricas. Esta herramienta arma una vista previa aproximada de cada una a partir de esas etiquetas.

¿Por qué no se ve mi imagen en la vista previa?

Lo más común es que falte la etiqueta og:image en el <head> de la página, o que apunte a una URL incorrecta o rota. También puede pasar que la imagen se genere de forma dinámica con JavaScript después de que carga la página, y por eso no aparezca en el código fuente estático que analiza esta herramienta.

¿Esta herramienta guarda las URLs que reviso?

No, cada verificación se hace al momento y no queda ningún registro guardado en ningún servidor propio.

Noticias y guías relacionadas

💡

¿Te falta alguna herramienta?

Contanos qué necesitás y la sumamos al catálogo.

Sugerir herramienta