Saltar al contenido

Mejora los resultados en Redes Sociales con Etiquetas Open Graph

¿Ya notaste que cuando compartís contenidos en Instagram, LinkedIn o WhatsApp aparece una vista previa con imagen, título y una pequeña descripción? Esa “preview” no es aleatoria: se genera a partir de los metadatos definidos con etiquetas Open Graph. Estas etiquetas te permiten decidir exactamente qué imagen se va a mostrar, qué título y qué texto resumen verá quien reciba o vea tu enlace. En este artículo te explico cómo podés implementar estas etiquetas de forma práctica y estratégica, tanto en tu blog como en tu tienda online. Así, cuando alguien comparte una Página de Detalle de Producto (PDP) en un grupo de WhatsApp, o publica una nota de tu blog en su feed de LinkedIn, vos podés asegurarte de que se muestre la imagen del producto correcta y un texto que invite al clic. No dejes al azar algo tan importante: los usuarios ya están compartiendo tus contenidos, asegurate de que eso sume y no reste.

¿Qué es el protocolo Open Graph?

El protocolo Open Graph fue creado por Facebook (ahora Meta) con un objetivo claro: estructurar mejor los contenidos que se comparten en internet. Básicamente, nos permite controlar cómo se ve una URL cuando alguien la comparte en redes sociales, usando metadatos. Con estas etiquetas podés definir el título, la descripción, la imagen, el tipo de contenido, entre otros datos.

Desde mi enfoque de SEO y marketing de contenidos, siempre recomiendo implementar estas etiquetas porque ayudan a que tus enlaces luzcan más atractivos, generen más clics y, en última instancia, mejoren tu posicionamiento.

¿Para qué sirve el Open Graph?

El contenido que creamos está pensado para compartirse. Por eso, si querés que una publicación se vea profesional y atractiva, necesitás controlar lo que se muestra. Las etiquetas Open Graph te permiten eso: definir la vista previa del contenido en cualquier red social o plataforma que use “rich previews”.

¿El resultado? Mayor control visual, más clics, mejor CTR y una experiencia de usuario coherente con tu marca.

Beneficios SEO al utilizar Open Graph

Sé que muchos colegas se preguntan si realmente impactan el SEO. Técnicamente, Google no toma directamente estas etiquetas como un factor de posicionamiento. Pero indirectamente, sí tienen un efecto importante:

  • Mejoran la apariencia de tus enlaces cuando se comparten.
  • Aumentan el engagement: más clics, más tráfico.
  • Ahorrás tiempo con publicaciones automatizadas.
  • Fortalecen la imagen de marca en redes sociales.

Yo las considero un elemento clave para facilitar la viralización del contenido. Si bien no reemplazan una buena estrategia de contenidos, sí la potencian.

Ejemplos de etiquetas Open Graph

Te cuento cómo suelo hacerlo según cada plataforma:

Open Graph Para Facebook, LinkedIn y WhatsApp entre otros

Acá te explico etiqueta por etiqueta, con ejemplos reales:

  • <strong>og:title</strong>: Este es el título que va a aparecer como cabecera cuando se comparta tu enlace. Tiene que ser claro, directo, atractivo y contener el gancho principal del contenido. Ejemplo:
<meta property="og:title" content="¿Qué es el Marketing de Contenidos?" />

Este título será lo primero que lean tus usuarios, tanto en Facebook como en LinkedIn. Si no engancha, no hay clic.

  • <strong>og:description</strong>: Es el texto que aparece debajo del título. No sirve solo para resumir el contenido, sino para generar interés. Acá podés incluir un llamado a la acción (CTA) sutil. Ejemplo:
<meta property="og:description" content="¿Conocés cómo atraer usuarios y deleitarlos con tu contenido? Esta estrategia es para vos." />

Una buena descripción puede marcar la diferencia entre pasar desapercibido o generar interacción.

  • <strong>og:url</strong>: Esta es la URL canónica del contenido. Asegurate de que no tenga parámetros innecesarios y que represente de forma limpia la página. Ejemplo:
<meta property="og:url" content="https://tusitio.com/marketing-de-contenidos" />
  • <strong>og:image</strong>: Es la imagen que se mostrará como preview. Este es probablemente el elemento más llamativo y el que más influye en el CTR. Tiene que tener buena resolución (mínimo 1200×630 px), ser relevante y estar optimizada. Ejemplo:
<meta property="og:image" content="https://tusitio.com/img/marketing.jpg" />

