Ir a contenido principal
Nota: Este contenido se tradujo a través de un software y es posible que no haya sido revisado. La versión en inglés se considera, por tanto, la versión oficial y es posible que haya sido actualizada. Para acceder a la versión en inglés, haz clic aquí.
Social

Solucionar problemas de vista preliminar del enlace en las publicaciones en redes sociales

Última actualización: agosto 16, 2021

Requisitos

Marketing Hub Professional, Enterprise
Marketing Hub Básico (versión anterior)

Cuando agregues enlaces a publicaciones en redes sociales en HubSpot, verás una vista preliminar que incluya una imagen destacada, título de página y descripción de la página. Si la imagen, el título o la descripción no aparecen o ves problemas con la imagen destacada, usa los pasos a continuación para solucionarrlos.

Las vistas preliminares en redes sociales se basan en metaetiquetas en la sección <head> del HTML de tu página. Estas etiquetas informan a los sitios de redes sociales como Facebook, LinkedIn y Twitter en que centrarse cuando creen una vista preliminar de tu enlace compartido. Las meta etiquetas básicas son:

  • og:title: el título de tu contenido.
  • og:type: el tipo de contenido, como un video o una página web.
  • og:image: la URL de la imagen para representar tu contenido.
  • og:url: la URL única de tu contenido que se utilizará como su ID permanente.
  • og:description: la descripción que resume tu imagen.

El título, la metadescripción y la imagen destacada se configuran automáticamente para publicaciones de blog. Para páginas de destino y páginas de sitio web, si bien el título y la metadescripción se establecen automáticamente, la imagen destacada debe establecerse manualmente

Nota: LinkedIn mostrará tu imagen destacada, título de página y URL en su tarjeta de vista preliminar, pero no incluirá tu metadescripción.

La imagen destacada, el título de la página o la descripción de la página no se muestran en la vista preliminar de la publicación

Si la vista preliminar de tu publicación en redes sociales no muestra la imagen destacada esperada, el título de la página o la descripción de la página, puedes resolver problemas en HubSpot usando herramientas de depuración externas.

Solución de problemas dentro de HubSpot 

Si estás enlazando a una publicación de blog, página de destino o página de sitio web alojada en HubSpot, asegúrate de que una imagen destacada esté configurada en la configuración de la página o publicación.

También puedes establecer manualmente una etiqueta og:image para agregar una imagen destacada: 

  • En tu cuenta de HubSpot, navega a las páginas de destino o páginas del sitio web.

  • Coloca el cursor sobre una página y haz clic en Editar
  • En el editor de contenido, haz clic en la pestaña Configuración y luego haz clic en Opciones avanzadas.  
  • En la sección Fragmentos de código adicionales, escribe este fragmento de código en el campo HTML del encabezado

 <meta property="og:image" content="IMG URL">

<meta name="twitter:card" content="summary_large_image">

  • En la parte superior derecha, haz clic en Publicar o Actualizar para activar los cambios.  

Solución de problemas con herramientas de desarrollador de navegador

Si estás compartiendo una página externa en tu publicación en redes sociales, puedes usar herramientas de desarrollador de navegador como herramientas para desarrolladores de Chrome para asegurarte de que se configuren correctamente las metaetiquetas para la página. Consulta la fuente de la página y luego comprueba y confirma lo siguiente:

  • La etiqueta og:image y otras metaetiquetas se muestran correctamente. 
  • Los detalles de cada etiqueta son correctos. Por ejemplo, comprueba que la URL de imagen destacada para la etiqueta og:image es correcta.
  • Solo hay una ocurrencia de cada tipo de metaetiqueta. Si hay múltiples eventos de la misma metaetiqueta, las redes sociales no pueden seleccionar la opción correcta cuando generas una vista preliminar del enlace.
  • Tus metaetiquetas están cerca de la parte superior del HTML. Si tienes códigos adicionales o marcadores antes de tus metaetiquetas, es posible que los rastreadores de redes sociales no puedan ubicar estas etiquetas.

inspect-for-featured-image


Solución de problemas con las herramientas de depuración de redes sociales

