By Bruchentko Cuando se trata de compartir contenido en redes sociales, el control sobre cómo se ve tu página es clave. No basta con tener buen contenido: si el título, la descripción o la imagen no están bien configurados, perdés clics, tráfico y oportunidades de viralidad.
Ahí es donde entra en juego el protocolo Open Graph.
Implementar correctamente las etiquetas OG no solo mejora la presentación en redes como Facebook, LinkedIn o Pinterest, sino que también impacta en tu estrategia SEO al aumentar el CTR y reforzar tu imagen de marca.
¿Qué es Open Graph?
Open Graph es un protocolo creado por Facebook en 2010 que permite a cualquier sitio web controlar cómo se muestra su contenido al ser compartido en redes sociales.
A través de etiquetas HTML insertadas en el <head> de la página, podés definir manualmente:
- El título que se mostrará.
- Una descripción atractiva.
- Una imagen destacada.
- La URL exacta y su tipo de contenido.
Esto evita que las plataformas generen previews automáticos confusos o poco atractivos, y te da control total sobre tu presencia social.
Hoy en día, Open Graph es soportado por plataformas como LinkedIn, Pinterest, Slack y más. Twitter tiene sus propias etiquetas (Twitter Cards), pero pueden convivir perfectamente.
Principales etiquetas Open Graph
Vamos con las etiquetas:
1. og:title
Define el título del contenido tal como se verá en redes. Debe ser claro, atractivo y contener tu palabra clave principal.
Ejemplo:
<meta property="og:title" content="Guía completa sobre Open Graph" />
2. og:description
Es el texto descriptivo que acompaña al título. Idealmente, debería ser un resumen llamativo con un llamado a la acción.
Ejemplo:
<meta property="og:description" content="Aprendé cómo implementar correctamente las etiquetas Open Graph y optimizá tu presencia en redes sociales." />
3. og:image
La imagen destacada que se mostrará al compartir la URL. Este campo es clave para el CTR. La recomendación general es una imagen de mínimo 1200×630 px, bien optimizada y de alta calidad.
Ejemplo:
<meta property="og:image" content="https://tupacbruch.com/wp-content/uploads/2024/04/open-graph-ejemplo.jpg" />
4. og:url
La URL canónica que debe mostrarse. Idealmente, una URL limpia, sin parámetros ni redirecciones.
Ejemplo:
<meta property="og:url" content="https://tupacbruch.com/open-graph/" />
5. og:type
Indica el tipo de contenido. Los más comunes son:
website(para páginas de inicio)article(para posts o noticias)video.movie,music.song, etc.
Ejemplo:
<meta property="og:type" content="article" />
6. og:site_name
Permite incluir el nombre del sitio o marca para reforzar autoridad y reconocimiento.
Ejemplo:
<meta property="og:site_name" content="Tupac Bruch" />
7. og:video (opcional)
Si tu página incluye un video, podés usar esta etiqueta para mostrarlo directamente en la preview.
<meta property="og:video" content="https://tusitio.com/video.mp4" />
Diferencias con otras etiquetas sociales: Twitter Cards y Rich Pins
Aunque Open Graph es el más universal, otras redes tienen sus propias etiquetas:
| Red Social | Etiquetas | Compatibilidad con OG |
|---|---|---|
| Open Graph | Total | |
| Open Graph | Total | |
| Twitter Cards | Parcial (mejor con tags propias) | |
| Rich Pins | Compatible y validables |
Para Twitter, por ejemplo:
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Título para Twitter">
<meta name="twitter:description" content="Descripción para Twitter">
<meta name="twitter:image" content="https://tuimagen.com/og-twitter.jpg">
Herramientas para validar tus etiquetas Open Graph
Antes de lanzar una campaña o compartir un enlace importante, asegurate de que todo se vea bien con estas herramientas:
Además, si actualizás una imagen y no se refleja en la preview, estas herramientas también fuerzan una “limpieza de caché” de la URL.
Cómo implementar Open Graph en WordPress
Si usás WordPress, no necesitás tocar el código a mano. Plugins como Rank Math o Yoast SEO permiten configurar las etiquetas OG de forma visual.
Con Rank Math, por ejemplo:
- Entrá al editor del post o página.
- Navegá a la pestaña «Social».
- Configurá manualmente el título, descripción y la imagen Open Graph.
Esto te asegura control total sobre cómo se comparte tu contenido.
Buenas prácticas para optimizar Open Graph
- Usá imágenes de calidad: mínimo 1200x630px, formato JPG o PNG.
- Cada página debe tener su propia imagen, título y descripción.
- No repitas el mismo OG en todo el sitio.
- Usá URLs limpias y preferiblemente con HTTPS.
- Comprobá los resultados en los validadores antes de compartir.
También podés leer sobre la importancia de mantener URLs optimizadas en esta guía: URLs SEO-friendly
¿Cómo influye Open Graph en el SEO?
Aunque las etiquetas OG no impactan directamente en el ranking de Google, sí lo hacen indirectamente:
- Mejoran el CTR desde redes sociales.
- Aumentan la viralidad y el tráfico de referencia.
- Refuerzan tu marca en entornos sociales.
- Mejoran la experiencia del usuario, lo que sí afecta al posicionamiento.
Más sobre este enfoque en: SEO on page y experiencia del usuario y SEO.
Conclusión
Optimizar las etiquetas Open Graph debería ser parte de cualquier estrategia SEO moderna. No solo ayudan a que tu contenido se vea mejor en redes sociales, sino que te permiten controlar cómo se presenta tu marca y cómo te perciben tus usuarios.
Una buena implementación es simple, rápida y puede marcar la diferencia entre ser ignorado o ser clickeado.
Si encontraste útil toda la información que hemos compartido, te agradecemos sinceramente tu apoyo. Si deseas colaborar con nosotros, puedes hacerlo mediante una donación a través de PayPal o Cafecito. Tu generosidad nos ayuda a mantener nuestro contenido libre de publicidad y a seguir ofreciendo información valiosa para ti y para nuestra comunidad de lectores.
Si estás considerando crear tu propio sitio web, te recomendamos WordPress. Es una plataforma fácil de usar y muy popular que te permitirá llevar tus ideas al mundo digital. Haz clic en el banner de abajo para obtener un descuento adicional.
¿Qué te ha parecido?