Facebook y LinkedIn priorizan las imágenes grandes. WhatsApp también la muestra en vista previa si el enlace tiene esa metadata cargada.

  • <strong>og:video</strong>: Si el contenido tiene video, esta etiqueta le avisa a la plataforma para que pueda previsualizarlo. Es útil en landing pages de cursos, trailers o portfolios. Ejemplo:
<meta property="og:video" content="http://tusitio.com/video-presentacion.mp4" />
  • <strong>og:type</strong>: Define qué tipo de contenido es: puede ser “article”, “video”, “product”, entre otros. Esto ayuda a las plataformas a categorizar mejor la información. Ejemplo:
<meta property="og:type" content="article" />
  • <strong>og:site_name</strong>: Es el nombre del sitio o marca. Aparece generalmente en la parte inferior de la tarjeta. Refuerza la identidad y da contexto. Ejemplo:
<meta property="og:site_name" content="Tu Marca o Sitio Web" />

etiquetas Open Graph para Twitter, “Twitter Cards”

Twitter tiene sus propias etiquetas, pero la lógica es similar. Las más importantes:

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="¿Qué es el Marketing de Contenidos?" />
<meta name="twitter:description" content="Aprendé a crear contenido que enamore a tus usuarios." />
<meta name="twitter:url" content="https://tusitio.com/marketing-de-contenidos" />
<meta name="twitter:image" content="https://tusitio.com/img/marketing.jpg" />
  • twitter:card: Puede ser “summary” o “summary_large_image”. Yo siempre recomiendo usar la segunda.
  • twitter:title y twitter:description: lo mismo que Open Graph, pero adaptado a los 70 y 200 caracteres que suele mostrar Twitter.
  • twitter:image: clave. Asegurate que la imagen esté alojada en un servidor HTTPS y cargue rápido.

Instalar etiquetas Open Graph en WordPress

Para WordPress, lo más práctico es usar un plugin como Yoast SEO o Rank Math, que permiten editar estas etiquetas sin tocar el código. Te recomiendo configurar título, descripción e imagen personalizada para cada artículo.

Además, podés usar la opción de “Vista previa en redes” para testear cómo se vería antes de publicar.

Herramientas para previsualizar cómo se ve tu contenido en redes sociales

Facebook post Preview – Open Graph test

Facebook Sharing Debugger: esta herramienta te permite visualizar en tiempo real cómo Facebook interpreta los metadatos de una URL. Además, podés actualizar la caché si hiciste cambios recientes en tus etiquetas y querés que se reflejen cuanto antes. Es clave para asegurarte de que la vista previa sea exactamente como la pensaste.

Linkedin post Preview – Open Graph test

LinkedIn Post Inspector: funciona de manera muy similar al debugger de Facebook. Pegás tu URL y LinkedIn te muestra cómo leería los datos Open Graph. Podés forzar la actualización del contenido si ya fue compartido alguna vez. Es muy útil para asegurarte de que el og:title, og:image y og:description se estén mostrando correctamente.

  • WhatsApp: al momento no cuenta con una herramienta pública de “debug” de previews como Facebook o LinkedIn. Sin embargo, podés usar la vista previa automática de WhatsApp Web o móvil para testear cómo se ve un enlace. En caso de errores (como que no se cargue la imagen), revisá:
    • Que el og:image tenga HTTPS y cargue sin redireccionamientos.
    • Que el dominio no esté bloqueado por políticas de WhatsApp.
    • Que los metadatos estén disponibles en el head antes del contenido JS dinámico.

Consideraciones importantes para Open Graph

  • Asegurate que la imagen tenga buen tamaño (mínimo 1200×630 px).
  • Usá títulos claros y específicos. Considera que el og:title puede ser diferente al <title>, asi podes tener un Tono y mensaje difereten entre resutados organicos y Redes Sociales.
  • en <strong>og:description</strong> Deberías utilizar en CTA (llamado a la acción)
  • Probá cómo se ve el link en el Facebook Sharing Debugger. Esta herramienta te permite visualizar en tiempo real cómo Facebook interpreta los metadatos de una URL. Además, podés actualizar la caché si hiciste cambios recientes en tus etiquetas y querés que se reflejen cuanto antes. Es clave para asegurarte de que la vista previa sea exactamente como la pensaste.
  • En WhatsApp, si ves que no se muestra bien la imagen, es probable que el dominio tenga problemas de redirección o que no esté disponible el og:image correctamente al momento de cargar. Podés testearlo con el inspector de red del navegador.

Las etiquetas Open Graph no son un truco de magia, pero sí una herramienta concreta para que tu contenido se vea mejor, se entienda más fácil y tenga más chances de ser compartido. Yo las uso en todos mis proyectos porque marcan la diferencia.