Si ves una discrepancia entre tu vista preliminar en redes sociales y las metaetiquetas, es posible que la red social necesite rastrear nuevamente recargar esa página. Usa las siguientes herramientas de validación en cada red social para descubrir cualquier error o activar un nuevo rastreo de página

  • Sharing Debugger de Facebook: Facebook vuelve a rastrear automáticamente contenido compartido cada 24 horas. Para activar manualmente un nuevo rastreo, haz clic en Raspar nuevamente en el Sharing Debugger.
  • Card Validator de Twitter: Twitter almacena contenido durante 7 días después de publicar un post. Haz clic en Vista preliminar tarjeta en el Card Validator para desencadenar un resumen de tu contenido.
  • Post Inspector de LinkedIn: LinkedIn almacena contenido durante 7 días después de publicar un post. Haz clic en Inspeccionar en el Post Inspector para activar un nuevo rastreo de tu contenido.

En general, cualquier post publicado antes del nuevo rastreo de la página seguirá conservando la imagen incorrecta. Si la etiqueta og:image no ha sido establecida para una página, la red social escaneará la página para encontrar la imagen más adecuada para incluirla en publicaciones en redes sociales, que suele ser la primera imagen que encuentra. Una imagen de vista preliminar del enlace pudiera no aparecer en absoluto si se usa un archivo robots.txt o un software de seguridad para evitar rastrear la página.

Problemas de presentación de imágenes destacadas 

Si la vista preliminar de tu publicación en redes sociales muestra la imagen destacada esperada, pero la imagen se muestra incorrectamente, puedes comprobar lo siguiente. 

El tamaño de la imagen o la proporción es incorrecta

Si la imagen destacada no aparece correctamente en tu vista preliminar de redes sociales (por ejemplo, la imagen está cortada o la proporción es incorrecta), es posible que debas editar la imagen para que tenga las dimensiones adecuadas para la red social en la que estás publicando y luego vuelve a publicar la página. 

Se recomiendan las siguientes dimensiones para la optimización de imágenes destacadas en cada red:

  • Facebook: 1.91:1
  • Twitter: 16:9 para publicaciones de fotos y 1.91:1 para imágenes destacadas en posts
  • Instagram (cuadrado): 1:1
  • Instagram (retrato): 4:5
  • Instagram (paisaje): 1.91:1
  • LinkedIn (paisaje): 1.91:1

Asegúrate de que cualquier archivo multimedia incluido en tus publicaciones de redes sociales siga las pautas de tamaño de archivo para cada red. Si HubSpot determina que un archivo es demasiado grande para publicarse en una red determinada, aparecerá una advertencia al crear la publicación en redes sociales. Estos son los tamaños de archivos máximos para cada red social

  • Facebook: 8MB (menos de 1MB recomendado para archivos PNG para evitar pixelación)
  • Instagram: 8MB
  • Twitter: 5MB (15MB para GIF)
  • LinkedIn: 10MB

Diferencias en el color de la imagen

Los perfiles de colores incrustados pueden afectar cómo aparece tu imagen destacada en tu publicación en redes sociales. Diferentes sistemas procesan, los perfiles de colores poco comunes de diferentes maneras, por lo que los colores pueden verse diferentes al obtener la vista preliminar de la imagen en tu administrador de archivos.

Puedes ejecutar tu URL de imagen a través de una herramienta externa para ver si usa un perfil de color poco común. Si es necesario, puedes eliminar el perfil de color que interfiere en una herramienta de edición de fotografías externas, como Photoshop y luego volver a publicar la página antes de publicar tu post en redes sociales.

Diferencias en la claridad de la imagen

El administrador de archivos de HubSpot utiliza la compresión de imágenes en JPEG y PNG para ayudar a optimizar velocidades de carga en tu contenido alojado en HubSpot. Las redes sociales también usan la compresión de imágenes en publicaciones, que pueden variar en la calidad de lo que ves en HubSpot.

Por esta razón, se recomienda usar imágenes de resolución relativamente alta para cada red. Si tu imagen no cumple con los requisitos de una red social, aparecerá una advertencia en la herramienta de publicación en redes sociales de HubSpot para ajustar la imagen según corresponda.