Guía Definitiva: Etiquetas Meta & OpenGraph
Optimiza tus tarjetas sociales y mejora el Click-Through Rate reproduciendo visualmente tu aparición en feeds de Facebook, LinkedIn y X.
¿Qué es y para qué sirve?
El protocolo Open Graph (OG) y las Twitter Cards marcan las directrices que ordenan a las redes sociales cómo visualizar el empaquetado de tu enlace en un entorno rico (Rich Snippet Social). Permite controlar exactamente el título, la descripción narrativa y fundamentalmente la imagen de pre-visualización de tu enlace. Generar estas etiquetas previene que Facebook asigne imágenes aleatorias pixeladas que destruyen la atracción y restan clics de usuarios calificados (CTR).
Errores comunes que arruinan tu tráfico social
- Doble inyección conflictiva de Etiquetas: Plugins múltiples en WordPress intentando sobrescribirse inyectan la misma etiqueta Open Graph al <head> 2 veces. Las redes sociales fallarán interrumpiendo el flujo del render, mostrando el temible marco gris vacío.
- Recorte accidental en formato cuadrado (1:1): Asumir que la etiqueta
og:imagesiempre se verá apaisada (paisaje). En iMessage móvil, y Telegram, por su interfaz angosta la extraen en un cuadrado absoluto. Ubicar figuras comerciales al extremo resultará en imágenes mutiladas. Todo el núcleo debe habitar seguro al centro. - Rutas relativas en las URLs de Imágenes: Ingresar valores erróneos como
content="/images/portada.jpg"en la directiva og:image. Las arañas sociológicas exigen estrictamente que apuntes la red usando un enlace absoluto hipertextual (https://tusitio.com/images/portada.jpg).
Mejores prácticas
- Medio universal infalible (1200 x 630px): Sube tu
og:imageen este calibre. El peso debe conservarse estrictamente menor a los 5 MB estipulados por los lineamientos severos del motor renderizador de WhatsApp y Slack. - Usa un lenguaje publicitario (Direct Response): A diferencia del Meta Title para el motor de Google -que debe ser rígido y buscar encajar con intenciones pasivas-, el título de tu
og:titledebe operar en modo "Copywriting disruptivo". Despierta intriga apelando un FOMO genuino ya que compites instantáneamente en un "Scroll infinito de Feed". - Valida tras desplegar: Una vez insertado en tu código, corre hacia el Sharing Debugger de Facebook. Purifica la caché manual usando el botón "Scrape Again", obligando la actualización en sus memorias antes de compartirlo al mercado.
Preguntas Frecuentes (FAQ)
La resolución estándar recomendada globalmente por todas las plataformas es 1200 x 630 píxeles (ratio aproximado de 1.91:1). Sin embargo, asegúrate de mantener los elementos clave centrados y lejos de los bordes, ya que algunas plataformas como WhatsApp o ciertos formatos de Slack recortan las imágenes en formato cuadrado (1:1).
Sí. Aunque plataformas de Meta y LinkedIn usan exclusivamente og:, X (Twitter) prioriza sus propias etiquetas twitter:. Si Twitter no las encuentra, puede hacer "fallback" a OG, pero declarar explícitamente ambas (sobre todo twitter:card="summary_large_image") garantiza una apariencia infalible.
LinkedIn es altamente sensible a la longitud de la etiqueta og:title y al dispositivo. Si tu título excede los ~80 caracteres, es muy probable que se vea forzado a cortarse con puntos suspensivos ("..."). Mantén un copywriting directo y al grano.